Advanced Interactive Design Task 1: Thematic Interactive Website Proposal

23.09.2025 - 14.10.2025 | Week 1 - Week 4

Maisarah binti Mohd Sufian | 0358458

Advanced Interactive Design | Bachelor of Design (Hons) in Creative Media

Task 1: Thematic Interactive Website Proposal

___________________________________________________________________________________

LECTURES

Week 1 

For this week, Mr Shamsul briefed us on our assignments this semester which is to create an interactive website in Adobe Animate. He showed us some previous semester examples and introduced to us a website called thefwa.com to get inspiration. He advised some things before planning our website, which is to avoid scrolltrigger and being too ambitious.

Week 2

Our class was cancelled this week because Mr Shamsul caught a fever, so we just updated him our project topic to be approved on Google Classroom.

Week 3

This week Mr Shamsul gave us tips on how to design our website.

- Avoid scroll, the UI design can be a bit different than how we did previously in ID.

- A logo is compulsory.

- Make sure that there are indicators for buttons.

- Our wireframe can be made in figma or miro, as long as it is low fidelity so that it does not become a prototype.

- Be sure to compile a lot of visual references for the art style we want to achieve in our design.

Week 4

Absent

___________________________________________________________________________________

Task 1 - Thematic Interactive Website Proposal 

Instructions 

Description
Thematic Interactive Website Proposal for Brand Engagement. A thematic interactive website is a website that focuses on a specific theme or concept with the aim of incorporating interactive elements to interact with users. Most such websites utilize multimedia such as videos, animations, interactive graphics displayed on the page, or other clickable elements which have interactive components that provoke the user. This dynamic experience is meant to keep the user interested in addition to the thematic concept. Themes in such websites vary from educational, cultural, promotional campaigns to product launch. For example, a thematic interactive site could be a museum. Users can go through a virtual exhibition space through interactive tours, games simulation, or questionnaires. In the event that it is a movie, the site can simulate movie universes offering virtual tours through time and space, or any other subject previously created in the movie. The aim of any such site is to keep the user engaged in the medium through interactive exploration.

Requirements
Students are required to create a thematic interactive website proposal with the topic of their choice that can be based on:
 
1.     A specific product of a particular brand launch/special (i.e.: Nike brand new shoe), Beauty product launch (i.e.: Sephora compact powder,
2.     Movie promotion
3.     Game release promotion.
4.     Gallery/Museum exhibit launch
5.     Band/Artist latest release.

Or anything else you have in mind (subject to the module coordinator’s approval)

Submission
1.     Completed UI/UX proposal document.
2.     All processes (concept, wireframes, mood board, flow chart)

For this task, we are to create the proposal for our final project.

Moodboard

I got started on creating a moodboard of my visual references and page structure before moving on with the wireframe. I've chosen to go with a fun theme to show facts about the Malayan tiger native to Malaysia. 

Moodboard link: Canva

Proposal

After feedback, I had to rework my initial plan and come up with a few more ideas. Among them were Monchhichi, Jazz, and Silent Hill F. I still wanted to go with the tiger theme, so that I could make my own assets. With the suggestion of Mr Shamsul I decided to make my target audience kids. With that I finished the rest of my proposal.

Canva link

___________________________________________________________________________________

FEEDBACK

Week 1:

No feedback given

Week 2:

Specific feedback: Could suggest a few more topics.

Week 3:

Specific feedback: 

- Harimau: can, and more chance for me to make my own assets. determine the art style first, think about who the target audience is. sir suggest kids, make it educational and toned down.

- Monchhichi: sounds interesting

- Jazz: also interesting, but might be more complex if i want to include multiple audio (there is one file that sir can give but it only holds one audio, which might cause conflict if i add multiple)

- Silent Hill F: doable but limited opportunity for me to make my own assets, my pages might end up looking like a gallery.

Week 4:

No feedback given

___________________________________________________________________________________

REFLECTION

Experience

The process of researching and brainstorming to building moodboards, wireframes, and user flow chart taught me how to blend creativity with structure. At first, defining a clear concept felt tricky, but as ideas developed, everything started coming together more naturally.

Observation

By the end, I noticed how much more confident I’d become in connecting ideas with design. Paying attention to flow and consistency made the proposal feel more cohesive. Overall, the project helped me understand how creativity and practicality work hand in hand to make a website both engaging and functional.

Findings

I learned that planning and clarity are essential before diving into design. The moodboard helped set the right tone and style, while the wireframe and user flow chart showed how design choices affect user experience. A good website isn’t just about how it looks, it’s about how easily people can navigate and interact with it.