The Challenge

Legat Architects—a distinguished architecture firm in Chicago sought creative design assistance from ArtVersion with the goal of revitalizing their web presence, and brand identity with a modern look. The project was all-encompassing, starting from a thorough overhaul of their website’s architecture and design aesthetic to refining the tonality. The objective was to craft a brand-new look and feel for Legat that was as contemporary as it was captivating, marking a new chapter in the firm’s rich design legacy.

Design Language

Telling a brand story is met at the intersection between innovative design language or UI elements, and a narrative that coordinates with those assets. For Legat, their vision was to tell their story in an engaging and inviting way. To achieve that, ArtVersion designed a modern and responsive WordPress website carefully engineered to highlight Legat’s architectural work. It was important to capture the integrity and detail behind every architectural design, thus the team made sure no detail was lost and utilized large, optimized imagery.

Image of a building over a pond, during the night.
Early wireframes of Legat

Data-Driven Design

To familiarize themselves with Legat and the architecture industry, ArtVersion created user personas to fully immerse themselves in the architecture headspace and understand Legat’s target audience best. Additionally, part of the undertaking was the coordination and organization of every project which included specific categorization of each project: learning, wellness, and community— supplemented by any related insight pages. This process was a key step throughout the project, from wireframe to development. ArtVersion worked with the Legat team to help structure the backend categorization of each project to ensure robust data entry and information organization that would allow users with a seamless user experience.

Conceptual Legat wireframes.

User Personas

Legat User personas and circular photos of each person.
pre k 12 popup screens learning section
A webpage showcasing a school interior.

There was also a conscious effort to ensure the visual hierarchy of every page had enough breathing room and white space for a sleek feel. Every project page unfolded like a visual tale of its own, employing a slider and meticulous photography of the architectural space. The color palette was chosen with precision as well with a rich and vibrant color scheme vibrancy and richness that reflected the new energy of the brand refresh. Videography on the home page hero also featured Legat spaces in a high-res quality, to offer further dynamism and lend another enriching way to share the visual narration of their story.

Website image collage displaying exterior balcony design and interior lobby rooms.
Web screens showcasing a dermatology office.
Mobile images of wellness section for Legat website.
Mobile screens displaying Community page for Legat.

Brand Identity

An all-encompassing website revamp often goes hand in hand with brand rejuvenation to ensure a cohesive brand representation. ArtVersion refined the Legat logo typeface with different font weights— using a robust, bold style for ‘Legat’ contrasted with a delicate, slimmer ‘Architects,’ added a dynamic quality to the brand identity. The overall brand font, Poppins, perfectly complimented the geometric shape elements that uniquely represented each sector of Legat’s portfolio: learning, wellness, and community.

Client logo
Company brand typography of Poppins.
Company brand colors title card.
Legat color brand pallet.
Selection of images title card.
Three photos showcasing exteriors and interior of Legat spaces.
Legat Logo Guidelines
Content Development title

To accompany the visual design, there was a comprehensive refresh of Legat’s messaging and narrative ethos, breathing new life into their story. The content strategy team collaborated closely with Legat, meticulously crafting a narrative woven around a core theme: design with a human-focused lens. This central theme emerged from Legat’s mission to underscore their positive impact on their communities and their commitment to enhancing lives. Intentionally sculpted around this human-centric perspective, the narrative was instrumental in boosting SEO through strategic keyword integration.

Legat collateral items such as business cards, templates, and envelops.

Cohesive Collateral

To weave the brand’s revitalized identity into every aspect of its presence, ArtVersion also overhauled Legat’s marketing materials. This included an updated brand style guide, meticulously redesigned collateral templates, modernized business cards, sleek presentation templates, and more. This ensured that every touchpoint reflected the rejuvenated brand.

proposal template page
Postcard showcasing the exterior of a school building.
Front of business card
Back of business card.

The Results

The responsive website refresh along with its coordinating materials helped elevate the brand with a renewed, contemporary feel. The website allows Legat’s audience to newly discover the impactful architectural work that they continuously design to improve lives and inspire communities.

Learning webpage for Legat—desktop and mobile.