UI UX Case Study: Redesign of a corporate application
Disclaimer: This is a personal project experience when given a test to redesign a corporate application by the company. Here I share the process to complete this project.
Overview
OTLink is an application that helps all the needs of the Orangtua Group’s employees. The main function of this application is to help employees with swab tests and digitally absent.
Problem Statement
Orangtua Group is a fast-growing company. Because the OTLink application is needed quickly, the application that has been created can be used but with a modest design. So, business stakeholders briefed the UI UX designer to redesign a more user-friendly OTLink application.
Users & Audiences
Users & Audiences in this project are all employees of the Orangtua Group.
Roles & Responsibilities
Because the OTLink application already exists, I am working on starting from UX Research, UX Design, and UI Design to improve the application.
Challenges
The challenge, it is difficult to ask employees for time to do In-depth-interview (IDI) and testing.
Processes
I applied design thinking in making this project.
Design thinking is creative and collaborative problem solving to produce more empathetic and innovative solutions.
By David Kelley and Tim Brown, IDEO founder
Step 1. Empathize
We empathize with users to give them the solution so they can reach their goals. In this step, I make a research plan, discussion guide, then conduct the research.
Research Plan
Discussion Guide
A discussion guide helps us to gain more information and insight based on the research objective by interviewing users.
Conduct the research
Based on the research plan, I plan to interview 5 employees. But because the employees are busy and it’s hard to find time to do In-depth-interview (IDI), I managed to interview four employees. Three employees by google meet and one employee by face-to-face interview.
Step 2. Define
In this step, I conduct an observation based on interview results with three users and make an empathy map to define user behavior to OTLink application. And then make prioritization matrics to decide what main opportunities to be implemented in the product.
Empathy Map
With an empathy map, we can understand how users’ behavior to OTLink application.
From the empathy map above, the most common problems experienced by users are:
- The function of the application is good, but the visual can be improved.
- In the application, there are too many useless features.
- Often error when absent to swab test by Bluetooth.
- Don’t know what’s the features’ function
Prioritization matrics
Based on IDI, employees mainly use the swab test feature to check their swab test schedule, swab test results, and absence for a swab test.
Step. 3 Ideation
I start ideate by dissecting the existing interface, creating a user flow, information architecture, wireframes, guidelines, and mock-ups.
Dissection
User flow
User flow used to describe the user’s steps to complete the task using a product. There is three main user flow: register user flow and swab test user flow.
Information Architecture
From Dibimbing.id Bootcamp class, Information architecture is a method used to make documentation of all flows, contents, and design requirements of an application or website.
Wireframes
I make wireframes based on information architecture. To increase efficiency, I make wireframes on papers with design alternatives.
Guidelines
UI Design
Register
To register employees’ accounts, they need to input their ID and date of birth.
Homepage
On the homepage, employees will be shown today’s date, absence status, profile, and features that can help employees to do their tasks.
Swab Test Feature
I create a coach mark to tell employees about OTLink features. On the swab test page, I differentiate the schedule. On the ongoing section, employees can see their swab test schedule start from date, time, location, and absence button when they already near the swab test location. In the history section, employees can see their past swab test schedules and results. To absence for a swab test, employees need to turn on their Bluetooth. I create a dialogue box to ask for employees' confirmation to turn on their Bluetooth. When they already turn on their Bluetooth, they can absent. For the next step, there will be another dialogue box to tell employees what to do next. And finally the absent button change to notification that the absence has been successful and tells the employee what to do next.
Step 4. Prototype
I make prototypes using Figma. There are register prototypes and swab test prototypes. Please click the italic link below to try the prototypes.
Step 5. Test
Usability Testing (UT)
“Usability testing aims to evaluate a solution for a product by testing representative users in order to solve problems effectively.”
By dibimbing.id class
I did usability testing on four employees using Google Meet to see the steps taken and get more insight.
The four employees can complete the mission well and the coach mark helpful to tell them about the feature. However, there are several inputs, the flow of the swab test after turning on the Bluetooth immediately stating the absence was successful. In the notification section, it is recommended to add the word “successful absence” to notify users that the absence of the swab has been successful. Then after being absent, the font that tells the user the next step is suggested that the readability should be increased.
Improvement
Based on the users’ feedback, I simplify the Swab test User Flow and Information Architecture as suggested.
To improve the accessibility and readability, I change the UX writing and the fonts. After turning on Bluetooth, directed to the successful absence page with a green checkmark and the word “Absen swab berhasil”. Then to improve readability in the following steps after the absence, I changed the font to be bigger, bold, and blue.
Closing
I got a lot of new knowledge in completing this project. Hopefully, this project can help me to be better in the future. Although there are some obstacles such as the difficulty of matching schedules with employees, I hope to be able to help with some improvement ideas that I have done.
I am very open to receiving feedback and suggestions from all of my friends.
Thank you for your time and attention to read :)
References
Let’s be Friends!
You can find me on Linkedin shintia lim :)
