Redesign of the Urban Planning Agency “BASE” Website | Max Ferron

Back to projects
Sep 19, 2019
4 min read

Redesign of the Urban Planning Agency “BASE” Website

Information architecture, wireframing, and content integration for a refreshed digital experience.
Cover image for the baseland website redesign project

1. Context

BASE, a leading urban planning agency known for its innovative projects, aimed to refresh its website to better showcase its research and development initiatives. The goal was to enhance the visibility of their unique methodologies and approach in tackling urban challenges.

2. Objective

The primary objective was to highlight the agency’s distinctive identity and design methodologies through an engaging and well-structured online portfolio of its key projects, enhancing user engagement and positioning the agency as an innovator in its field.

In keeping with this objective, the website’s visual identity had to stand out from the competition in the architecture/urban planning field, who are often represented by a very clean, straightforward and conservative style.

A laptop displays a homepage with a fullscreen black and white animated image associated with main navigation elements like menu and links

The homepage is composed by a fullscreen black and white animated image for immersion

3. Process

3.1. Analysis

To ensure a competitive edge, I conducted a comprehensive benchmark analysis of both national and international agencies, focusing on their digital presence and content strategies. This was followed by defining personas to align the website’s structure with the needs and behaviors of its target audience, including government entities, urban planners and potential partners.

An urban planning agency obtains projects through public tenders. The key user, is a public government project manager who will want to understand the innovative aspect of the agency’s approach and easily find similar references.

the website tree structure is represented by different columns and sub-sections where the links between sections are materialised

Website tree structure, with easy links to projects from all methodology-related sections

Outcome: Identified key differentiators and best practices that informed the site’s structure and content, with a focus on user-centric navigation and project discoverability.

3.2. Information Architecture

I led the creation of a robust information architecture, describing the content hierarchy and categorization of project case studies.

The aim was to provide intuitive navigation paths via filtered links by adding the right category labels to the projects. Indeed, the projects had to be easily accessible from the sections linked to the agency’s innovation and methodology: “imaginary” and “logical”.

Representation of the BASE Site content architecture using xmind software with a complex flowchart with interconnected nodes and lines on a black background, labeled "Site Web BASE"

Site content architecture using xmind software

Impact: Improved navigation resulted in a 25% reduction in bounce rate and a 40% increase in page views per session after launch, showing that users were more engaged with the content and exploring more projects.

3.3. Wireframing and Prototyping

I led the design of high-fidelity wireframes and interactive prototypes, ensuring seamless collaboration with the WordPress development team. In parallel, I developed a web-based version of the print agency’s visual identity, translating it into digital-friendly formats.

Key Achievement: Streamlined handoff between design and development teams, reducing rework time by 20%.

3.4. Content Integration and SEO Optimization

Beyond design, I took charge of content strategy and integration. This included writing thematic articles, optimizing project case studies for SEO, and creating engaging visual content, all of which were incorporated into the WordPress CMS.

A laptop displays a webpage with various articles on urban topics, including "Smart City" with vibrant green and purple graphics.

Visual of the "Research" page with various articles on urban topics

Results: The integration of SEO best practices resulted in a 15% improvement in organic traffic within the first three months.


Tools Used

  • Adobe XD for wireframing and prototyping
  • XMind for information architecture and persona development
  • WordPress for content integration and site management