12 /12/2025--5/1/2026 (W12-W14)
LIU YITONG (0370907)
Application Design / Bachelor of Design (Hons) in Creative Media / Taylor's University
INSTEUCTION
TASK
Project Overview
Project 3 marks the final stage of my application design process,
where I developed a high-fidelity mobile app prototype based on the
research, ideation, and testing carried out in Project 2. At this
stage, the focus shifted from structure and usability to visual
polish, interaction details, and overall user experience.
The goal of this project was to create a realistic, functional
prototype that reflects how the final app would look and feel in real
use. This includes finalized colors, typography, icons, layouts, and
interactive flows that clearly communicate the app’s core features.
UI Kit
Before designing the high-fidelity prototype, I created a UI Kit to ensure
consistency across all screens.
The UI Kit includes:
Color palette
Typography system
Icons
Buttons and form elements
Navigation components
Creating the UI Kit first helped maintain a unified visual language and made
it easier to scale the design without inconsistencies.
Fig.2.0 UI Kit
High-Fidelity Prototype Design
Overall Prototype
The final prototype presents a complete version of the app, featuring smooth
transitions, interactive components, and consistent styling across pages.
Core Pages & Features
The high-fidelity prototype covers the main user scenarios and supporting
pages:
Fig.2.1 Login page
Fig.2.2Store Page and Burger Menu
Fig.2.3 Game Categories Page
Fig.2.4 Notice Page, Library Page, Wishlist and Profile Page
Fig.2.5 Chat Page
Fig.2.6 Cart Page
Fig.2.7 A close-up of the "Nearby People" feature 1
Fig.2.8 A close-up of the "Nearby People" feature 2
Fig.2.9 Overall outcome
Final Outcome
To present the final design clearly, I created both an interactive prototype
and a walkthrough video.
Video Walkthrough
https://drive.google.com/file/d/1M9zcQYkvmYWMLWzLhdt_QVI5e-Sb1qdv/view?usp=drive_linkFigma Design File
Link:
Figma Design File
Interactive Prototype
Link:
Interactive Prototype
Promo Page
Promo Page 1
Promo Page 2
REFLECTION
This assignment marked the conclusion of the application design course, and
it has been a surprisingly meaningful experience for me. Before this course,
I never fully realized how complex and research-driven app design truly is.
Personal Growth
Over these 14 weeks, I learned how to balance user feedback with brand
identity. Transitioning from a cluttered existing app to this clean,
functional design has improved my understanding of Information
Architecture.
Progress Reflection
Although the workload was quite heavy, the process was enjoyable and
rewarding. Seeing the app evolve from sketches and wireframes into a
polished, interactive prototype gave me a strong sense of accomplishment.
Most importantly, this project helped me understand application design
from a more systematic, user-centered perspective, which will be valuable
for my future design work.
Especially, I feel proud of the social integration. Moving the chat back
into the main app solves a major user pain point.
What are you going to do with it ?
Applying the Heuristics: The 10 Usability Heuristics and UI Kit principles I mastered during these 14 weeks will now become my standard toolkit for all future Creative Media projects.
Expanding the Prototype: I plan to continue refining the "People Nearby" and "Integrated Chat" features, perhaps exploring how to ensure data privacy while maintaining high social engagement.
Comments
Post a Comment