Logistic Integration on Krealogi App by Du Anyam — UX Case Study
This project is part of the UI/UX Training Program that is held by the Digital Talent Scholarship (DTS) by the Ministry of Communication and Informatics of Indonesia with Skilvul and Krealogi as the challenge partner. I’m neither working nor professionally contracted by Krealogi.
Intro
Project Overview
From the brief that I got from Krealogi and the secondary research, I found that the Krealogi app needs a design solution for its app development. This case study is regarding the UI/UX design solution that is conducted by doing the design process following a design methodology and finished with user research.
Problem and Scope
- From this case study, I found that the Krealogi app hasn’t had a feature such as choosing available logistics services and estimating the logistic and insurance charge yet.
- This case study scopes only the logistics integration feature of the Krealogi app.
User Target
The user target of the Krealogi App is as follows:
- Gender: unspecified
- Age: all age
- Profession: an ultra-micro, micro, and small enterprises (MSMEs) owner
- Geographic range: unspecified
Role and Job desc
In this UX case study, I played the role of a UI/UX designer that works in cooperation with my team members Ratna Nur Tiara Shanty, Putri Purnama Yanti, and Galih Anggriawan. As a UI/UX designer member, I had the following responsibilities.
- Do secondary research
- Define problems and ideate solutions
- Design user flow, wireframe, high fidelity design, and prototype
- Make design system and interactive component
- Do user research and deliver usability testing
Tools
The tools that I’ve used during the UX design process are as follows:
- Figma and Figjam
- Google Docs and Google Sheets
- Zoom
Design Process
In this case study, I used the design thinking methodology because it’s mainly a method that solves problems with a user approach. Therefore, I think this method is the right choice for solving problems regarding innovative products that have a strong focus on the user.
Design thinking is a human-centered approach to innovation that draws from the designer’s toolkit to integrate the needs of people, the possibilities of technology, and the requirements for business success. — Tim Brown, IDEO
Besides that, this method can be done dynamically and iteratively as it doesn’t have to be done linearly. This is good for solving dynamically changing problems and demanding a creative solution quickly.
Empathize
In this step, I got a brief from the challenge partner, Krealogi, that they need solutions for their app development. Their concern is to develop the following features as they are not being designed and not available yet:
- Simple customer relationship management
- Cashflow feature
- Integration with logistics and the marketplace
I also did secondary research on the internet by researching articles and case studies as well as exploring the competitors’ apps.
Problem Define
After understanding the brief and doing secondary research, I brainstormed with my team members regarding some problems and drawbacks that we found in the emphatize step to be collected into pain points as follows.
After that, I tried to define and identify categories to which the pain points may belong and then I grouped the paint points into that categories as follows.
Then I brainstormed some ideas with my team members about what I can do about the problems that I had grouped into paint points groups to define some how-might-we’s as follows.
Solution Ideate
From the how-might-we’s above, I then brainstormed with my team members about what is the solution that can be done to solve the problems above which resulted in the solution ideas as follows.
After defining solution ideas, I continued to process the ideas by grouping them into categories that share common features resulting in the affinity diagram as follows.
From the affinity diagram above, I prioritized the ideas by how much value they add to the user and how much effort to be implemented.
The ideas with the highest user value and the lowest effort are the ones I choose to be done in this case study. In this case, they are the charge or tariff information and the logistics service feature.
After choosing the ideas that have the highest priority, I continued brainstorming the ideas with my team members by sketching the rough design of the ideas on paper as quickly as possible in just eight minutes that’s why it’s called crazy’s 8. Then my team members and I voted on the design that will be used in the next design process.
Design and Prototype
In this step, I tried to make the crazy 8’s more realistic, more detailed, and interactive enough so that they can be tested and simulated. But before I can do that, I need to design userflows, wireframes, a design system, and finally the high fidelity user interface design.
Userflows
From the ideas that I had chosen, I designed the flow that has to be done by a user from the beginning to the end to get the benefit from the feature that I will design.
Wireframes
From the crazy’s 8, I proceeded to design the rough sketch into the low fidelity design to give more concrete to the design so that it could be understood enough what it means.
Design System
Before going to the UI design, to make the design visually more consistent and match the app origin design system, I design the design system. I used the atomic design which is the design divided into atoms, molecules, organisms, etc.
High Fidelity UI Design
From the low fidelity UI design then I made the high fidelity UI design using the styles and components from the design system that I had made above.
Prototype
From the high fidelity UI designs above, then I wired the frames to create flows and interactions between them. I created two flows based on the user flows that had been designed. The prototype can be viewed and tested as shown below.
Test
After the design process is finished, it’s necessary to test the prototype with the users to find how successful the solution that has been designed by doing user research.
In this user research, I do an in-depth interview with a respondent and then deliver the usability test.
Research Objective
The research objective of this user research is as follows.
- To find the feedback from the users about the logistic integration flow and design
- To find the users’ needs regarding logistic integration that suits their business
- To find the rate of usability metrics from the users with the logistic integration design
Respondent Criteria
- Age between 20 and 40 years old
- Lives in any district of Indonesia
- Can communicate in Indonesian as the native language
- Able to operate an Android smartphone
- Owns a micro, small or medium enterprise
- Runs the business at least for six months
- Serves delivery using logistic service
Research Scenario
In this test, I design two test scenarios as follows.
A. Logistic and Insurance Charge Estimation
- Ask the respondent to record an order and fill out the forms and stop just before the logistic service form field.
- Ask the respondent to fill out the logistic service form field by choosing the type of service.
- Ask the respondent to proceed to choose the logistic service provider.
- Ask the respondent to proceed to fill out or not the insurance check field depending on the need.
- Ask the user to see and check the calculation summary that includes an estimation of the logistics and insurance charge.
B. Share, Download, and Print Invoice
Ask the user to open the invoice preview page.
The Respondent
The research is delivered to a female respondent that owns a micro culinary business in Depok, West Java. She is 26 years old and has been running her business for eight months.
Test Results
In this test, I use the Single Ease Question (SEQ) as the user metric and the result from scenario A is 7 and 6 from scenario B. The final score is 6.5 on average. It means that the usability test is passed with a minimum score of 5.5.
Here’s some of the feedback from the user.
- The discount information about the logistic charge is very helpful to her to choose the best price among the logistic services.
- It’ll be useful to the customers if the invoice can be watermarked with a paid label marking the invoice has been paid.
Outro
Summary
Based on the user review, the design solution is intuitive and easy to use to estimate logistics and insurance charges and to share, download, and print invoices as well. This can be proved by the SEQ score results of 6.5.
Tough, there’s some need for improvement in the design solution and one of which is the watermark on the invoice.
Reflection
Throughout the process of doing this case study, I’ve learned a lot. From the UI/UX Design knowledge and skill, and the Design Thinking methodology which is new to me, the research process until the teamwork and communication in a team.
Next Step
Next, I need to consider the user feedback and needs as input for the next step of the design iteration.
Also, I hope the Krealogi app gets better and better each time and gets more helping a lot of MSMEs in Indonesia in running their business.
Thanks to DTS and Skilvul for having this good program. Thanks a lot to my mentor and my team members for having guided me and working together throughout this program.