Interactive Design Project 2

22.04.2025 - 29.06.25 (Week 1 - Week 6)
Interactive Design / Bachelor of Design in Creative Media
Task (Exercises / Task)
Emily Ong Su Yu / 0365304   

Table of Contents

1. Instructions

2. Project

3. Feedbacks

4. Reflections

Project 2 Proposal

Instructions

Module Information Booklet

Figure 1.1 Module Information Booklet (Week 1 21/04/25)

Project 2

                                                   Proposal                                                       

Process Work

Project 2: Website Redesign Prototype

1. Prototype Developmen
2. A brief writeup in your E-Portfolio of (500–800 words)

Assignment Descriptions

The objective of this assignment is to translate your website redesign proposal into a functional prototype. This prototype should visually and interactively represent the proposed changes, demonstrating your ability to apply design principles and UX strategies effectively.

Building upon your previous assignment (Website Redesign Proposal), you are now required to develop a prototype of the redesigned website. This prototype should reflect the proposed visual design and user experience improvements, providing a tangible representation of the final product.

Including

Prototype Development:

Interactive Prototype:

Develop a clickable prototype that includes key pages and features of the redesigned website. The prototype should allow users to navigate through the site and interact with essential elements.

Tools: Use prototyping tools such as Adobe XD, Figma, Sketch, or any other relevant software to create the prototype.

Key Pages to Include:

Homepage: Present the main design elements, including navigation, hero section, and key content areas.

Core Content Pages: Develop prototypes for at least ONE core page (e.g., About Us, Services, Products) to showcase how the content is organized and presented.

Contact Page: Include a prototype of the contact page, demonstrating how users can interact with forms or other contact methods.

User Experience (UX)

Considerations:

Usability: Ensure the prototype reflects a user-friendly design, with clear navigation, intuitive interfaces, and accessible features.

Interactivity: Implement interactive elements (e.g., buttons, hover states, form fields) to provide a realistic user experience.

Submission: 

A fully functional prototype ACCESSIBLE via a SHAREABLE

link or as a DOWNLOADABLE file.

A brief writeup in your E-Portfolio of (500–800 words) outlining the key features of the prototype, any design decisions made during development, and how the prototype addresses the objectives set in the redesign proposal.


Reflections

Experience

Project 2 enabled me to move from a website redesign idea to a workable prototype. I concentrated on using Figma to apply interactive design ideas and UX methods. I learnt how important it is to strike a balance between usefulness and aesthetics, ensuring that the design is both visually appealing and functional. The Zoo Negara Malaysia website prototype taught me how to create a website that is both engaging and functional.

Observation    

I realised that a website's design should be more than just visually appealing; it should also be intuitive and functional. For Zoo Negara Malaysia, I focused on designing a layout that highlighted vital content while being easy to explore. The makeover prioritised clarity and engagement by incorporating large graphics and interactive elements like as buttons and hover effects.

Findings

Through this project, I found that website design isn't as complex as it first appeared. Tools like Figma were quite useful for generating a clickable prototype and testing design concepts. I learnt the importance of user feedback and iteration in the design process, which improved the prototype's effectiveness and user-friendliness. This project helped me improve my skills in interactive design and prototyping, and it provided me the confidence to create effective, user-friendly websites. The process was fulfilling, and I'm excited to use these talents on future projects.

Comments