Overview
Client: GWA Architecture
Industry: Architecture & Urban Design
Scope: Website strategy, UX/UI design, custom WordPress development
Timeline: ~8 weeks
Platform: WordPress (custom-built theme)
Live site: gwaarchitecture.com
GWA Architecture approached us to redesign their website from the ground up. The goal was not simply to refresh visuals, but to create a modern, minimal, story-driven digital presence that reflects how the firm thinks about architecture: context-first, narrative-led, and deeply visual.
The Challenge
GWA’s previous website no longer reflected the quality, scale, or narrative depth of their work.
Key issues included:
- Outdated layout and visual hierarchy
- Project imagery underutilized and constrained
- Limited storytelling around context and process
- No clear distinction between selected work and supporting content
At the same time, the site needed to speak to two different audiences:
- Primary: real estate developers
- Secondary: public sector organizations and the general public
The request was clear:
Simplicity. Bigger visuals. Modern layout. Storytelling over CTAs.
Discovery & Website Strategy
We began with a structured Business & Brand Discovery process, working from GWA’s existing brandbook (created by a separate agency). Our focus was not branding, but digital translation — turning an established brand system into a cohesive web experience.
Website Goals
- Present projects as narratives, not galleries
- Let architecture and imagery lead the experience
- Keep calls to action subtle and non-intrusive
- Build a flexible system that can scale with future content
Visual & UX References
During discovery, we reviewed architecture studios known for restrained, editorial-style websites, helping define:
- Generous white space
- Large, immersive imagery
- Calm, confident pacing
- Minimal interface elements
Information Architecture
We designed a clear, scalable page structure that supports storytelling while remaining easy to navigate:
Core Pages
- Home
- Projects (archive)
- Single Project pages
- Team
- Contact
This structure ensures the website can grow without visual or content overload.
Design & UX Approach
Design Principles
- Minimalism with intention
- Strong typographic hierarchy
- Image-led layouts
- Clear narrative flow between sections
Each project page was designed to communicate context, constraints, and outcomes, reflecting how architectural decisions are made in real life.
Before & After Highlights
Homepage
Before
- Limited visual impact
- No clear narrative hierarchy
- Projects not immediately showcased
After
- Large, immersive project imagery
- Clear storytelling flow from introduction to selected work
- Calm, editorial layout aligned with architectural values
Team Page
Before
- Basic listing without personality or structure
- Limited visual consistency
After
- Structured, modern layout
- Consistent portrait presentation
- Clear hierarchy that supports both people and roles
Projects Archive
Before
- Projects visually compressed
- No distinction between featured and supporting work
After
- Clean grid with breathing room
- Visual emphasis on selected projects
- Easy scanning for developers and public-sector users
Single Project Page
Before
- Limited storytelling
- Images not used to their full potential
After
- Story-driven layout
- Large-format imagery with contextual text
- Clear narrative from concept to execution
Development & Technical Implementation
The website was built using WordPress with a fully custom theme, allowing full control over design and performance.
Technical Features
- Custom post types for Projects and Team
- Flexible content blocks for future growth
- Performance-focused front-end development
- SEO-ready structure and clean markup
- Accessibility best practices applied without compromising design
- Land Acknowledgement integrated into the footer
The result is a system that is both editorially flexible and technically robust.
Collaboration & Process
The project followed a structured timeline:
- Week 1: Homepage design & site architecture
- Weeks 2–4: Full site design and approvals
- Weeks 5–8: Custom development and QA
Communication was handled primarily via email, with design check-ins and approvals at every major milestone to ensure clarity and alignment.
Results
The new GWA Architecture website:
- Accurately reflects the studio’s design philosophy
- Elevates projects through storytelling and imagery
- Provides a calm, confident experience for developers and public-sector audiences
- Is built to scale with future content and editorial needs
Key Outcomes
- Clear narrative-driven project presentation
- Strong visual hierarchy across all page templates
- Custom WordPress system tailored to architectural content
- Improved clarity, usability, and long-term maintainability
