Posts

APPLICATION DESIGN 2 - FINAL PROJECT

Image
30/06/2025 - 29/07/2025 (Week 11-15) Chan Suet Yee 0358427 Bachelor of Design (Honours) in Creative Media Application Design II | DST60504 | Sec 01 Task 04 | Final Project  LIST  TABLE OF CONTENTS: 1. INSTRUCTIONS 2. TASKS 3.REFLECTION   INSTRUCTIONS   TASKS  INSTRUCTIONS In this final task, we are required to synthesise the knowledge and work developed in Task 1, 2, and 3 to create a fully functional and refined app prototype. This involves integrating all visual assets, interactive components, and animations into a complete product experience. The focus is on polishing the overall design, ensuring smooth navigation, and delivering a cohesive user interface and user experience. By the end of this task, the app should demonstrate a clear flow, functional features, and a visually consistent design that aligns with the initial concept and user goals. FIGMA PROTOTYPE LINK PROCESS For this task, I created an animation for the  order confirmation screen ...
Post a Comment
Read more

ADVANCED INTERACTIVE DESIGN - FINAL PROJECT

Image
23/05/2025-13/06/2025 (Week 05-08) Chan Suet Yee 0358427 Bachelor of Design (Honours) in Creative Media Advanced Interactive Design | DST60804 | Sec 02 Task 2 | Interactive Design Planning & Prototype  LIST  TABLE OF CONTENTS: 1. INSTRUCTIONS 2. EXERCISES 3. TASKS 4. REFLECTION   INSTRUCTIONS    EXERCISES  WEEK 9 - MOVE SCREENS NAVIGATION In week 9, I learned how to create a screen navigation effect in Adobe Animate by moving a large Movie Clip that contains multiple sections of content. Each section was arranged side by side in one big canvas, and buttons were added with instance names (e.g.,  btnPart1 ,  btnPart2 ) to navigate between them. By applying simple Tween animations to the Movie Clip’s  x  position, clicking a button smoothly shifted the screen to the desired section, creating an interactive scrolling experience within a single page. Fig 1.0 Week 9 Exercise 01 Process Fig 1.1 Week 9 Exercise 02 Process Fig 1.2 Week 9 Exer...
Post a Comment
Read more

APPLICATION DESIGN 2 - TASK 03

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 03 | Interaction Design   LIST  TABLE OF CONTENTS: 1. INSTRUCTIONS 2. TASKS 3.REFLECTION   INSTRUCTIONS   TASKS  INSTRUCTIONS In this task, we focus on developing functional micro-interactions based on the ideas explored in Task 2, with the goal of improving the usability and engagement of our app. These micro-interactions can include elements such as animated buttons, navigation transitions, pop-up notifications, and loading indicators. We are encouraged to think creatively and consider how users will interact with the app, ensuring each animation serves a purpose and supports the overall user flow. This task allows us to experiment with interaction design and refine the key touchpoints of our app, resulting in components that are not only visually appealing but also meaningful and ready for final inte...
Post a Comment
Read more

ADVANCED INTERACTIVE DESIGN - TASK 02

Image
23/05/2025-13/06/2025 (Week 05-08) Chan Suet Yee 0358427 Bachelor of Design (Honours) in Creative Media Advanced Interactive Design | DST60804 | Sec 02 Task 2 | Interactive Design Planning & Prototype  LIST  TABLE OF CONTENTS: 1. INSTRUCTIONS 2. EXERCISES 3. TASKS 4. REFLECTION   INSTRUCTIONS    EXERCISES  WEEK 5 - BOUNCING BALL ANIMATION In Week 5, we learned how to create a simple bouncing ball animation using Adobe Animate. The first step was to draw the ball using the  Oval Tool  and turn it into a  symbol . After that, we used the  Pencil Tool  to draw a curved path showing how the ball would bounce. Next, we added  keyframes  at the starting and ending points of the path. Then, we applied a  motion tween  so the ball would follow the path smoothly. To make the animation more realistic, we slightly adjusted the  speed and motion  using easing. This exercise helped me understand how keyframes an...
2 comments
Read more