Health care workers must have correct and current knowledge of their professional fields. Ideon offers scientifically developed tests to measure the knowledge of care workers and advises in what areas training is required. Ideon offers this as a knowledge monitor web application: Kennismonitor. Ideon had a Dutch spoken video made, explaining the concept in more detail.
Complaints about the usability of the old version of the product were the main motivation behind this project. Our team redesigned and developed a new application from the ground up.
Ideon needed the application to give its users at least the same functionality as the old application, so much of the functionality was predefined. The old application could be completely abandoned as it not only had usability issues, but also the technical foundation on which it was built, was not scalable. The scope of the project was large and the developers were skeptical about the proposed time frame within which the product had to be delivered. Good reasons to do it Agile, I thought.
Our team consisted of project manager and front-end developer Malaya van Ruitenbeek and Maint Berkenbosch, who did front-end and back-end development. Then there were Ideon’s CEO as the product owner and myself. US Media coached us.
We built Kennismonitor in two-week sprints, picking chunks of the application to design and develop together with the product owner. Since most features of the new product were predefined, this was not a pure Agile project. The Agile approach was useful though. During the project, we defined new requirements and features. Under time pressure caused by external stakeholders, that made us decide to leave out some of the old functionality, at least until the product is evaluated by users.
I’m also glad my suggestion to do the design and front-end development mobile first worked out well. It helped us to keep the user interface clear and keep the number of UI elements low.
My role in this project
I did everything design for Ideon’s Kennismonitor: interaction design, visual design and a bit of front-end development.
When we started this project, my main concern was to get the quiz part of the application right. There are plenty online quizzes to do online for fun to borrow ideas from, so this turned out to be the easy part. The only thing I regret is that we are not able to offer direct feedback to users after they provide an answer. Research shows that multiple choice tests can bring the knowledge level of participants down. Direct feedback can reduce that effect. However in the dementia knowledge monitor knowing the right answer to one question may make answering another question easier.
The actual challenge turned out to make the interfaces for all types of users support the knowledge monitor process. Roughly, this process consists of:
- An administrator importing user details to create accounts
- Team leaders inviting workers to do a quiz
- Workers answering quiz questions for the first monitoring moment
- Team leaders and organization managers evaluating individual and team knowledge levels
- A second monitoring moment and evaluation after workers received training
The availability of most user actions depends on the actions of other users. After all, team leads can’t get a report as long as nobody has completed a quiz for instance. This requires communication of the status of users and guiding texts that explain what’s going on.
The application is accessed only sporadically by the users and some of the users may not be experienced using computers. To keep things simple for all users, I created a flat navigation architecture, guiding them back to a home page after working on a task. Message-like texts on top of the home page explain to the users what their next action can or should be. We sketched many a state diagram to define all the edge cases where the default messages wouldn’t suffice.
I don’t consider myself a visual designer, but I do believe visual design and interaction design cannot be created completely separated from each other. With Ideon’s corporate identity, I created a set of styled HTML elements. Based on my sketched wireframes, I created HTML mockups for all views, using a reusable set of element classes. Where necessary, I adjusted the element styling to create comprehensive layouts and transitions. The report views contain some nice tricks to make the layout responsive.
The design specifications were made as HTML and CSS mockups. For in-page interactions, I wrote JQuery functions and created CSS transitions. Specifying the design this way worked well: it even inspired me to write about how useful it is for designers to write code. At the end of every other sprint, when Maint had implemented the changes to the front-end, we tested the application for cross-browser compatibility. Using basic fallbacks, older browsers down to Internet Explorer 8 are supported.
Currently, Ideon is running user tests. With our Agile approach, it would have been possible to have users check the product after every sprint. However, without real monitor questions and results, the interface could have looked confusing to the target group. Moreover, the real usability challenges were in the process of team leaders inviting workers to use the knowledge monitor, getting reports and reporting to management. The complete process with two monitoring moments takes up to six months. So we decided to do user evaluation with a working and technically tested product.