Ateljé Nord
Website redesign for an architectural firm.
Consulting project • UX Research • UX/UI Design • Rapid prototyping
My role & responsibilities
Sole consultant
UX Research: Stakeholder interview, Competitor Analysis
UX Design: Wireframes, Rapid and Hi-fi prototyping
Project context
Client: Ateljé Nord, Architectural firm
Dec 2020 - June 2021
Consultant job
Tools
Figma
Problem
Current website doesn’t show any company identity, unsure of who their target group is
The current website doesn’t allow the users to connect neither with the content, nor the company behind them. As the user wasn’t able to reach the company on their webage, but through Instagram and Google, I saw clear risks in loosing potential customers. How might we showcase the client’s projects, but also identity in a clear way?
Background + Goal
A minimalistic website redesign showcasing client’s projects and their competence
Ateljé Nord is an architectural firm with 12 employees in Stockholm, Sweden with the goal of using sustainable materials from Swedish nature. During the winter of 2020, they turned to me to give their website a facelift and ideas on how to present their work as it at the time only consisted of an image carousel slideshow.
Goal: to create a website redesign, with an emphasis on showcasing their projects in a “minimalistic way, but a possibility in using contrasts”.
Challenges
Different perspectives of how design should look and feel from an architectural and UX point of view
What came through early in the project was that I noticed my stakeholders had strong opinions of what design should look and feel like. Even though I did not completely agree with their vision, I wanted to incoorporate their wishes in my concepts. This is what I identified as the biggest challenges of the project:
Stakeholder interview
Wanted to find implicit needs as I was suspecting misalignment in demand and Business & UX needs
At the start of the project I received examples of inspirational websites (see gif) my client had in vision for their own website. As these examples were mostly inspiration for form rather than function, I asked my client:
What is the goal of your webpage?
What do you want to emphasise, what is your firm specialists in?
Who do you want to reach out to?
From the answers I noticed that my client wanted to appeal to the architect crowd. When in reality, their target group was regular home owners with a love for scandinavian design and natural materials.
Competitive analysis
Researched the biggest architect firms in Sweden to visualise and communicate the UX perspective
I now understood that I needed to be very communicative in why we should bring in the UX perspective in our vision to my client. I thought, what’s no better than to show how the most successful firms are designing their websites?
From analysing 10+ of the biggest Swedish architect websites, my main insights were:
Large photos with descriptive text of the project and filters for the user to connect and recall the projects.
Usage of storytelling for the individual projects, starting with the final product and short context, then the process that followed.
Personality, connecting with the architects of the firm.
Rapid prototyping
The best way for us to have a shared vision was through my rapid prototyping during client meetings
The results from the competitive analysis created some leeway in how I could proceed with my iterations. I soon found out that the best way for us to communicate what we wanted to achieve from an architect and UX perspective was through rapid prototyping.
During each meeting I first went through what I had changed since last meeting, then shared my Figma files and changed them as we discussed changes.
Solution
Keeping it minimalistic with large imagery and adding personality, appealing to most users
As I went through the last iterations I tested the prototype with users who wanted to hire an architect in the future. The response was mostly positive, but they wanted to get more of a feel for the whole process and were interested in details. With the test results and meeting with my client, the prototype shaped into our last iteration:
Final changes:
I created an About Us page which has the company story, their specialised competence, information about the employees.
Using a grid system for the projects instead of a carousel, resemblence to a brick wall.
Detailed project page, with constructural drawings, concepts and final product.
Impact and learnings
A minimalistic website template created easy handover to the client for further project updates
This project was one of my first consulting projects so I definitely learned A LOT! From how to unravel the actual client needs, to find a common ground and shared view through communications. What was especially appreciated and what I learned was:
Less is more, even though we wanted to add more interactions, which I suggested us could be done by changing the website builder, that wasn’t in the interest of the client. Keeping it simple and practical created an easy handover.
Stepping outside of your own study-bubble. For this project to work I couldn’t be defensive, even if I was in the start concerning what’s good for UX and not. Meeting my client in the middle made it easier for us both to take in eachothers’ perspectives.
Visit my other projects🧡
Navigating through MDU
Guerilla Testing • Agile UX • UX Research • UX/UI Design • Industry-based project
