APPLICATION DESIGN 1 - TASK 4


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 4 | Hifi App Design Prototype


 LIST 

TABLE OF CONTENTS:

1. INSTRUCTIONS

2. PROJECT 04

3. SUBMISSION

4. REFLECTION


 INSTRUCTIONS 



 PROJECT 4 

High Fidelity App Design Prototype 

Link to Figma File 




 Adding Colours 

I began by adding colors to my design using the color palette from the UI toolkit I created in Task 3. This step helped bring life to the design and aligned it with Senheng’s branding.


Fig1.0 Prototyping in Figma



 Inserting Visuals 

Next, I inserted ads, product images, and branding visuals into the appropriate sections of the design. These elements enhanced the overall look and provided context for the app's functionality.


Fig1.1 Prototyping in Figma



 Adding Text 

After the visuals were in place, I typed out the brand names and product descriptions below the images. This step ensured that all the content was clear and easy to understand.


Fig1.2 Prototyping in Figma



 Making Interactions More Detailed 

For the interactive elements, I made them more detailed compared to the lo-fi prototype. For instance, I added functionality to the sorting feature, which was non-interactive in the lo-fi version.


Fig1.3 Prototyping in Figma



 Designing Onboarding Page 

I then created the onboarding screens to introduce new users to the app. These included:

  • Senheng’s Mission – Highlighting the brand’s purpose.
  • Promoting the Loyalty Program – Encouraging users to engage with the benefits.
  • Call-to-Action (CTA) Button – Inviting users to sign up and become members.


Fig1.4 Prototyping in Figma



 Final Review 

Lastly, I double-checked the user flow to ensure every button linked to the correct page. I also tested the prototype to make sure all transitions and interactions were smooth and functional.


Fig1.5 Prototyping in Figma



 SUBMISSION 

High Fidelity Prototype Video Walkthrough 




 REFLECTION 


The journey through this module, Application Design 1, was challenging but rewarding. I have to admit, I felt a bit lost at the beginning, and looking back at my earlier tasks, I’m not entirely satisfied with them. There’s a lot I think could have been improved, especially in terms of execution and detail.  

However, when I moved on to Task 3 and Task 4, which involved creating the lo-fi and hi-fi prototypes, I started to enjoy the process more, even though it was still tough. Redesigning the Senheng app was a task I took seriously, and I’m happy with the outcome. I genuinely feel that my redesigned version looks more appealing than the current app.  

The final result was satisfying, the visuals felt cohesive, and the navigation was smooth and user-friendly. While I recognize that there are still many details that could be improved, I believe this is the best I could do given the time constraints.  

Overall, this module taught me a lot about designing practical and visually appealing applications. I know I have room for growth, but I’m proud of how far I’ve come and look forward to applying what I’ve learned in future projects.




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