Advanced Interactive Design | Task 1
23 Apr 2026 - 14 Jun 2026 (Week 1 - Week 9 )
Chan Xiang Lam | 0358400
Advanced Interactive Design | Bachelor of Design (Honours) in Creative Media
Task 1: Thematic Website Design Proposal
Chan Xiang Lam | 0358400
Advanced Interactive Design | Bachelor of Design (Honours) in Creative Media
Task 1: Thematic Website Design Proposal
TABLE CONTENT
1. Module Information Booklet (MIB)
2. Task 1: Thematic Website Design Proposal
3. Reflection
Module Information Booklet (MIB)
Task 1: Thematic Website Design Proposal
Project Overview
For this assignment, I chose to create a thematic interactive website based
on the luxury eyewear brand Gentle Monster. Instead of focusing on
e-commerce and product purchasing, the website aims to provide users with an
immersive and interactive experience that showcases the brand’s unique
collections, design inspirations, and creative campaigns.
The website is designed to encourage exploration and engagement through
visual storytelling, interactive navigation, and multimedia elements. The
overall experience reflects Gentle Monster’s futuristic, artistic, and
minimalist brand identity.
Concept Development - Gentle Monster: Exploring the Collections
The concept focuses on introducing users to selected Gentle Monster
collections through an interactive digital experience. Rather than simply
displaying products, the website allows visitors to discover the
inspiration, design process, and campaign visuals behind each collection.
The goal is to create a journey where users can interact with content and
learn more about the brand's creative vision.
Mood Board
Before creating the website structure, I developed a mood board to
establish the visual direction of the project. The mood board consists of
Gentle Monster campaign photographs, modern fashion imagery, monochromatic
colour palettes, and minimalist design references.
The mood board helped me identify the overall aesthetic and maintain
consistency throughout the design process.
Fig.1.1 Mood Board
Flow Chart
A flow chart was created to organise the user journey and website
structure. This helps ensure users can navigate through the website
smoothly and understand the relationship between different pages.
Home
↓
Brand Vision
↓
Collection 1
↓
Collection 2
↓
Collection 3
↓
The Design Process
↓
Campaign Gallery
↓
About
↓
End Experience
This structure allows users to gradually explore the brand story while
maintaining a clear and engaging navigation flow.
Figure 1.3 Website Flow Chart
Wireframe Development
After establishing the site structure, wireframes were created to
plan the layout and content arrangement for each page.
The wireframes focus on information hierarchy, user navigation,
and interactive opportunities. Large visual sections were included
to highlight campaign imagery, while simple navigation elements
were used to maintain the brand’s minimalist style.
The wireframe stage helped visualise the user experience before
moving into the final interface design.
.png)
Figure 1.4: Website Wireframe
Reflection
Through this project, I learned how to develop a thematic website based on a strong brand concept rather than focusing solely on functionality. Creating the mood board, flow chart, and wireframes helped me better understand the importance of planning before designing.
One challenge I faced was organising the website content while maintaining a clean and minimalist layout. However, this process improved my understanding of information hierarchy and user experience design.
Overall, this project strengthened my skills in concept development, visual storytelling, wireframing, prototyping, and interactive web design. It also showed me how interactive experiences can effectively communicate a brand’s identity and engage users in a more meaningful way.
Comments
Post a Comment