Human Centered ReDesign of Koop.cz

— by Marek Mencl and Štěpán Skripnik

We have built the new website based on the Human Centered Design principle. Working on the website took us a year and in the end we had 160 standardized pages of text. A lady from a call center as well as a National Theater tenor singer were both involved in the research. The end result is a well-arranged web, which uses a human language and reacts to real people’s needs. I talked to Štěpán Skripnik from Kooperativa about our journey of getting to the finished website.
Štěpán Skripnik (Kooperativa) and Marek Mencl (2FRESH)
“Well-defined teams and close teamwork were the basis of the project.”

Štěpán:
We knew that we had a lot of work ahead of us from the very beginning. Out of all the proposed concepts in the tender we actually chose the most complicated one. Complicated meaning in terms of implementation but also enforcement within the company. It was a big change for my colleagues and even my superiors had to be courageous and have a sense of perspective.

Marek:
I think what really helped us in the beginning was the establishment of three clearly defined teams. The first team was made up of people who worked on the project every day. The second team consisted of experts, of people with decision-making powers. And the third team comprised of employees who helped us in different phases of the project.

Štěpán:
Yes. Above all, it was important to nominate a team of people who understand the concept, are not afraid to make various decisions, but also do not mind investing a lot of time into the project. It was also important that we got the team of experts involved in the project as soon as possible, after about two months. The members of this team appreciated the fact that their experiences were valued and that they could help us.

Marek:
I think the key thing was our close cooperation. The fact that you sometimes sat with us in our agency and created the content with us — I think it was beneficial for our mutual relationship.

“We first recognized people’s needs at internal workshops.”

Marek:
When you work with the principles of Human Centered Design, you begin with research. We started off quite big. Quantitative methods showed us what customers and visitors are actually doing on the Internet. But the qualitative methods ended up being even more useful.

We ran 4 workshops with employees. During each workshop, we went through a particular service — for example the arrangement and use of compulsory insurance from the beginning to the settlement of damages. We had the representatives of all the relevant departments, with whom the customer comes into contact, there. Call center, liquidation, product management. We mapped the process from the customer’s perspective. We asked people what the customers want to know, what they are afraid of and what their wishes are.

Štěpán:
I was at the compulsory insurance workshop. I remember how difficult it was to convince the liquidators and marketers to look at the problem through the eyes of the customer, and not those of the marketer. It usually lasted about half a minute and then they went back to their old ways.

On the other hand, it was nice to hear the internal needs of our traders. The latter helped us negotiate with them later — so that they would understand why we do the website the way we do it.

Marek:
It was very beneficial for us. We learned how insurance works and what the customer needs to go through. And based on this knowledge we could set up in-depth interviews with customers, which was the second follow-up step. And for me, it was a step that was a bit more interesting.

“We created the Personas based on interviews with customers.”

Marek:
I will always remember one particular man, a tenor singer from the National Theater, who invited us into the foyer and told us his whole life story as well as his experience with the insurance company. It was valuable customer feedback. We gained a lot of data, which helped us with decision-making — for instance when it came to creating the information structure of the web or setting the tonality.

Štěpán:
We started getting nervous at this stage, because the research portion of the project started to take quite long. In retrospect, I see a lot of added value in the fact that, thanks to the interviews, we were able to create clearly defined personas, for which we were then looking for solutions.

We had a lot of data from surveys and data analytics — it was only at this stage that we were able to transform this data into live images. The resulting solutions therefore matched real human needs. Identifying with the personas also helped us in terms of securing approval. We always wondered whether this page or solution would work for Petr from the National theater.

User testing of one of our prototypes
“Hard data worked as an argument even inside Kooperativa.”

Štěpán:
One of the key elements was being able to convince the heads of the individual departments. It was only when I started to show them hard data from e.g. classification analyses for SEO and what the latter could do for them especially from a business perspective, that they began to listen and help us more significantly.

Another thing that worked was the fact that I started to show people how specific product pages are designed and what their tactics are. They understood that they were not only dealing with attractive design that we came up with on the spot, but that each page had a clear plan and goal. Firstly, we make clear what each type of insurance is and how much it costs, and subsequently what discounts you can get and finally we include customer service information. And finally, all that’s left to do is click on the “agree” button.

“We started to design the mobile web first, the homepage came last.”

Marek:
The research showed us a number of design opportunities and we then started to prototype and develop. We chose the “Mobile first” tactic — we started off with the mobile page first.

We also built the structure of the new website from the bottom up. We did not go through the homepage.

Štěpán:
This stressed us out a bit, because, as the client, we wanted to see the beautiful home page with a spectacular visual — one that would be full of emotion. However, you convinced us that we might have to wait for it a few months and that we should first do something that’s a little bit “ugly” and simplistic but, at the same time, functional.

Marek:
Anyway, it worked very well as we used the iteration approach, in which the individual workflow is first tested. We did not come up with anything based on intuition — on the contrary, we had a lot of data and ended up using the most important aspects of the latter.

From mobile to desktop
“It is not enough that the agency knows the client. It helps when the client understands how the agency works.”

Marek:

Do you have some kind of a summary or advice for clients and agencies? For me it’s the following: set up the teams, work together, engage as many people as possible on the client’s side. Create research to the extent that the project allows. Start off with mobile.

Štěpán:

It always helps when you know how an agency works. Based on that you can then specify your own requirements. What really helped me was being able to spend a few evenings in your office — I understood how everything comes together. I think it’s good when the contractor does not fight with the agency — it’s better when both parties are responsible for their joint work.

Check out the result!
www.koop.cz

What we worked on

Research
4 workshops with insurance experts
12 in-depth interviews
Classification analysis
Web visitor analysis
Analysis of the insurance company’s products and goals

UX and UI design
Design of information architecture
Design of the prototype and wireframes
User testing
Website design in the PC, tablet and mobile resolution
Creating the content strategy
Metadescription creation and the content revision of key sites
Advanced settings used for visitor measurement

Develop
Coding of graphic templates
Implementation of a CMS
Programmer modifications of the dynamic parts of the web

Who worked on the project

On the client side
Štěpán Skripnik, project manager
Jan Svoboda, Head of Marketing Communications
Internal team composed of 12 interdisciplinary team members and 20 experts

On the agency side

2FRESH
Marek Mencl, research and project management
Lukáš Pitter, research and prototyping
Milan Chvojka, UX designer
Daniel Doktor, UI designer
Jana Obžerová, development
Lukáš Pítra, SEO

ET Netera
Marek Stefanidis, project management
Michal Ševčenko, development

Bistro
Tomáš Preněk, consultant