UI/UX Case Study — Designing UX Krealogi Challenge (Skilvul)
Hi everyone! Welcome to my medium.
This project is part of the UI/UX Training Program held by the Ministry of Communication and Information with Skilvul and Krealogi as Challenge Partners. I am not employed or bound by a professional contract by Krealogi.
Before go further, I would like to share my design process of designing some UX feature on Krealogi mobile app. This project is a team project given from taking part to training at Skilvul Bootcamp. The design process is carried out according to the directions given by the trainers day by day align with the timeline.
Here are the details for this case study:
Product Vision: Krealogi has three types of users, namely Vendors, Producers and Sellers. Vendors and sellers are users who want to sell woven products through the Du Anyam platform and other online platforms. However, Krealogi’s current problem is that they don’t have a user-friendly application design for their target users. Currently, Krealogi needs an application design that is user friendly and of can help Krealogi’s user to record their operational activities, create strategies and maintain their operational cash flow.
Timeline: Approx. 2 Months (during bootcamp)
Tools: Figma
OVERVIEW
The idea of making the concept of UX Feature from Krealogi is initiated from the mini research on some small business owner who often uses online shopping platforms to sell his goods.
In terms of designing a product that is in accordance with the product vision that has been given, there are several stages that need to be done. In this case study, the steps taken follow the basic stages in the design thinking process
A. EMPATHIZE
At this stage, my team did research by interviewing 1–2 people with criteria that match the target user who will use our product. The criteria of users are determined on the previous task on the making of the product vision board.
To comply the research instruction, we interview one person who meets the criteria. I interviewed her directly according to the list of questions which I had prepared. After that, I grouped the interview results into an Affinity Map.
- Affinity Map
The following is an Affinity Map that I created which contains the words of the user during the interview.
- User Persona
As part of processing the research, I analyze the information that found on the research stage by creating a User Persona. This persona will contain the details of Problem, needs, interests, what she’s use, and also other information that might useful in the design process.
B. DEFINE
After we got all the information obtained from the empathize stage, the next step is to determine user problems which will then be resolved in the design of this product. The define stage that I did consisted of making a problem statement and mapping the user journey.
- How-Might We
After that, I created the How-Might We to learn to insights or findings solution during the interview process.
C. IDEATE
After analyzing the problems and opportunities, I formulate the best possible solution to solve the problems that have been collected in the Define stage.
- Solution
At this stage, we use HMW (How Might We) method to describe the solution of the problem
“How to adding all new feature needs into an efficient and interested UI?”
- Sketch
After we fould all solutions, we made sketches using design sprint method the Crazy’s 8. they only 8 frames that potray the rough layout of the mobile app.
- Wireframe
After did Crazy’s 8, we continued to make the wireframe. wemade a little changes as part of the ideas development of the rough layout in the sketch process.
D. PROTOTYPE
After completed the ideate phase, I make a high-fidelity prototype by beautify the interface design, add some flows to make it interactive, and make the UI style guide to documented the design resources.
- Interface Design
For the UI Design, I prefer choose Pink dominant color with different types of shades. Sites from colors.eva.design, Pink stimulates creativity and problem solving in the brain. I also put Peach as secondary color to give the fresh tone and to give the delicate and joyful vibes to this platform.
For the fonts, I choose Work Sans as heading and paragraph. Most of us are probably familiar with Work Sans. Apart from the good of this geometrical sans-serif typeface, using this font will give the users sense of familiarity.
This typeface gives a relaxed impression so that when reading paragraphs on this platform, users don’t feel too compelled to finish them with a rigid goal. This font gives eyes and mind flexibility to finish reading in a more pleasant way
To see our prototype on figma, you can see it here
- Interactive Prototype
We had made interactive prototype on figma, you can see it here
- UI Style Guide
We had make UI Style guide that we used on the high-fidelity interface of this Krealogi Platform
E. TEST
At this stage, the instruction given by the trainer is only to create tasks and scenarios related to the product for usability testing. Here are tasks and scenarios that I made to test the usability of this platform.
- Research Scenario (in indonesian)
- Berikan salam saat bertemu dengan responden
- Perkenalkan diri dan jelaskan maksud tujuan kegiatan yang akan dilakukan
- Jelaskan alur proses kegiatan dari awal sampai akhir
- Meminta responden untuk memperkenalkan diri mulai dari Nama, Pekerjaan, dan Domisili
- Melakukan wawancara berdasarkan Question List
- Menjelaskan singkat tentang aplikasi Krealogi— Duanyam
- Memberikan link Figma kepada responden dan minta responden untuk Share Screen
- Menjelaskan singkat tentang apa yang harus dilakukan dan cara mengoperasikan Figma Prototype oleh responden
- [TASK 1] Meminta pengguna untuk melakukan pendaftaran dan login ke dalam aplikasi (berhenti di halaman Home) dan observasi apa yang dilakukan oleh responden
- [TASK 2] Meminta pengguna untuk melakukan penggantian password jika lupa hingga berhasil (berhenti di halaman Login) dan observasi apa yang dilakukan oleh responden
- [TASK 3] Meminta pengguna untuk melihat mencatat stok barang dan observasi apa yang dilakukan oleh responden
- [TASK 4] Meminta pengguna untuk melihat mencatat aliran kas dan observasi apa yang dilakukan oleh responden
- [TASK 5] Meminta pengguna untuk melihat halaman statistik dan men-download laporannya dan observasi apa yang dilakukan oleh responden
- Menanyakan tingkat kegunaan, kemudahan dan kepuasan dari responden setiap menyelesaikan alur Pendaftaran, Penggantian Password jika lupa, Pencatatan Stok Barang, Aliran Kas, dan Download Laporan dengan skala Likert
- Menanyakan tentang tingkat Single Ease Question kepada responden
- Penutup dan sampaikan terima kasih
To find out the effectiveness of the product, I also tried to test the tasks and scenarios with the user I had interviewed in the empathize stage. Through this phase, I can get the feedback and comments on what I can improve from this product design.
Based on the test results, an error was found in Task that user filled her data. user difficult to find ‘back’ symbol on page. User give suggestion will be better if there is back symbol to easier users use it. so, we add back symbol on that page.
The following is the Change we made in the apperance Data Input.
Based on the picture, it can be seen at the top of the page that it has been placed “back” symbol. User can back to page before, moreove user can back to page before with navigation bar.
CONCLUSION
Based on the results of research on one potential user, it was found that the user wanted a “super efficient and easy” platform to easier record user needs.
Pain points experienced by user when using krealogi platform are that missing feature on platform, moreover the platform is only providing feature that, other activities such as Production Planning and Monitoring, Sales recording, Expense report, Inventory management. Krealogi doesn’t have some feature that simple CRM, Cash Flow Feature, and Integration with Logistic and Marketplace.
By adding feature on Krealogi is expected to make users more comfortable in using the application in recording and selling goods on platform and have a good sales record.