Design Exploration | Final Compilation
22.09.2025 - 04.01.2026 || Week 01 - Week 15
Hanson Pea Wei Hao || 0359463
Design Exploration || Bachelor of Design (Honours) in Creative Media || Taylor's University
Final Compilation
Hanson Pea Wei Hao || 0359463
Design Exploration || Bachelor of Design (Honours) in Creative Media || Taylor's University
Final Compilation
Lists
1. Instructions
2. Feedbacks
3. Reflections
Instructions
Task 1: Project Proposal
To ensure my work remains aligned with the evolving UI/UX landscape, I recently conducted a deep dive into the current industry outlook and compared it against my own portfolio. By analyzing job listings from different companies across LinkedIn, I was able to map out a visual comparison of the technical and soft skills most sought after in today’s market. While this research confirmed the high demand for core competencies like Figma, user-centered design, and Agile collaboration, it also provided a clear roadmap for my own professional development. Specifically, I’ve identified motion design, advanced prototyping, and accessibility as key areas to strengthen.
Fig 1.1, Initial Idea and Research for Proposal [Canva Link]
Task 2: Project Development
After struggle few week in think what theme to work on, I plan to strengthen my skill by building a good business website prototype which a lots of company take it as the requirement as UI/UX development. After consult with Mr Asrizal, he suggest me can just find a theme and then work on it, like what out senior do. So In my mind I having Few idea to work on:
1. Juice Up:
- Concept: A bright, refreshing website that celebrates energy, creativity, and positivity like a burst of fruit juice for your day
- Tone: Playful, youthful, uplifting
- Colours: orange, pink, lime green, white
- Animation idea: liquid splash transitions, fruit slice reveals, floating bubbles
- Concept: Each scroll section represents a color and its emotion like a rainbow theme journey through life and feeling
- Tone: Artistic, emotional, inspiring
- Colours: each section a gradient (red → orange → yellow → green → blue → purple)
- Animation idea: background color shifts smoothly as user scroll.
3. Bloom:
- Concept: Growth and positivity inspired by plants and flowers like every section represents a stage of blooming
- Tone: Soft, hopeful, elegant
- Colours: green, beige, blush pink, white
- Animation idea: subtle growing vines, petals unfolding, soft fade
After provide these idea to Mr Asrizal, he tell me should try to make out the wireframe of lo-fi to try is the idea can work or not, because try out animation might be a bit rush for only 9 week of working time and I might crash my time with other module.
Fig 2.1, Lo-Fi for Juice Up [Figma]
After getting feedback from Mr Asrizal, he mention that this might ahve a bit potential to make it good, but need to see how the animation can support on on it.
After that I use 2 week to think and keep upgrade what can be do. I start looking and taking reference from juice website like Boost, Life Smooties, Juice world. an ddthen find out they mostly try out very colourful colour. So I having a new idea which is I want to try modern colourful. which is using clean and modern colour which is black and white to highlight the beautiful and vibrant colour.
Fig 2.2, Hi-Fi Heropage for Juice Up [Figma]
Fig 2.3, Hi-Fi Homepage [Figma]
Fig 2.3, try out hover on these can [Figma]
Fig 2.4, try out hover on these can [Video]
After that I add cover, button, motivation quote for these juice can as my final page.
Fig 2.5, Final Page Design
Fig 2.6, Apply Animation for can
Fig 2.7, First draft of Hi-Fi
Fig 2.7, bouncy fruit and splash
Fig 2.8, Animation for bouncy orange
After having everything and detail change. I finalize the whole protoype and back to create my final slide.
Fig 2.9, Final prototype for Juice-up [Figma]
Final Outcome
Google Drive Link: [Design Exploration]Presentation Final Slide:
Fig 3.1, Final Presentation Slide [PDF]
Figma Prototype Link: [Prototype Link]
Fig 3.2, Juice-Up your Day [Figma Prototype]
3.3 Juice-Up your Day prototype walkthrough video[Youtube]
Final Presentation Video:
Fig 3.4, Final Presentation Video [Youtube]
Fig 3.5, Feedback
This design exploration class felt like a turning point in my creative journey. I entered the semester searching for a way to bridge the gap between good design and memorable design, and I’ve finally pinned down that direction for my personal growth: Motion Design. For a long time, I viewed animation as a secondary nice to have skill, whcih is something you sprinkle on at the end if there’s time. However, focusing on it intensely this term has completely reframed my perspective. I now see motion as the thread that pulls a static layout together, transforming a collection of shapes and text into a living, breathing experience.The greatest moment for me was realizing that in a professional industry context, motion is a form of communication, not just decoration. It’s a language of its own. Through my experiments in Figma, I started to understand that every movement tells the user something. A button that grows slightly when hovered over isn't just cool, it also confirming the user’s intent and providing the reassurance they need to click.
I spent hours tweaking micro-interactions and timing curves, and that’s where the real learning happened. It was a process of trial and error, which also finding that thin line where a transition feels snappy and professional rather than sluggish or distracting. I learned that if a user notices an animation too much, it’s probably because it’s getting in the way. The best motion design is often felt rather than consciously seen, which it is about creating a seamless flow that guides the eye exactly where it needs to go next.
Understanding these nuances in an industry that is increasingly crowded, I realize that having a specialized edge is vital. By mastering the logic of motion, I’m not just a designer who makes things look pretty. I’m a designer who understands user psychology and rhythm.
After research and try out, I feel a sense of confidence I didn't have before. I have a much clearer vision of how to use motion as a tool to make interfaces more intuitive, accessible, and engaging. I’m excited to keep pushing these boundaries, moving beyond basic transitions to create digital experiences that feel truly responsive to the people using them.
Comments
Post a Comment