Techem Website Redesign
“Techem is a leading service provider for heating and operating costs billing. We completely restructured and redesigned their internet presence. My focus was creating a visual and content-related concept for the new website as well as establishing a tracking approach for the finished product.”
Personas, User Journeys and Feature Mental Model
Before I started my internship as a UX designer at D&B Interactive the UX team already workshopped the personas and ideal user journeys with the customer. Additionally they created a Mental Model Feature Roadmap that would be supplemented more during the project development.
Feature Mental Model
Information Architecture
My first task in this project was categorizing the content of the previous information architecture. The main takeaways from the previous architecture were that content of one topic was hidden in different navigation paths. Additionally, it became apparent that the previously used customer groups did not reflect the customers, who actually used the website.
For the first iteration we concentrated the content on the two main user groups, who use the website. By looking at previous engagement it became apparent what content could be removed from the information architecture, but also what needed to be added. I then consolidated this content according the user needs gathered from the personas and user journeys.
Example Pages for the Redesign
After the general restructuring of the site map and content, the UX team started to reorganize the content of key pages.
The previous navigation of a topic range was convoluted and important content was often hidden behind multiple clicks.
We decided to keep as much information on one single page as needed, minimizing clicks and removing unnecessary information.
With the new content structure the UX team and I created wireframes, that could be used to discuss the content structure with the customer and to polish the concept.
Once the wireframes got customer approval the design team could start working on design components. The UX team and I worked together closely with the design team to ensure a cohesive design language, that would still be user friendly and intuitive.
Component library
During the process of creating wireframes and discussing the designs and functions with the design and development team, I started creating a component library. The library consisted of the wireframes as well as a description of behaviors and functions. Later on the design team added the designs for the components to the table. The development team could then use the library to code the components and discuss possible adaptations.
Preparing for follow-up project phases
Tracking Concept
In order to improve the website in following project phases I created a tracking concept. Together with the customer and the project manager we collected the most important leading and tracking questions and mapped them to possible forms of tracking. A monthly tracking report would be generated through google analytics and evaluated according to the tracking concept. The results would then be used to improve and adapt the website as needed.
