UI UX Study Case: Define users’ problem and ideate product for train booking application
Disclaimer: This is one of the projects as Dibimbing.id UI UX student exercise to learn to define users’ problem in team
Hello, My name is Shintia. Currently, I’m studying UI UX at Dibimbing.id Bootcamp. As I dive deeper into UI UX world, I have learned a lot of things such as design thinking, wireframing, usability testing, and many more.
At the beginning of the Bootcamp, we learn to apply design thinking. Design thinking consists of 6 steps. That is empathize, define, ideate, prototype, and test. In this session, we learn how to define and ideate a case study.
Role: Junior UI UX Designer that still looking for a job
Tools: Figma
Timeline: 3 day
Overview
KAI express is a train booking application as an example of this exercise. Before we start, our mentor groups us in teams and tells us the process. I’m a group with Aphrodita Fairuz Smarty, Fildzah Zata Syauqina Izzati, Iman Akbar Ibrahim, and Leo Ericton. We get a case study to buy a train ticket.
Define
To define problems, our mentor directed us to create an as-is scenario, affinity map, and prioritization matrix.
Step 1. As-Is Scenario
First, we are directed to create an as-is scenario to define problems. As-is scenario consists of phase, doing, thinking, feeling, pain point, then opportunity.
Step 2. Affinity Map
After we create an as-is scenario, the next step is we create an affinity map from 2 problems from the as-is scenario.
The Affinity Diagram is a method which can help you gather large amounts of data and organise them into groups or themes based on their relationships.
From 2 problems, we define the goals, needs, pain points, behavior, and solutions.
Step 3. Prioritization Matrix
The prioritization matrix helps us to prioritize which feature should we work on first based on user value and effort. In this step, our teams decide to work on the features written on the green sticky note, which are high in user value and low in effort.
Ideate
After deciding which features to do first, our team divides the tasks. In this case, I have to create features in the form of descriptions of train type options along with prices in one travel route, travel time, until what time. To ideate the feature, we create information architecture, wireframing, and mock-ups.
Step 1. 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.
Step 2. Wireframing
I make wireframes based on information architecture. To increase efficiency, I make wireframes on papers with design alternatives.
Step 3. UI Design
After create wireframes, I chose one to create mock ups. because there is a roundtrip page, I made a mock ups without a roundtrip and with a roundtrip.
Closing
Overall, reflecting on this process helped us to learn more to find users’ problem through define step and ideate step to realize the product in design thinking. All the learnings that we go through hopefully can be used to improve our process next time. I’m open to feedback and suggestion to make a better application for user :)
Thank you for your time and attention.
Let’s be Friends!
You can find me on Linkedin shintia lim :)
