Project 2: Website Redesign Prototype

 28/05/2025 – 11/06/2025 (Week 6 – Week 8)

Valerius Ethan Wirawan / 0372774

Interactive Design / Creative Media / School of Design

Project 2: Website Redesign Prototype

---

TABLE OF CONTENT

1. Lectures

2. Instructions

3. Project 2: Website Redesign Prototype

4. Feedback

5. Reflection

---

1. LECTURES

---

2. INSTRUCTION

Fig. 2.1. Module Information Booklet (MIB)

---

3. PROJECT 2: WEBSITE REDESIGN PROPOSAL

Task Brief

For this assignment, you are required to translate your website redesign proposal into a functional, interactive prototype that effectively demonstrates your design and user experience improvements. Using tools such as Adobe XD, Figma, Sketch, or any similar software, create a clickable prototype that includes key pages: a homepage showcasing navigation, hero section, and main content areas; at least two core content pages (e.g., About Us, Services, or Products); and a contact page demonstrating user interaction through forms or other contact methods. Your prototype should reflect an appropriate level of design fidelity (low, medium, or high), depending on your project’s scope. It must prioritize usability, intuitive navigation, and accessibility while also showcasing responsiveness across desktop, tablet, and mobile devices. Interactive elements like buttons, hover states, and form fields should be included to simulate a realistic user experience. The final deliverable should be a fully functional prototype accessible via a shareable link or provided as a downloadable file.

Work Process

Fig. 3.1. Work Process Screen Capture

Final Outcome

Fig. 3.2. Project 2 'Website Redesign Prototype' Work Process (Figma)

Fig. 3.3. Project 2 'Website Redesign Prototype' Final Outcome

If the embeded website can't be accessed, please use this alternative link instead.

---

4. FEEDBACK

Week 9

Feedback from the lecturer highlights several important areas for improvement. First, the website should include a consistent header with five page buttons, ensuring that the same logo remains visible and unchanged when navigating between pages. The footer also needs to be well-composed, with better structure and visual balance. The homepage should be made more interactive by adding additional buttons to engage users. It was also suggested to add an underline beneath the active page in the navigation bar to clearly indicate which page is open. On the Events page, captions or descriptions should be added beneath each image to provide context. Overall, the website appears dull and would benefit from a more vibrant and colorful design. Lastly, in the Contact page, the phrase “Reach us out!!” should be revised to remove the exclamation marks for a more professional tone.

---

5. REFLECTION

Experience

Working on the Website Redesign Prototype was both challenging and rewarding. Turning the initial proposal into an interactive prototype required careful planning, attention to detail, and a strong understanding of user interface design principles. I gained valuable experience using prototyping tools and improved my ability to apply design consistency across different pages. The feedback I received from the lecturer also encouraged me to revisit certain design choices and make meaningful improvements.

Observation
Throughout the process, I observed that building an interactive prototype is not just about arranging visual elements. It also involves thinking deeply about how users will interact with the interface. Features such as a consistent header, proper footer composition, clear navigation, and responsive layout are essential to a good user experience. I also noticed that a lack of color or visual hierarchy can make a design appear flat and uninviting, even if the structure is well organized.

Findings

From this project, I discovered that user engagement and visual appeal are both crucial to effective web design. Simple enhancements like hover effects, underlined navigation buttons, and image captions can greatly improve clarity and interaction. I also learned the importance of maintaining brand consistency across all pages by keeping the same logo and layout structure. Most importantly, I found that incorporating constructive feedback is essential for refining the design and creating a more impactful and user-friendly prototype.