Back to top

Kasboekje van Nederland

A website to support the six-part TV show of the national channel NTR, which examines the relationship between the Dutch people and their finance.

Role

UX Research
Usability Testing
Concept
Design

Period

6 months

Client

University of Utrecht, NTR

Problem statement

The client was looking for a digital platform where it would be possible for users to upload their Kasboekjes [financial documents] for the research of the University. The documents can be cash books, savings books and loans. For the user, it's necessary to gain insight into the collected data, watch the episodes of the TV show, get information about the organization and their researchers. On the other hand, the website must be informative and tell you what the research entails and what the results of the research are. This involves the problem that how the research, episodes and participation in the research have not been interpreted. Besides, these parts have been formulated by the client and it is unknown which parts the user needs. Therefore we defined the problem statement as follows;

"How can the website be so user-friendly that users are activated to participate in the research of the University, can find all the necessary information and know that the documents they upload are handled safely?"

Research

Interviews

The first step was to understand user needs. By interviewing five users matching our persona we knew most of the time they felt unsafe when personal documents were shared with third parties. Also, a slow response time of the website and not enough information about the purpose of sharing the documents were arguments for not taking part in the research. The users wanted to see a neat layout that left a familiar and safe feeling. Also, the green padlock shown in the browser was a necessity for the users to feel safe.

Card sort

The card sort session showed that het onderzoek [the research] page, the Hoe kun je meedoen [How to get involved] page and de verhalen [the stories] page needed to be given a more prominent role. The question of the week and media page were dropped. After adjusting the feedback from the session I tested the wireframes with users. This showed that it was wise to add the menu item 'home' and make the process of participating in more textually understandable.

Literature research

To get more in-depth information about triggering users to participate in the research I wanted to know more about persuasion. Multiple people recommended reading The Hook Model by Nir Eyal. Nir concludes that there are two types of safety on the web, which are objective safety and subjective safety. Objective safety indicates how often an event occurs, where subjective safety shows how people feel threatened.

The objective security can be enhanced by keeping the website up-to-date and providing it with an SSL connection. Subjective security can be improved by adding terms and conditions and logos of the parties involved. As a result, users know that it is a legitimate website.

Providing enough information to users and offering the option to ask questions also provide a piece of subjective security. Finally, reports and confirmations of the research create confidence. This allows users to know exactly what has happened and what is to come. All these elements have been incorporated into the design.

Refinement

For legal reasons, we decided to first contact users via email. The documents users are willing to upload differ a lot. Therefore the University has decided to contact the user first to decide which data is of use and let the users know they only give their data to the University and not to third parties.

The results of the research are now processed in articles that will be placed on the "in-depth page" instead of a dedicated research results page. I think this is a missed opportunity for Kasboekje van Nederland as it could take the concept to a higher level and be of value to the users. By clearly presenting the results, the user could perhaps be even more persuaded to participate in the study.

With the usability test, we also concluded that the contrast of some elements was too low for users to separate. Therefore we tweaked the colours to make sure they all passed the Web Content Accessibility Guidelines.

Final Design

A welcoming and recognizable homepage

A clear page for navigation with no visual cluster. Here you can find a summary of all the information on the website and all the available pages. I used bright colours with a recognizable palette of the last 50 years. For the sections I used different placement to draw the users attention and interesting enough to read.

Consistency

The entire website is built from components that are classified by color and structure. For example, the TV episodes and menu items each have their own palette and icon. This allows you to easily recognize each show.

kasboekje van Nederland iphone mockup
kasboekje van Nederland iPad mockup

Easy navigation

On each page I added multiple ways of navigation. On the tv show single page for example, there is a 'go back button'  which allows users easily correct his error. Users can reach other shows by using the secondary navigation or scroll down and see the next show.

Each page optimized for all devices. Smart usage of contrast, consistency and clear information. I created a new website with a unique identity, that met the requirements of both the customer and the users. Because of the easy cooperation with the client and the multiple iterations the deadline was met and the website has resulted in new leads and registrations.

Kasboekje van Nederland User Interface elementen

Salomon Stodel