Interactive Design - Task 2 Web Prototype

  Interactive Design - Task 2 Web Prototype



Lee Jong Yun / 0358356 


Task 2 (Web Prototype)

TABLE OF CONTENTS

I. Instructions

II. Lectures

III. Exercises

I. Instructions


Website Redesign Prototype – The Chicken Rice Shop








For this assignment, I chose to redesign The Chicken Rice Shop website. The current version of the site looks pretty outdated, and honestly, it doesn’t reflect how popular or well-known the restaurant is. The layout feels a bit cluttered, the font choices aren’t great, and the overall design lacks modern aesthetics. So, I wanted to give it a cleaner, simpler look while making it easier to navigate.

I focused on improving the user experience and giving the website a more professional feel. My redesigned version includes three main pages: the homepage, an about page, and a contact page.

The homepage is simple and direct. I used a clean layout with clear navigation at the top. I avoided using too many words or distractions and just kept things straight to the point. The red theme is kept throughout the site since it matches the brand, but I used it in a softer way to make the design feel less heavy. I also used white and black as supporting colors to keep the design clean and easy on the eyes.

The about page talks about the restaurant's story. I made sure the layout wasn’t too text-heavy by separating content into short sections with headings. I also added images to make the page more engaging. The goal was to make the user feel like they understand the brand better without getting overwhelmed.

The contact page includes a simple form where users can enter their name, email, phone number, and a message. I also added space for contact details like email and phone number. The layout is very straightforward and meant to be user-friendly, even for someone who isn’t tech-savvy.

For the fonts, I kept everything the same throughout the whole prototype. I avoided bold styles and stuck to regular weight to keep the design feeling clean and consistent. I chose a modern sans-serif font because it’s easy to read and looks more professional. The font size is also kept consistent across all pages so the design doesn’t look unbalanced.

Even though this is a prototype, I tried to include some interactive elements using Figma. For example, the navigation works so you can click between pages, and buttons have hover states that give a more realistic feel to how the actual site would work. These small interactions help make the prototype more user-friendly.

The biggest improvement I wanted to make from the original site was better clarity and structure. I didn’t want users to feel confused or lost. So I used proper spacing, cleaner alignment, and better visual flow. I made sure that the new design could deliver the content more efficiently and leave a better impression on users.

This prototype reflects my intention to balance design and usability. It’s not just about making it look better, but also about making it function more clearly for the users. If I had more time or if this was for a real client, I would explore adding more features like a menu section or a location map. But for now, I think this version shows a strong direction for how the new website could look and work.




Comments

Post a Comment

Popular posts from this blog

Image
 ILLUSTRATION AND VISUAL NARRATIVE  October 09, 2024 Week1 - Week 3 Lee Jong Yun / 0358356 Bachelors of Design in Creative Media _________________________________________________________________________________________________ Table of Contents   1. Lectures 2. Instructions 3. Feedback 4. Reflection --- Lectures   Weeks 1 & 2: Character Design In these sessions, we explored the fundamentals of character design, focusing on three essential principles:   - Iconicity: Designing characters with strong, recognizable silhouettes.   - Simplicity: Ensuring each character’s design serves a clear purpose.   - Uniqueness: Creating memorable characters that stand apart visually. Key design techniques emphasized included:   - Emphasis and Contrast: Enhancing visual elements to make characters stand out.   - Harmony: Maintaining a visual hierarchy where all design components complement one another.   - Expre...
Read more
Image
TYPHOGRAPHY  Task 1  October 08, 2024 / Week 1 - Week 6 Lee Jong Yun (0358356) ___________________________________________________________________________________ TABLE OF CONTENTS 1. Lectures 2. Instructions 3. Process Work 4. Feedback 5. Reflection 6. Further Reading ___________________________________________________________________________________ LECTURES  WEEK 1 Lecture: Introduction to ePortfolio Design  We were introduced to the key components of setting up an ePortfolio, highlighting its importance in showcasing individual progress and design thinking. Lecture: Typography Fundamentals  Drawing from Kane’s *A Type Primer* (2002), the focus was on early Western letterform evolution, with an understanding that these narratives often omit contributions from other regions, particularly Asia. Development of Letterforms: From Phoenician to Roman   The origins of typography can be traced back to ancient practices where early letterforms were etched in...
Read more