APPLICATION DESIGN 1 - TASK 2


23/10/2024-14/10/2024 (Week 01-14)

Chan Suet Yee 0358427

Bachelor of Design (Honours) in Creative Media

Application Design 1 | DST60504 | Class 01 Sec 01

Task 2 | UI/UX Design Document


 LIST 

TABLE OF CONTENTS:

1. INSTRUCTIONS

2. PROJECT 01

3. SUBMISSION

4. FEEDBACK


 INSTRUCTIONS 


 LECTURES 

Week 5 - Card Sorting

During this week, I was unable to attend class due to being unwell. However, Mr. Zeon asked those of us who were absent this week to form a group and complete the card-sorting exercise during Week 6. For this activity, we conducted a hybrid card-sorting exercise as part of our user research for Project 2. We did a few rounds of moderated card sorting as a group before finalising the arrangement. 




Below is the final outcome of our card-sorting activity, which was specifically conducted to organise and refine the features and categories for a cycling app. This process aimed to enhance the app's usability and ensure its structure aligns with user expectations.


Fig 1.0 Final Card Sorting Exercise



Week 6 - Introduction to User Experience Research 



Week 7 - User Persona



Week 9 - User Journey Map



Week 10 - Site Map & User Flow




 PROJECT 2 

UI/UX Design Document 

Below is an outline of the components to be included in the proposal for the UX design document:

 Introduction 
  • Purpose and Scope: Clearly define the purpose of the document and the aspects it encompasses.  
  • Target Audience: Identify the specific group of users the app is designed for.  
  • Problem Statement: Describe the key issues the app seeks to address.  
  • App Weaknesses: Highlight the shortcomings in user experience and interface design of existing apps.  
 User Research 
  • Survey Questionnaire and Interviews: Provide a detailed analysis of the findings.  
  • User Persona: Include in-depth profiles that represent the app's target users. 
  • User Journey Map: Present a visual map detailing the steps users will take when interacting with the app. 
  • Research Insights: Explain how the gathered insights informed and influenced design decisions.  
 Information Architecture  
  • Card Sorting Method: Describe the card sorting process used to organize content, including its outcomes.  
  • Information Architecture Map: Provide a clear outline of the app's main content and features.  
  • User Flow Chart: Detail how the app’s content is structured to achieve optimal usability.  
Minimum Viable Product (MVP) Features  
  • Feature List: Provide a comprehensive list of the app's features.  
  • MVP Features: Highlight the core features selected for initial development, focusing on the essential functionalities to deliver value in the earliest version of the app.  


User Survey 

Following the completion of our first project, we developed a series of survey and interview questions as part of our user research. I distributed the survey via Google Forms, successfully collecting a total of 51 responses.

Information Architecture Map

The site map was created using MIRO, which aided in identifying the features for our redesigned app. These features were derived from the outcomes of the card-sorting process.

Fig 1.1 Information Architecture Map



User Interview
I chose the CIMB app, TGV app, and Senheng app for redesign analysis to focus on enhancing user experience and functionality in various sectors. This selection allows for a comprehensive evaluation of how each app meets user needs and identifies specific areas for improvement.


Fig 1.2 Card Sorting for the Current App



Fig 1.3 Card Sorting Redesign App - Attempt #1



Fig 1.4 Card Sorting for Redesign App - Final Attempt




After the card sorting categories and features were approved, I input them into Optimal Workshop. A total of 8 participants took part in the exercise, organizing the card features into the categories they felt were most appropriate.


Information Architecture Map

The site map was created using MIRO, which facilitated the identification of features for our redesigned app. These features were derived from the outcomes of the card-sorting exercise. 
Fig 1.5 Information Architecture Map


User Flow Chart

After creating the site map, I moved on to designing a user flow chart in MIRO, adhering to the provided instructions. 


 SUBMISSION 



 Final Submission PDF 


Fig 1.6 Final Submission for UI/UX Design Document , PDF


 FEEDBACK 

Week 11
  • Include subcategories in the information architecture map
  • There is no need to add arrows showing navigation between pages, as that is meant for the user flow chart
  • The user flow chart looks good overall






Comments

Post a Comment

Popular posts from this blog

GAMES DEVELOPEMNT - TASKS

Image
23/04/2025 -21/05/2025 (Week 01-14) Chan Suet Yee 0358427 Bachelor of Design (Honours) in Creative Media Games Development  | DST611104 | Sec 01  LIST  TABLE OF CONTENTS: 1. INSTRUCTIONS 2. TASKS   INSTRUCTIONS   TASKS  TASK 01 & 02 : GAMES DESIGN DOCUMENT & GAME ASSETS  TASK 01  For  Task 1  of our Game Development module, our group was formed during  Week 2 . I teamed up with  Mei Hui  and  Emily , and together, we began brainstorming ideas for our 2D side-scrolling game. After some discussion, we decided to draw inspiration from a tabletop game we previously created in one of our past semester projects, titled  "Sudsprite Spin."  We felt that the characters and gameplay mechanics from that game had potential to be developed into a fun and whimsical digital experience. In our 2D game adaptation, the  Sudsprite  becomes the main character. We wanted to preserve the bubbly, playful the...
Read more

APPLICATION DESIGN 2 - TASK 2

Image
19/05/2025 -08/06/2025 (Week 05-07) Chan Suet Yee 0358427 Bachelor of Design (Honours) in Creative Media Application Design II | DST60504 | Sec 01 Task 02 | Interaction Design Proposal & Planning  LIST  TABLE OF CONTENTS: 1. INSTRUCTIONS 2. TASKS 3.REFLECTION   INSTRUCTIONS   TASKS  INSTRUCTIONS For this assignment, we are required to develop a  comprehensive interaction design plan  for our final  web-based mobile application . The goal is to  visually and conceptually prepare the user interactions and animations  that will enhance the overall user experience. The key components of the assignment include: 1. Interaction Design Documents Create  detailed flowcharts and wireframes  to map out the user journey. Clearly show the  layout of each screen  and the  navigation structure  of the app. 2. Animation Prototyping Micro Animations : Design small interactive effects (e.g., button clicks, loading in...
Read more

INFORMATION DESIGN - EXERCISES

Image
03/02/2025 -11/02/2025 (Week 01-02) Chan Suet Yee 0358427 Bachelor of Design (Honours) in Creative Media Information Design | GCD60504 | Sec 01 Exercises  LIST  TABLE OF CONTENTS: 1. INSTRUCTIONS 2. TASKS 3.REFLECTION   INSTRUCTIONS   EXERCISES  EXERCISE 01 - QUANTIFIABLE INFORMATION  Instructions  Gather a set of objects and separate it into category such as color, shape, pattern, and other quantifiable factor. Example: 1. Box of Lego 2. Jar of button 3. Jar of marble ball 4. Set of colourful rubber strap & more. In this exercise we are required to quantify our chosen objects and arrange them into  a presentable layout or chart .  The information must be presented as is, and we need to arrange the objects with relevant indicators written out with pens to visualize the quantity and data. The examples of objects that can be use are buttons, coins, lego pieces, M&Ms, and more.  Process  During our first tutorial, we were ...
Read more