The Challenge
creating presence
Linea 7 is a multidisciplinary design firm that had an incredible portfolio of work but no online presence or brand identity. They needed a website that matched the elegance and quality of their work in order to gain new leads for future projects.
The Solution
an elegant portfolio
I worked quickly with Linea 7’s team creating several design directions and a website that allowed their beautiful documentation to be front and center supported by tasteful typography and color choices.
![Website Screenshot - home page](https://cdn.prod.website-files.com/667efc7de3b68ec15a6e6d9b/668d5c4de70da3205daedb12_Screenshot%20-%20Hero.webp)
Exploration
creating & iterating
Since Linea 7 had no design assets and a clean slate a large part of this project involved narrowing down options and refining the design language for the brand.
I started by creating three initial designs for the homepage to give us several different styles to choose from, they varied from very light and clean using geometric sans serifs to a dark theme with an artsier feel and layouts. We ended up going with Option B which I continued to refine as we moved forward.
![Linea 7 Wireframe - Version C](https://cdn.prod.website-files.com/667efc7de3b68ec15a6e6d9b/668d5c53e251a9222d982aed_Option%20C.webp)
![Linea 7 Wireframe - Version B](https://cdn.prod.website-files.com/667efc7de3b68ec15a6e6d9b/668d5c53e251a9222d982a99_Option%20B.webp)
![Linea 7 Wireframe - Version A](https://cdn.prod.website-files.com/667efc7de3b68ec15a6e6d9b/668d5c54e251a9222d982ba6_Option%20A.webp)
![Image of building designed by Linea 7](https://cdn.prod.website-files.com/667efc7de3b68ec15a6e6d9b/668d5c5af0dee833f66d6de9_CS-Espana-6.webp)
Web Design
creating a dynamic portfolio
Once we had landed on a general design style I dialed in the details using Roc Grotesk as the Display typeface paired with Sweet Sans Pro for body text. For the color palette we went with a dark theme grayscale with a bit of warmth added in to complement the soft lighting used in a lot of Linea 7’s documentation.
With regards to the structure we went for a minimal and easy to navigate experience including a dynamic home page that explained the studio's capabilities, and individual project pages that exhibited the project summary, design features, and images of the final product.
![Website Screenshot - Takahiro's home](https://cdn.prod.website-files.com/667efc7de3b68ec15a6e6d9b/668d5c675c9e5104376cff49_Screenshot%20-%20Taka%202.webp)
![](https://cdn.prod.website-files.com/667efc7de3b68ec15a6e6d9b/668d5c685c9e5104376cff71_Takahiro-7-Web.webp)
![](https://cdn.prod.website-files.com/667efc7de3b68ec15a6e6d9b/668d5c736f4ced05a0bbbef8_Takahiro-6-Web.webp)
![](https://cdn.prod.website-files.com/667efc7de3b68ec15a6e6d9b/668d5c736f4ced05a0bbbf0f_Takahiro-8-Web.webp)
Development
and... launch
When it came to development I created the website using Webflow, it was a relatively seamless process where I added in interactions built out the CMS structure for the portfolio and ensured the site was completely responsive and mobile optimized.
![Mobile Website Screenshot - featured project](https://cdn.prod.website-files.com/667efc7de3b68ec15a6e6d9b/668d5c7b0d3f789dd368f230_Mobile%20Screenshot%20-%20Featured.webp)
![Mobile Website Screenshot - Gallery page](https://cdn.prod.website-files.com/667efc7de3b68ec15a6e6d9b/668d5c7c0d3f789dd368f2df_Mobile%20Screenshot%20-%20Gallery.webp)
![Mobile Website Screenshot - Project page](https://cdn.prod.website-files.com/667efc7de3b68ec15a6e6d9b/668d5c7c0d3f789dd368f317_Mobile%20Screenshot%20-%20Project.webp)
![Website Screenshot - our projects section](https://cdn.prod.website-files.com/667efc7de3b68ec15a6e6d9b/668d5c89698932b0ccfffc66_Screenshot%20-%20Projects.webp)
![](https://cdn.prod.website-files.com/667efc7de3b68ec15a6e6d9b/668d5c8a698932b0ccfffd30_CS-Fernando-01.webp)
![Website Screenshot - about section](https://cdn.prod.website-files.com/667efc7de3b68ec15a6e6d9b/668d5c969e081f006701acee_Screenshot%20-%20Fresh%20Approach.webp)
![](https://cdn.prod.website-files.com/667f2aa1693e62414ab7b59f/667f7d64c87e31bab048313b_61d85f2cf2b2633420f61c55_Key%2520Art.jpeg)