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

22/9/2023 - 27/10/2023 (Week5 - Week10)
Teoh Gim Khoon (0361563)
Bachelor of Design (Hons) in Creative Media
Task 2 - UI/UX Design Document




Link to others tasks
Final Project - High Fidelity Prototype

INSTRUCTIONS




Task 2 - UI/UX Design Document (Week 05-10)

In the second project, we've been tasked with prepare the UI/UX Design Document. The purpose of this UI/UX design document is to propose a redesign of the Burger King app. The current app has been criticised for being difficult to use and navigate, and for not providing a good user experience. The redesign aims to address these issues and create an app that is more user-friendly, efficient, and enjoyable to use.

Before redesign the app, we need to conduct user research to get insights and thoughts from real users. This design document will include an online survey questionnaire, which we will use to create three user personas for the app. We will also conduct card sorting to develop the information architecture and identify what features should be on each screen. Finally, we will create a user journey map to enhance the user experience and ensure the app's success. We will also create a user flow chart to identify where on the site or app we need to provide certain information to convince users to take specific actions.

User research
Fig 1. User Research (Online Survey Questionnaire)

Survey Link: 
https://forms.gle/RYiBcBAnnpRAndM47
I am conducting user research through an online survey questionnaire to understand how users perceive the engagement and perspective of the app's design and functionality. This will help me identify the app's strengths and areas for improvement.

Survey Questionnaire

Fig 2. Survey Questionnaire (Google Form)

The survey distribute into three section:
Section 1 - Demographic Information
Section 2 - Fast Food Mobile App Usage
Section 3 - App Features and Interface

The survey will cover aspects of the user interface, including layout, navigation, visual design, ease of use, and functionality. It aims to identify users' needs when ordering meals from the current mobile app design, the main areas of the app that need improvement, and their expectations for the new mobile app.

Information Architecture

Fig 3. Card Sorting


In this section, I conducted a card sorting activity with 10 participants who have used fast food apps before. I distributed 20 cards into 5 categories for the participants to arrange according to their preferences. The categories represent the pages in the app, and the cards represent the features and functionalities of the app. The purpose of the card sorting activity is to help design or evaluate the information architecture of a site based on how participants organize the content in their minds.

User Journey Map & User Flow Chart

Fig 4. User Journey Map 

Fig 5. User Flow Chart


User journey maps encourage and remind me to consider the entire customer experience, including their feelings, questions, and needs as they interact with the app. They help me understand and address customer needs and pain points.

User flow charts help me identify where on the app I need to provide certain information to convince users to take specific actions, moving them toward a successful final interaction. This is where I plan the user interaction and interactivity of the app by creating a diagram that illustrates the user's journey through the app.

Final UI/UX Design Document Slide - Burger King App

FEEDBACK

Week 7
The survey is okay, except for the second section, where you ask if the respondent has used any food apps before. If the respondent has never used any app before, should they be directed to a different section?

For the Minimum Viable Product (MVP) Features section, choose the four most important features of the app to put under here.

Week 8
Please make sure that participants complete the card sorting activity by filling all of the categories with all of the cards you provided.

Week 9
Please change the information architecture diagram to a user flow chart. Try to describe the overall flow chart as detailed as possible to provide a clear user flow of your mobile app.

Comments