Advanced Interactive Design Task 2: Interaction Design Planning and Prototype

22/11/25 - 16/11/2025  (Week 5 - Week 8 )

Advanced Interactive Design / Bachelor in Design (Hons) in Creative Media / Taylor's University

Shubashini a/p Subramaniam, (0367697)

---

Table of Contents

1. Module Information Booklet
2. Lectures
3. Task
4. Feedback
5. Reflection

---

Modules Information Booklet :

---

Lectures : -

---

Task :

Instructions:

Students are required to work on their visual design and start planning their website’s interactive design elements and features. Unlike traditional static website, when it comes to interactive design where animations are present, the plan not only should include the layout visuals but also the animation example or reference. Students can build their animation or user-reference animation to demonstrate the intended idea.

Submission :

• Walkthrough Video presenting the plan and showing the animation examples and/or references. (Compulsary)
• Online posts in your E-portfolio as your reflective studies with links to any resource involved in the creating of the plan. (i.e.: Figma link, Miro link, etc.)

Creating the Plan :

Miro (Flow Chart) :

 Walkthrough Video Proposal :

---

Reflection :

For Task 2, I developed my interactive website plan by turning the ideas from my Canva proposal into practical designs in Figma. I applied my main goals of a clean layout, clear hierarchy, responsive structure and purposeful interactions to the page sections, components and overall visual flow.

I also planned key animations to support usability, including button hover effects, scroll reveal transitions, a sliding mobile menu and small icon micro-interactions. I also planned to create my own gifs, to be put into the slide.  These animation references guided me in creating a smooth and modern user experience.

Recording the walkthrough video helped me reflect on the purpose of each interaction and how they connect back to my proposal. This task taught me the importance of intentional movement, clear user flow and refining designs through iteration. Overall, Task 2 gave me a strong foundation to begin developing the actual website.