Customer Service Landing Page
T-Mobile Thuis (Dutch for home) is an internet provider in The Netherlands. I redesigned the landing page of their customer service. The goal of the redesign was to make it easier for customers to find answers to their questions online and to reduce the number of calls to the help center.
– UX Research
– UX Design
– UX Micro-copy
User research: heat maps
In order to determine which elements of the current landing page were and weren’t interacted with by customers, I analyzed heatmaps. The heatmaps (click & mouse movements) also gave me insight into how users interact with the page on different devices. The tool I used for this was Hotjar.
- Users don’t understand what is and isn’t clickable in the menu.
- Mobile users mainly interact with the menu, where desktop users interact more with the links under the menu.
- Links to topics for new customers are clicked less than other topics but are placed higher on the screens.
User research: Feedback survey
To understand the satisfaction of the current page, I analyzed the results of a feedback survey. This also gave me insight into the purpose of the user’s visit and into which subjects customers searched for most. The tool I used for this was Hotjar.
- Half of the respondents could not find what they were looking for and were going to call the helpdesk.
- Not only existing customers visited the support page, but also orientating potential customers searched for information on the page.
T-Mobile has strict style guidelines and an existing UI-kit. For this reason I used existing components and elements a much as possible. This also enabled me to rapidly create various mock-ups of what the page structure could look like. I was therefore able to demonstrate to stakeholders why certain components and elements should or should not be included on the page.
As mentioned above, the page had to be designed with as many existing components as possible. However, I did add one new component: an FAQ block. This block was designed to help customers find the answers to specific questions quickly.
Prototype (FAQ component)
Goal of the FAQ component:
- To give users texts which corresponded to their specific questions.
- To give more textual context than the top menu.
Getting as much relevant information as possible in a compact screen real estate.
After getting the green light on the design, it was time to fill an excel sheet with all the FAQ’s and their answers. This was an extensive process.
Although the designs I made were already high fidelity, I handed the designs over to a Visual Designer in order to make the designs pixel perfect and check if everything was according to the style guidelines. Then the designs were handed over to the frontend developer. I worked closely with the developer to ensure the interactions were implemented correctly.