UI/UX Case Study — Crowde Redesign Website Challenge

“Hi everyone! This is my second writing about the final project after attending the UI/UX Design class by the Skilvul x Kampus Merdeka program held by Kementerian Pendidikan, Kebudayaan, Riset, dan Teknologi Republik Indonesia.

Disclaimer : this project is part of the UI/UX training program implemented by www.Skilvul.com, for Kampus Merdeka program held by Kementerian Pendidikan, Kebudayaan, Riset, dan Teknologi Republik Indonesia. Crowde is one of the Challenge Partner. I am not working for nor contracted professionally by Crowde.

Hhello everyone! This time I will share the entire design process that I have done with my team for the Crowde website Redesign Challenge, this is the first challenge to make a redesign for the website, in every process it is full of knowledge and adds to the familiarity with teammates. I did this work with my friend Abdul Fattah Sophian and Darius Simamora

This project is a Team project given from attending training in Skilvul. And in the 14th week of the training we have completed all the tasks for the redesign of this crowde website. We’ve done a lot of great things as a team and my role in the team is Brainstorming the whole project (Define, Ideate, Crazy8), Creating Design System, UI Design, Interview and Testing and evaluating.

Introduce the company : CROWDE

Crowde. is a P2P lending platform that brings together local farmers and investors to revolutionize the agricultural ecosystem in Indonesia.
the website of Crowde is currently unable to reach all targeted users, coupled with limited access to technology and information. From these problems, a website redesign was made as a step to be able to reach more borrower users or farmers.

Objective :

After we figure out the challenge, my team defines the objective into 4 :

  1. Finding out the level of user convenience in operating the design solution that has been made
  2. Finding out user needs from the results of testing that will be carried out
  3. Finding out user habits in conducting P2P transactions
  4. Find out the level of usability in terms of UI and UX when operating a design solution from the crowde website.

Target User and segmentations :

Based on the provisions that have been made by crowde, the following are some of the target user criteria:

Gender: Male & Female (80% Male)
Age range: 30–55 yo
Geographical range: Subang, Sukabumi, Bogor (rural area)
Occupation: Entrepreneur, merchant, inherits parent’s business
Habits & Behavior: Tech savviness level middle to low
Daily use: WA and FB
Media marketing : Brochures, Banners
High use of regional language

Design Thinking Approach

In this redesign process, we use a design thinking approach. We chose this method because it is more simple and practical, easy to do and in accordance with the needs of current users.

Empathize

at this stage, we try to understand what the target users need based on exposure to information from the results of the AMA Session with Crowde partners. Based on the existing problems, it is known that farmers have difficulty understanding the information available on the website, the language available on the website is too difficult to understand, especially for farmers who incidentally come from remote areas. Apart from that, borrowers have difficulty accessing information related to Crowde.

Define

From the results of user findings, observations and research, it is determined what paint points needs, and focus of the users will be used as the basis for the next stage.

Based on the pain points we collected, we created a How-Might-We (HMW) question to focus our direction on redesigning this product. The following is the HMW from the results of our discussion:

Ideate

In this stage, we try to write down the solution from the paint point, we create an affinity diagram to organize and prioritize the solutions, which one should be executed at the first. we explored solutions that can answer the HMW question and then we classified them into the Affinity Diagram

From these results we prioritize solutions into 4 level groups: Do It Now, Do It Next, Do It Last, Later.

After we prioritized ideas, we started Crazy8, we created a wireframe in the form of a sketch, then selected from those sketches to later become a low-fideity wireframe.

After determining wirefarme who want to implemented in this redesign project, we made user flow to map the task flow that will be run by users when using the features we created on Crowde website.

After determining the user flow, then we create a wireframe from crazy’s 8 results. The following is a wireframe that we have created:

Prototype

After creating the wireframe, we created the UI Style Guide first before moving on to user interface design. We use Figma’s Components tool to make design implementation faster and more consistent

After the UI style guide was created, we then implemented it in a high fidelity design, here are the results of the design :

As we know after the High-fidelity design is complete, we need to prototype it to make users interact with and get their feedback, here is the final prototype as shown below :

If you can’t open the prototype, you can also use alternatife Figma link

Testing

Next is the last stage of Testing. We conducted in-depth interviews and usability tests to measure the solutions we made to several respondents that we felt fit the predetermined criteria. we used informed usability metrics into single ease questions (SEQ) and it was efficient to measure this project.

SEQ (Single Ease Question) is a Post Task Questionnaire that is used to assess the level of ease of a product feature based on user experience by using only one question.

Budhi Luhoer -2019

Interview and Usability Testing was conducted on November 26, 2021. Based on the results of interviews with 2 respondents, it was found that the average value of the first respondent was 6.25 out of 7, and the average value of the second respondent was 6.5 out of 7. Respondents rated usability and user product interface redesign is quite good with a score of 6.4 out of 7.

You can see the process our interview at the following link.

Evaluating

After testing is done there are some inputs from users related to the design solution we made. From some of the points that we have summarized. . There are some inputs from users related to the UI that has been made, namely on the fund application page, related to the use of color for text fills and the addition of a submit button on the submission page.There is a slight change of the design solution based on user input :

Conclussion

From the results above, it can be concluded that the design made is sufficient to meet the needs and desires and is easy to use by users. At the Testing stage the average value of the respondents is 6.4 out of 7. but in some aspects of this design can still be improved again over time. from some feedback from users can be a reference for better development in the future for Crowde

We realize that in this redesign process there are still many shortcomings and weaknesses from several aspects that we may not discuss thoroughly in this redesign.

We hope that this final project can be useful for the crowd for the development of the company’s website.

Closing

In closing, I would like to thank my teammates Abdul Fattah Sophian and Darius Simamora for taking the time, sharing their experiences and supporting each other in this project assignment. Don’t forget to also thank our mentor, Kak Muhammad Lutfi, who has guided, directed and provided input in every process we did.

--

--

--

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Design to Code Services for Your Web Development Projects

psd to many things

UX Lessons From The Buffet Line

Jeff Gothelf ’s Keynote on Lean, Agile & Design Thinking

Daily progress: Panel-Palooza!

The Dark Side of Design uses more than cookies to mislead you

Xolo Books E-commerce Project

Why your product should not make everyone happy.

Thinking In Code: Designer thinking like a developer

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Dandi Saputra

Dandi Saputra

More from Medium

UI/UX case study: Adding share money expenses feature on BSI mobile app

Case Study: House Party App

EVA Mobile App for travelers — UX Case Study

EVA application screens

REDESIGN OF THE GTBANK MOBILE APP (IMPROVED INTERFACE AND USABILITY) — UX CASE STUDY