Interactive Design | Project 1: Website Redesign Proposal

5/05/25 - 26/05/25 [ Week 3 - Week 6 ]

Nicco Chew Jin Xun (0366563)

Interactive Design | Bachelor of Design (Hons) in Creative Media | Taylor's University

Tutor: Mr. Shamsul


Table of contents

Project 1: Website Redesign Proposal [ 20%]


Instructions


Lectures

Week 3: Understanding Website Structure


Week 4: The Web & Language



Week 5: HTML & CSS



Week 6: CSS Selectors



Tutorial & Practical






Process Work

Project 1: Website Redesign Proposal

Objective:
The objective of this assignment is to develop a comprehensive proposal for the redesign of an existing website. The proposal should demonstrate our ability to critically evaluate a website’s design and functionality and to propose design solutions that enhance user experience, aesthetics, and performance.

The chosen website [ Green Chair Recycling ]


Following is the Website Redesign Proposal:


Feedback

- Week 3 [ 05/05/25 ]

  General Feedback:  

We have Week 3 Lecture, which is Understanding Website Structure


  Specific Feedback:  
I showed Mr. Shamsul the website I chose to replicate for my final project, https://www.greenchairrecycling.com/. He suggested that the [ contact us ] button should be clearly visible so that the website merchant can easily reach out. Besides, we shouldn't change the website's contents but improve and arrange it better.

- Week 4 [ 12/05/25 ]

  General Feedback:  

N/A due to Wesak holiday


  Specific Feedback:  
N/A due to Wesak holiday

- Week 5 [ 19/05/25 ]

  General Feedback:  

We had HTML exercises in class with Mr. Shamsul teaching step by step. He also mentioned TCP / IP, which stands for Transmission Control Protocol / Internet Protocol, a suite of communication protocols used to connect network devices on the Internet and private networks. Other than that, the opening and closing tags are very important. He asked us what would happen if we didn't include the closing tag.


  Specific Feedback:  
I showed Mr. Shamsul my in-class HTML exercise, and he commented that the overall layout is fine.
( headings & links ).

- Week 6 [ 26/05/25 ]  ONLINE CLASS

  General Feedback:  

We had a CSS exercise in class, with Mr. Shamsul teaching us step by step. We learnt how to change  the background colour and typeface of headings and body text, which was very fun.


  Specific Feedback:  
I showed Mr. Shamsul my in-class CSS exercise, he commented that overall is fine and asked me to show the code also to check whether I did anything wrong.


Reflection

Experience
Over the past four weeks, my experience in Interactive Design class has been both eye-opening and enriching. Coming in with little to no background in web development, I was introduced to the foundational elements of HTML and CSS skills that now form the building blocks of how I understand the structure and visual language of the web. My first practical exposure began with learning the basics of HTML, such as understanding how to use opening and closing tags, and how these tags define the structure of a webpage. I learned how to create elements like paragraphs, headings, and lists, and how to nest elements properly. Although it seemed simple at first, I quickly realized how essential clean and semantic HTML is for any interactive design. As we progressed, I began working with CSS (Cascading Style Sheets). Through a series of exercises, I learned how to change background colours, apply different typefaces, and adjust font sizes and margins to influence how a webpage looks and feels. These styling exercises helped me see the powerful role that CSS plays in making websites visually appealing and user-friendly.

Observation
One of the key observations I’ve made is how small code changes can result in major differences in user experience. For example, changing just a few lines of CSS can make a website look modern, readable, and engaging or cluttered and hard to use if not done thoughtfully. I also observed the importance of clean, well-structured code, especially when working on larger designs. Organizing code with proper indentation and comments makes it easier to understand and modify later. This habit is something I now pay more attention to, even when working on small exercises.

Findings
I’ve found that HTML and CSS are deeply interconnected as HTML provides the content and structure of a webpage, while CSS brings it to life through design. I’ve realized that interactive design is not just about how a website looks, but also about how users feel and interact with it. Understanding even the basic elements of design and structure can dramatically improve the quality and usability of a webpage. I've also discovered that learning through trial and error, making changes, and immediately seeing the visual results is one of the most effective ways to grow as a designer. Most importantly, I’ve learned that building good habits in coding early on, like organizing and commenting code, lays the foundation for more complex and professional-level work in the future.


Further Reading


Accessible Web Design & Development


Comments