Dustin
User testing
Deep interviews
Card sort
5 second test
Archetypes
Empathy mapping
Accessibility
Design system
A/B testing
Agile development
Workshops
Design strategy
Dustin
User testing
Deep interviews
Card sort
5 second test
Archetypes
Empathy mapping
Accessibility
Design system
A/B testing
Agile development
Workshops
Design strategy
Dustin
User testing
Deep interviews
Card sort
5 second test
Archetypes
Empathy mapping
Accessibility
Design system
A/B testing
Agile development
Workshops
Design strategy
Role
UX/UI Designer
Time frame
2022
Platform
Web
Role
UX/UI Designer
Time frame
2022
Platform
Web
Role
UX/UI Designer
Time frame
2022
Platform
Web
The scope
Dustin is a leading online IT partner in the Nordics and the Benelux, offering over 280,000 products and services to B2B and B2C customers. Even though they had a proper design team, insights were lacking in several areas - two such areas were the start page and the B2C affair. The design team was also tackling several problems, such as a lack of shared way of working and an outdated design system. These problems made it hard for the team to keep up with changing user needs and market demands, potentially impacting customer satisfaction and revenue growth."
Deliverables
Focusing on the B2B affair, I set out to redesign the start page by designing a hi-fi prototype and conducting user testing. As hypotheses were confirmed and user needs were identified, the new start page could fulfill user needs and increase key conversion goals. Given the lack of B2C research, I was tasked with investigating consumer needs. In-depth interviews with potential users resulted in suggestions for improving Dustin's B2C site and driving revenue. Beyond gathering user insights, I looked at the internal design strategy and how to align the design team's way of working. This involved driving the work with the design system and establishing shared practices for UX research. Moreover, by creating user archetypes, I facilitated an effective way for the team to communicate user needs to stakeholders.
The scope
Dustin is a leading online IT partner in the Nordics and the Benelux, offering over 280,000 products and services to B2B and B2C customers. Even though they had a proper design team, insights were lacking in several areas - two such areas were the start page and the B2C affair. The design team was also tackling several problems, such as a lack of shared way of working and an outdated design system. These problems made it hard for the team to keep up with changing user needs and market demands, potentially impacting customer satisfaction and revenue growth."
Deliverables
Focusing on the B2B affair, I set out to redesign the start page by designing a hi-fi prototype and conducting user testing. As hypotheses were confirmed and user needs were identified, the new start page could fulfill user needs and increase key conversion goals. Given the lack of B2C research, I was tasked with investigating consumer needs. In-depth interviews with potential users resulted in suggestions for improving Dustin's B2C site and driving revenue. Beyond gathering user insights, I looked at the internal design strategy and how to align the design team's way of working. This involved driving the work with the design system and establishing shared practices for UX research. Moreover, by creating user archetypes, I facilitated an effective way for the team to communicate user needs to stakeholders.
The scope
Dustin is a leading online IT partner in the Nordics and the Benelux, offering over 280,000 products and services to B2B and B2C customers. Even though they had a proper design team, insights were lacking in several areas - two such areas were the start page and the B2C affair. The design team was also tackling several problems, such as a lack of shared way of working and an outdated design system. These problems made it hard for the team to keep up with changing user needs and market demands, potentially impacting customer satisfaction and revenue growth."
Deliverables
Focusing on the B2B affair, I set out to redesign the start page by designing a hi-fi prototype and conducting user testing. As hypotheses were confirmed and user needs were identified, the new start page could fulfill user needs and increase key conversion goals. Given the lack of B2C research, I was tasked with investigating consumer needs. In-depth interviews with potential users resulted in suggestions for improving Dustin's B2C site and driving revenue. Beyond gathering user insights, I looked at the internal design strategy and how to align the design team's way of working. This involved driving the work with the design system and establishing shared practices for UX research. Moreover, by creating user archetypes, I facilitated an effective way for the team to communicate user needs to stakeholders.
01
Tending to a neglected start page
For being an e-commerce site that sells products, the old start page was astonishing in the sense that the products were nowhere to be found. Through in-depth interviews with users, it became evident that none of their needs were being met with the old design. The page was cluttered with oversized banners, resembling an advertisement space rather than a storefront. Users expressed a desire for personalised content: everything from products and campaigns to shortcuts to frequently used functionality. Using the interviews as a basis, I set out to redesign the neglected start page with the aim of meeting user needs and creating an inviting storefront for Dustin.
01
Tending to a neglected start page
For being an e-commerce site that sells products, the old start page was astonishing in the sense that the products were nowhere to be found. Through in-depth interviews with users, it became evident that none of their needs were being met with the old design. The page was cluttered with oversized banners, resembling an advertisement space rather than a storefront. Users expressed a desire for personalised content: everything from products and campaigns to shortcuts to frequently used functionality. Using the interviews as a basis, I set out to redesign the neglected start page with the aim of meeting user needs and creating an inviting storefront for Dustin.
01
Tending to a neglected start page
For being an e-commerce site that sells products, the old start page was astonishing in the sense that the products were nowhere to be found. Through in-depth interviews with users, it became evident that none of their needs were being met with the old design. The page was cluttered with oversized banners, resembling an advertisement space rather than a storefront. Users expressed a desire for personalised content: everything from products and campaigns to shortcuts to frequently used functionality. Using the interviews as a basis, I set out to redesign the neglected start page with the aim of meeting user needs and creating an inviting storefront for Dustin.
Old B2B start page with annotations, highlighting some of the main problems and pain points.
02
User testing the new prototype
Using the insights from the interviews and data from analytics, I created a hi-fi prototype aimed at meeting both user and business needs. Hypotheses such as "personalisation will boost conversion" and "more products will increase relevance for users" guided the approach for further user testing with the prototype. The Think Aloud method was used in usability tests with current users, along with a Card Sort exercise where users ranked start page elements from most to least important in FigJam.
02
User testing the new prototype
Using the insights from the interviews and data from analytics, I created a hi-fi prototype aimed at meeting both user and business needs. Hypotheses such as "personalisation will boost conversion" and "more products will increase relevance for users" guided the approach for further user testing with the prototype. The Think Aloud method was used in usability tests with current users, along with a Card Sort exercise where users ranked start page elements from most to least important in FigJam.
02
User testing the new prototype
Using the insights from the interviews and data from analytics, I created a hi-fi prototype aimed at meeting both user and business needs. Hypotheses such as "personalisation will boost conversion" and "more products will increase relevance for users" guided the approach for further user testing with the prototype. The Think Aloud method was used in usability tests with current users, along with a Card Sort exercise where users ranked start page elements from most to least important in FigJam.
Screenshot of the card sort exercise during a user test with a B2B customer.
03
A start page designed after the users' needs
The last round of user testing confirmed some hypotheses and provided insights into new needs. Using these findings, I iterated upon the prototype one last time before handing it over to developers. Goal metrics for the new design included increasing clicks to product pages and average order value. Our B2B users sought a personalised start page with tailored product recommendations, leading to the integration of the AI-driven merchandising tool Elevate in the new redesign. With this as a basis, the main enhancements I implemented in the new design were:
Personalised categories placed in the fold for quicker navigation.
Individualised product recommendations in a new compact product card.
Two new card designs of products and campaigns/news.
A banner carousel creating more ad slots without compromising monitor space.
Product carousels allowing to show more products but in a smaller area.
Information banners below the header for highlighting larger campaigns.
03
A start page designed after the users' needs
The last round of user testing confirmed some hypotheses and provided insights into new needs. Using these findings, I iterated upon the prototype one last time before handing it over to developers. Goal metrics for the new design included increasing clicks to product pages and average order value. Our B2B users sought a personalised start page with tailored product recommendations, leading to the integration of the AI-driven merchandising tool Elevate in the new redesign. With this as a basis, the main enhancements I implemented in the new design were:
Personalised categories placed in the fold for quicker navigation.
Individualised product recommendations in a new compact product card.
Two new card designs of products and campaigns/news.
A banner carousel creating more ad slots without compromising monitor space.
Product carousels allowing to show more products but in a smaller area.
Information banners below the header for highlighting larger campaigns.
03
A start page designed after the users' needs
The last round of user testing confirmed some hypotheses and provided insights into new needs. Using these findings, I iterated upon the prototype one last time before handing it over to developers. Goal metrics for the new design included increasing clicks to product pages and average order value. Our B2B users sought a personalised start page with tailored product recommendations, leading to the integration of the AI-driven merchandising tool Elevate in the new redesign. With this as a basis, the main enhancements I implemented in the new design were:
Personalised categories placed in the fold for quicker navigation.
Individualised product recommendations in a new compact product card.
Two new card designs of products and campaigns/news.
A banner carousel creating more ad slots without compromising monitor space.
Product carousels allowing to show more products but in a smaller area.
Information banners below the header for highlighting larger campaigns.
Before and after of the start page.
04
Creating archetypes to get rid of biases
Even though substantial user testing had been conducted by current and previous designers, most findings had been lost due to a lack of documentation. To align the design team regarding user research, I established a research repository as a shared space for insights. However, conveying our findings in this manner to stakeholders proved challenging, demanding a need for a more direct way of communicating our users internally within the company. Upon examining existing personas, I quickly noticed sexist biases with descriptions such as "Johan, CEO, living in a villa" and "Jessica, receptionist, living in an apartment". To address these types of biases and communicate user profiles in a neutral manner, I developed archetypes of our B2B and B2C users highlighting only their goals, needs, and motivations. The archetypes were labeled as "version 1", signifying that they were intended to be living documents constantly updated and expanded.
04
Creating archetypes to get rid of biases
Even though substantial user testing had been conducted by current and previous designers, most findings had been lost due to a lack of documentation. To align the design team regarding user research, I established a research repository as a shared space for insights. However, conveying our findings in this manner to stakeholders proved challenging, demanding a need for a more direct way of communicating our users internally within the company. Upon examining existing personas, I quickly noticed sexist biases with descriptions such as "Johan, CEO, living in a villa" and "Jessica, receptionist, living in an apartment". To address these types of biases and communicate user profiles in a neutral manner, I developed archetypes of our B2B and B2C users highlighting only their goals, needs, and motivations. The archetypes were labeled as "version 1", signifying that they were intended to be living documents constantly updated and expanded.
04
Creating archetypes to get rid of biases
Even though substantial user testing had been conducted by current and previous designers, most findings had been lost due to a lack of documentation. To align the design team regarding user research, I established a research repository as a shared space for insights. However, conveying our findings in this manner to stakeholders proved challenging, demanding a need for a more direct way of communicating our users internally within the company. Upon examining existing personas, I quickly noticed sexist biases with descriptions such as "Johan, CEO, living in a villa" and "Jessica, receptionist, living in an apartment". To address these types of biases and communicate user profiles in a neutral manner, I developed archetypes of our B2B and B2C users highlighting only their goals, needs, and motivations. The archetypes were labeled as "version 1", signifying that they were intended to be living documents constantly updated and expanded.
First archetypes created for Dustin's users, categorised into B2B and B2C. Details blurred because of confidentiality.
05
Understanding the B2C affair
Due to Dustin heavily focusing on the B2B affair, no user research had ever been conducted on the B2C market. Since consumer revenue was steadily decreasing, I was tasked with researching potential B2C customers to understand their needs and motivations. This involved not only in-depth interviews, but also establishing a process within the design team for recruiting B2C participants for user tests. The interviews revealed key areas critical to user satisfaction, culminating in a list of recommendations for relevant teams on how to improve the B2C site to increase revenue.
05
Understanding the B2C affair
Due to Dustin heavily focusing on the B2B affair, no user research had ever been conducted on the B2C market. Since consumer revenue was steadily decreasing, I was tasked with researching potential B2C customers to understand their needs and motivations. This involved not only in-depth interviews, but also establishing a process within the design team for recruiting B2C participants for user tests. The interviews revealed key areas critical to user satisfaction, culminating in a list of recommendations for relevant teams on how to improve the B2C site to increase revenue.
05
Understanding the B2C affair
Due to Dustin heavily focusing on the B2B affair, no user research had ever been conducted on the B2C market. Since consumer revenue was steadily decreasing, I was tasked with researching potential B2C customers to understand their needs and motivations. This involved not only in-depth interviews, but also establishing a process within the design team for recruiting B2C participants for user tests. The interviews revealed key areas critical to user satisfaction, culminating in a list of recommendations for relevant teams on how to improve the B2C site to increase revenue.
A slide from the B2C user test presentation held to stakeholders, revealing the findings related to sustainability through an empathy map. Details blurred because of confidentiality.
06
Fostering collaboration through the design system
While the Dustin interface appears clean and consistent at first glance, the underlying design system was outdated and disorganised. With both designers and frontend developers working in silos, it was unclear which components existed and what their guidelines were. It became apparent that establishing a clear, coherent, and user-friendly design system was essential to align the UX and UI of Dustin. To achieve this, I took the lead in driving the work with the design system toward a shared and updated vision, collaborating closely with the design team and frontend team. Through this, documentation and guidelines were created, fostering a shared understanding of Dustin's design system.
06
Fostering collaboration through the design system
While the Dustin interface appears clean and consistent at first glance, the underlying design system was outdated and disorganised. With both designers and frontend developers working in silos, it was unclear which components existed and what their guidelines were. It became apparent that establishing a clear, coherent, and user-friendly design system was essential to align the UX and UI of Dustin. To achieve this, I took the lead in driving the work with the design system toward a shared and updated vision, collaborating closely with the design team and frontend team. Through this, documentation and guidelines were created, fostering a shared understanding of Dustin's design system.
06
Fostering collaboration through the design system
While the Dustin interface appears clean and consistent at first glance, the underlying design system was outdated and disorganised. With both designers and frontend developers working in silos, it was unclear which components existed and what their guidelines were. It became apparent that establishing a clear, coherent, and user-friendly design system was essential to align the UX and UI of Dustin. To achieve this, I took the lead in driving the work with the design system toward a shared and updated vision, collaborating closely with the design team and frontend team. Through this, documentation and guidelines were created, fostering a shared understanding of Dustin's design system.
Example of component and guidelines in the design system. Details blurred because of confidentiality.
