Azets is an international financial advisory group. Their services range from accounting to payroll to audits and digital solutions. They have presence in 7 different countries. One of the first points of contact with their customers is their website. The objective of the project was to move the content management system (CMS) platform from Umbraco to Optimizely. With this overhaul, they hired me to re-design their website to improve their UX and “freshen up” their UI. The re-design would also be applied to all their countries’ websites (11 in total) to get a cohesive and coherent design.
There’s three main groups of users in this project. The private users, and the corporations that are looking for a financial service or advisor, and the people looking to join the company. Each group has their unique flows with different points of entry.
The company had around 11 websites, this included a global website, websites for the Nordics, Baltics, Ireland, and UK countries. These 11 websites all had different designs and information architecture. The new product would unite these websites under a common architecture and layout, share component patterns and overall UI design. Optimizely works with “blocks” so Azets can build future pages as needed. The blocks are used as templates where the content can be modified but the design is maintained. The flexibility of content is necessary to account for the different markets, for the regions.
This project started with a meeting with the marketing lead, the PM, and the PO. In the meeting, they explained and shared their expectations and perceived needs. We also went through the roadmap, the first step was to implement the changes in the UK and Ireland websites, followed by the Nordics.
I started with the mapping of the websites, so I could find the components and features that the websites had in common. With this I could compare their different patterns, and know which ones were essential, and which ones could be changed or integrated in other features so the redesign would work for every country.
We then held workshops with the different country teams. Four different workshops where we covered user personas, expectations, pain points, essential functions, and areas of opportunity. Some regions also had web analytics, which they shared, this made easier to pinpoint existing patterns that were not used or confusing to the user. After the workshop I analysed the information and with the steering group, decided on the key pages, blocks and functions to develop. A priority list was defined and I could start the Figma work.
In general the develop stage of my design process for this project was: Design three different medium fidelity wireframes for the specific “block”, elements, or component to develop. Get feedback from dev team and management. Iterate and adjust, confirm changes and create a high fidelity prototype. This happened for each page until we had all the pages for the new website. Here are some of the changes made in the main page to give it a fresher look and make it more dynamic.
Once we had an high fidelity prototype of the website I had 5 different showcases, with the country teams and the corporate leaders. From their feedback a final iteration was made and I delivered the design to the development team.
Late into this project a branding team and graphic designers were added. Which came with challenges regarding branding over accessibility, as well as feedback about the UI design. The branding team was involved just before the first showcase, so we had to reach a compromise fast about the accessibility issues. We reached an understanding and thanks to the use of tokens and components, most of the changes were fast to implement.
It is essential to ensure that everyone on a team is aligned. In this project, our messages would sometimes get lost
or “diluted” as they passed from person to person. Specially considering we were working with slightly different time
zones. It’s crucial to have clear, direct channels of communication..