2/4/2025 - 27/5/2024 / Week 4 - Week 6
WangJiheng / 0378904
Interactive Design/ Bachelor of Design (Honours) in Creative Media /
Taylors University
Project 1
TABLE OF CONTENTS
1.INSTRUCTIONS
2.LECTURES
3. PROJECT1
4. FEEDBACK
5.REFLECTION
3. PROJECT1
Fig 1-1 Blinkee.com
https://blinkee.com/
Website Design Proposal Slideshow Link
What’s Wrong with the Original Blinkee.com?
1. Visually overwhelming: too many flashing animations
2. Unprofessional layout with inconsistent fonts and colors
3. Cluttered navigation system and hard-to-read UI
4. Poor mobile responsiveness
5. Outdated visual identity that confuses users
Next, I'm going to redesign this website.
Redesigned Homepage: Structure and Focus
Fig 1-2 Optimized website
Homepage wireframe showing improved hierarchy, clear sections, and simplified layout
1. Top navigation bar with simplified menu and icons
2. Hero banner for clear promotional messaging
3. Featured Categories: quick access to top product types
4. Best Selling grid: clean product cards with CTA buttons
5. Structured spacing and visual hierarchy improves usability
Redesigned Category Page: Guided Product Discovery
Fig 1-3 Redesigned Category Page
1. Left-side filter bar: by color, price, and availability
2. Right: product grid for browsing, consistent card layout
3. Improved product browsing flow and reduced friction
4. Easier for users to find what they want
Product Page: Purchase Clarity and Trust
Fig 1-4 Purchase Clarity and Trust
1. Left: Large product image
2. Right: Title, Price, Quantity selector, Add to Cart button
3. Description section placed clearly below
4. Customer review section builds trust
5. Related products for upselling opportunities
Contact Page: Clean and Responsive
Fig 1-5 Clean and Responsive
1. Simple layout with contact info (address, phone, email)
2. Right side: Message form with Name, Email, and Message fields
3. Responsive layout adapts well to mobile
4. Improves customer support accessibility and trust
4. FEEDBACK
Week 4
This week's content on web design has given me a clearer understanding of web standards and page structure. I used to think that as long as the web page looked normal on my own computer, it was fine. I never expected that different devices, browsers, and resolutions could cause so many differences in how the page is presented.
Week 5
This week, I studied HTML and CSS and learned that the ID attribute uniquely identifies elements, and the Class attribute can categorically identify them. Both need to be combined with CSS rules to change the element styles. CSS controls styles through selectors and declarations. External style sheets can unify the styles of multiple pages and improve maintenance efficiency.
5.REFLECTION
I have learned a lot over the past few weeks, but there are still many areas where I need to improve. For example, in HTML, the <> tag must be closed with a forward slash (/) at the end. This is a crucial point that the instructor emphasized in class. Even small issues can cause software errors, which is something I need to pay close attention to.
Comments
Post a Comment