Case study: “GOV online service redesign” (Updated on 19 Dec)
I have done a GOV service redesign a little while ago but I realized that wasn’t good enough in many different aspects. Therefore, I would like to take this opportunity to re-do the project.
“Government services need literally to work for everyone, whatever their background, whatever their capability.” Martin Jordan
Background
The Hong Kong government recently announced the $5000 consumption voucher online registration, citizens could use the online service to register the voucher. I had used myself and I found it quite effortless to get through the whole progress. But my uncles and aunties all asked for my help. Which reminded me, when our family applied for the BNO(British National (Overseas) passport) renewal, almost everyone could finish their online application by themself.
Normally, a passport application should be way harder and complex than a voucher application. However, has successes to make the application easy to use for everyone, including those who aren’t the best at technology. Thus, in this case study, I am going to redesign the $5000 consumption voucher online registration system by adapting the UK gov design principle.
Role
My roles in this project are:
Stage 1 - Empathize
Observation
I conducted the observation by using the server myself and see if there were anything that could be improved. After trying, I noted a few points that might potentially raise the difficulty and prevent users to achieve their goals.
Research Plan
Seeing how common the users encountered problems during the web service, I started off my project with questioners and interviews, in order to gain better information and have a better idea of its frequency, cause, and solution.
Step2 — Define
After conducting the research, I’ve identified that the majority of elders have the same problems and those could seriously affect the experience, and it would bring uncountable pressure to the local council. Thus, the elders will be focused on the following progress.
Empathy map
According to the interviews and questionnaires, I have realized the elder group of users has the most troubles while using the service. Thus, the empathy map will focus on the elder group users.
User Journey
I also created two user journeys to simulate what elders might experience and how they might feel while using the online service. Each journey was based on one type of user.
Major pain points:
After the analysis, I have found two major problems that users might encounter while using the online service.
Step 3 — Ideation
Persona
Below were personas I created based upon my research and the target users who might use the online service to achieve different goals. It helps me understand the users’ needs and expectations.
Persona 1- Calvin
He represented the elder with limited knowledge about computers who are semi-living alone and rarely asks for help from family.
Persona 2- Lily
She represented the elder with limited knowledge about computers who are living alone and cannot ask for help from family.
How Might We
By using HMW questions, helped me align solutions, and helped me create more creative and practical ideas.
I threw a few ideas first, then grouped up and combined them as three big HMW questions and those questions were the foundation of the design.
Affinity Map
After the HMW questions, I did brainstorming to generate ideas and sorted those ideas into three big How Might We questions.
The affinity map brought me a better idea and organized those ideas came up with that elders might encounter while using the online service.
The solution became more and more clear after sorting out the ideas.
User Journey
Once I defined important features of the service, I created the user journey again in order to simulate how elders might react and interact with the online service, and see how the new design could help them to overcome their problems while using the service.
User's Flow
The user’s flow below showed how users go through the whole service from the beginning to the final destination.
Lo-Fi Wireframe
Design system
UI design
New design Flow
Step 4 — Prototype
I make the prototypes of the new online service using Figma. The journey will be the same as the explanation I discussed earlier. Please click the link below to try the prototype.
Click here to experience the prototype
Disclaimer: The prototypes that I made are not all clickable and not all of the interactions I mentions have been completed. Also, the prototype there was the final version which has been passed the user testing. Enjoy the prototype.
Step 5 — Usability testing
After I redesign the online service, I evaluate my work by testing it with 6 users, four of them were the interviewees of the user interview and the other two were not. The age range of the users was falling at 18 to 70, we had two 18 to 35, and four 65 to 70 since the new design is mainly targeting the elder. Due to the COVID, I conducted the test via Skype and Zoom and observed how users use the new design.
A/B testing
Since there were a few different ideas for the navigation bar, I conducted A/B testing in order to find out which one user like more. Instead of using the voting system, I created a scoring system since the design was mainly targeting elders and the voting system might lead the result away from the original intention.
Users rated for the presented options, the final score from elder users (60 or above) will be multiplied by 1.5, and youngers will be multiplied by 0.7.
The result was obvious, most users think option 1 is the best among all of the chooses, and since option 1 has 7 points higher than the second higher option (option 2). Thus I believe there is no point to conduct the second round of A/B testing.
Design decisions
#1 — Audio guiding and the Inclusive Design
Upon the research and users interview, I’ve found most elders have trouble reading the context, which reminded me of the idea from inclusive design, by solving one big problem to solve tons of the following problems. Thus, I took one step further, I assumed part of the redesign was designed for people who have vision issues. Therefore, the audio guiding system was actually helping them to use the application more smoothly. By helping people who have vision issues in order to solve the elders’ vision issues.
#2 — Self-service station
Self-service has been emphasized over and over times in the UK design principle. And in fact, users being able to self-serve is beneficial to both the users themselves and the government without calling for help. By helping achieve the user their goal without calling actual help could reduce the cost and manpower. On top of that, users are less likely to feel frustrated with online services.
#3 — Simplify the application progress
Since vision problems are fairly common in the elderly, I decided to simplify the original pages as more readable sizes pages.
I separated the guidance note, an eligibility check, and the application checklist since more white space and less text could help users to focus on what they need. Besides, at the end of the service. There are only the timer and reference number are shown on this page allow the higher readability for users.
Final design
User story: The user is eligible to apply for the voucher
User story: The user is not eligible to apply
User story: The user is not sure about the question
Self-reflection
#1 — Dig into the Why
In my last design, I didn’t dig deep enough, the whole design project was only built upon surface observation. Of course, it ended up just another variant of the online service, and are the issues still existed. So this time, I spent more time on user research and used more tools to help me to understand and establish the connection with the users. Surprisingly, it gave me not only enough information to carry on but also provided me with a new angle to redesign the service.
#2 — Design also for the company/ organization itself
I always hear people say “designing for the user, not designer themselves.” Indeed, as a UX design, part of the job is to understand what users need and their pain points. And yet, what the company/ organization needs shouldn’t be overlooked as well. Hence, the solution generated should be also beneficial for the company/ organization as well.
#3 — Design for literally everyone
“Government services need literally to work for everyone, whatever their background, whatever their capability.”- Martin Jordan
The reason I chose assuming some of the users are having vision issues was if I could provide a solution for the people who suffer from vision issues, I could also help the elders to use the web service smoothly. Indeed, in this redesign project, it was just a method to accomplish my idea. However, I think by using this method I could also help the user who has vision issues to use the online service as well. Actually designed for everyone.
