Application Design 1 - Task 2: UI/UX Design Document

08/09/2023 - 06/10/2023 (Week 02 - Week 09)
Wong Khye Qing / 0361000
Application Design 1/ Bachelor of Design (Hons) in Creative Media
Task 2: UI/UX Design Document 


Links: 
Task 1    Task 2    Task 3    Final

Instruction



 
Class Activity: User persona 

Fig 1.0  Activity instructions
Fig 1.1  Activity outcome, 3 user personas

With the activity requirements given, we engaged in a group of 5 to complete the 3 user personas. We started our activity by distributing the tasks to each others with respective personas to fill in. We are mindful of the instructions and requirements given to different users. We have used Canva to complete and present the user personas to Mr Shamsul and gathered some feedbacks. 

The gathered feedbacks are: 
  • Add location to know about the user origin
  • Add favorite coffee brand
  • The type of devices or operating system the users are using


Task 2: UI/UX Design Document 
 
Introduction 
 
Fig 1.0  Introduction to the document

The purpose of this document is to analyze the findings and insights from the research. The findings were studied to understand about the user behaviors and preferences towards the ride hailing app. Analysis were made for the purpose of trying to explain on the findings from the research studies made and rationalize to come out with a direction for the redesign of the app.

The target audiences were also listed out as the ones between 18 and 30 years old. Such group consisted of young adults, working adults and unemployed adults. By having targeted audiences, survey or questionnaires could be carried out easier with a targeted scope instead of aiming for everyone as target audiences. 

User research
 
Fig 1.1  Research Methods, user research

Two methods were used for this research in order to obtain primary and secondary data for better supporting evidence. Quantitative and Qualitative methods were used for the research, being that there were survey and interview session being carried out with a number of participants. 

The survey have asked closed questions which can be answered easier by the participants as the questions were straightforward and does not require much explanations. Whereas the interview sessions have open-ended questions for the participants which required them to explain and answered with their honest feedbacks and opinions. 

Fig 1.2  Survey analysis, user research

Survey analysis were done to different sections of the survey, the findings were analyzed and explanations were made by stating the percentages of majority findings with supporting explanations. By understanding and analyzing the surveys, feedbacks and preferences from the targeted audiences can be good insights for the improvements for the user interface and experience of the current app. 

Fig 1.3  Interview analysis, user research

The interview analysis were done dissect on the contents being discussed for the sessions, the interview questions were also split into different sections for analysis. 4 participants were interviewed with 11 questions for the improvements for the redesign of the Kumpool app. 

Information Architecture
 
Fig 1.4  Card sorting, information architecture

Link to Card Sorting

The Card Sorting method was used to understand more about the user behavior and their preferences when interacting with the interface. Users will be given cards to be sorted into categories, users can also create their own categories and put cards into the new category. The sorting was able to study about the features that would be allocated to which page. This is because the way of thinking for designer is different from what it was for the users, designers should stand in the perspective of the users instead of thinking of the functions based on their assumptions. 

Fig 1.5  Complete and Featured User Flow, information architecture


The User Flow is a series of linkage between actions and feature boxes have been patched together to form a network of flow that gave a great overview of the features in the app. The rounded-corner box represented the starting of the app, rectangle boxes represented the process and features in the app and the diamond boxes represented the decisions that the user could make. 

A complete and featured user flow map was created for better understanding of the features and flow of the app. The main feature of this app was the Booking feature which was featured as the pink rectangle boxes for easy reference. 

Fig 1.6  User Journey Map, information architecture

The User Journey Map is the overview of how the action of the user with need points would proceed through the app with various pain points and emotions while going through different touchpoints and features of the app. 

Fig 1.7  User Persona, information architecture

The User Persona was created upon the end of the survey and the interview session based on the representative groups from the targeted audiences. The personas created represented the target audiences for the research and their personalities, pain points, behaviors, preferred app and using operating system were inspired and according to some of the participants. The user persona would be able to create and help the project in focusing on the preference based on the target audience. 

Fig 1.8  MVP Features, information architecture

The Minimum viable product (MVP) features were listed and displayed to highlight on the main and other features of the app. The descriptions of the MVP features have also been listed down to make explanations on the usage and benefits of the features mentioned. 

Final UI/UX Document 
Fig 2.0  Final UI/UX Document
 

Feedbacks

Week 9
Try reduce the number of question. Because if this is the question, I'm afraid that the duration of the interview is going to be very long. And do not ask a question with may influence your interviewee to answer based on the question. Ask simple question

Week 8
The form is okay but can you add few more question? Can ask about other feature that is as important as the booking feature

Week 7
Try clarifying the location. Be mindful of the process for booking a ride. Enable features such as check promotion and discount. The process can be checking the ride availability before ride booking. You can also add bookmark feature with ETA feature.

Links: 
Task 1    Task 2    Task 3    Final