Bespoke portfolio web design for Wearthly Studio, spotlighting their Eco-centric projects.
Web Design
Wordpress Development
Live WordPress Site
Wearthly Studio: The Eco-centric urban design studio
Wearthly Studio, an ecosystem-centric design studio specializing in minimalist, eco friendly and geometric aesthetics for cities, approached me with an urgent need for a professional website. Victoria, the founder, required a sleek online presence to support her bid for important contracts. The project demanded both speed and precision, as the website had to reflect the studio’s unique philosophy while being completed within three weeks.
Collaborating with Victoria was fun. She already had a strong idea of what she wanted the website to look like and this made iteration and feedback really rapid and smooth between us. The result is a beautiful, mobile responsive site that is full of personality, showcases the studio's projects and invites visitors to make enquiries.
Timeline
3 weeks
Client
Wearthly Studio
Date
January, 2026
Industry
Urban Design
Visit Live Site
Crafting a Digital Identity Under Pressure
Understanding the studio's unique value and audience
To better understand how to design for Wearthly, I needed to understand its offerings and who its target users are. Victoria was very passionate and descriptive in explaining to me the unique space they occupy in the Design and Construction industry. Wearthly studio is an Ecosystem-centric Design Studio that helps cities plan and design Ecofriendly buildings and spaces, so they work with the government and large organizations on creative building projects. Designing content-first helps the website to stay structured. I collaborated with victoria to organize the content and navigation in a way that it feels intuitive and easy to use.
Catching the mood
To help me understand the mood she was going for victoria shared a moodboard. his helped understand the vibe she was going for: Minimal, Pastel, Type-focused, Swiss grid inspired layouts.
Aesthetic Check
After analyzing the moodboard, I gathered a selection of fonts and colors that matched the feelings I got from the moodboard. I streamlined the number of options to facilitate quick decision making. Here are the options that were presnted:
Sans Serif
Inter
Archivo
Manrope
Serif
Fraunces
Cormorant Garamond
Cormorant Upright
Playfair Display
Display
Spline Sans
Tenor Sans
Anybody
Great Warrior
Angle & Fairy
Melodrama
Clash Display
Bricolage Grotesque
Typefaces
Wearthly Studio V1
A simple homepage
The goal of the homepage was to make sure visitors could instantly understand what the studio was about. The copy used, the whitespace and the colors helped to communicate that effectively.
Current Home Screen
Showcasing projects with style
We wanted the website to be built around the projects, so clicking the enter button from the homepage takes you directly to the projects gallery. In the Projects page the names of each project are clearly visible, a deft hover interaction shows you brief details about each project and clicking takes you to that specific project. The animations were made using custom CSS and GSAP to ensure smooth micro-interactions.
Projects Page
Inviting visitors to say Hi!!
The main footer (found on the about us page) was designed as a contact form to invite users to leave a message. It was crafted such that filling it would be satisfying and it would take less than 30 seconds.
Footer
Early concepts for the homepage
These are early iterations of the Studio homepage. We went through several iterations before we settled on the current one. I created the illustrations. Here are some of my favorites:
Early homepage concept 1
Early homepage concept 2
Homepage v3
Wearthly Studio V2
Designing on the edge
After building the version 1 of the website in 2025, by January 2026 I was contacted again for a redesign of the project to reflect the new direction the studio is heading in, as well as add updates on projects that have been completed during the past year. Victoria as always is so detailed and this time we did the ideation on a Miro Board.
Ideation for Wearthly Studio v2
A new Home
We made the homepage more beautiful and communicative while still keeping it minimal and communicating the eco friendly focus of the studio.
New homepage design
About Us
The about page was also transformed, using more brand colors, subtle animations and a few new sections were added.
Video of new website
Lexicon
Lexicons are a vocabulary of a person or organization. In this case we used this page to describe words that are deeply connected with Wearthly studio and their meanings.
Lexicons
Photography
New photo albums were added showcasing Victoria's work of capturing breath taking scenes and beautiful architecture from all over the world
Photography
Architecture
The Architecture section is full of case studies that have been curated to showcase Wearthly Studio's expertise and massive impact in Architecture in different cities al over the world. With their eco-centric ideologies the buildings always feel connected to the earth and alive.
Architecture
Reflections
Design is alive
This project has been through so many iterations and versions even within larger versions and it keeps on getting better and expanding on what was existing before. At the current stage it is truly a work of art. Looking forward to the next iteration and what we can do with that. This is a great reminder that design is alive and should never be static, iteration and growth are key in every project and should not be avoided.
Next Steps
Well we've been monitoring user traffic using Google Analytics, and it's been great so far. In terms of conversions (enquiries) it is looking to outperform the previous version, which is what you want to see. Might tweak a few things to improve performance soon.
Visit Live Site
Looking to redesign your business website or get one built from scratch? I'm your best bet.
Let's Connect 👋
More Projects
Non-Profit Organization
Studio Portfolio