Advanced Interactive Design · Task 1 · Thematic Interactive Website Proposal

-
Sept 2024 - 20 Oct 2024 / Week 1 - Week 4
YANG ZHI CHING / 0365154
Advanced Interactive Design / Bachelor of Design (Hons) in Creative Media
Task 1 · Thematic Interactive Website Proposal

INSTRUCTION


Doc 1.1 MIB

Task 1 · Thematic Interactive Website Proposal

Requirement |

We are tasked to creat a proposal for a thematic interactive website that engages users through multimedia elements and interactive features. The website should create an immersive user experience while promoting a specific brand, product, or event.

  1. Topic Selection (Choose one):
    • Product/Brand Launch
    • Movie Promotion
    • Game Release
    • Gallery/Museum Exhibition
    • Band/Artist Release
  1. Required Submission:
    • Complete UI/UX Proposal
    • Process Documentation:
      • Concept Development
      • Wireframes
      • Mood Board
      • Flow Chart
All work must be documented in E-portfolio as reflective studies.

Topic Selection |

First, I collected five topics that I was interested in, namely: Kuala Lumpur illustration fair (exhibition), Chagee product launch (product), DR Mister (Brand), The Eon (Airpods cover product), Kelly Kitty (Brand). so my final topic is KLIF.

Fig 1.1 Kuala Lumpur Illustration Fair Poster 2024

Why choose KLIF? 
I was impressed by the performance of KLIF 2024 and believe that the upcoming exhibitions have great potential. KLIF could significantly boost the presence of local Malaysian artists. Taking this opportunity, I will use KLIF as the theme for my website, it belongs to Gallery/Museum exhibit launch in task requirement.

What is KLIF?
Founded since 2023, an large illustration art exhibition in Malaysia.
KLIF strives to exhibit, learn, share, and create opportunities within the Malaysian illustration community and to promote community engagement including attracting tourism, trade and talent to destination.

Visual References |

Since KLIF is an art exhibition, it already has its own theme color, and I plan to use this color scheme to continue the design.

Fig 1.2 Visual Collection Of KLIF 2024

Website Structure |

Fig 1.3 Flowchart in Miro

Fig 1.4 Wireframe in Figma

Design Concept |

Fig 1.5 Color Scheme

Font:
Heading Font Option:
Body Text Font Option:
Fig 1.6 UI Elements References

Presentation Documents |


REFLECTION

| Experience |
I am very excited to learn dynamic web pages. I think this is a very interesting project. When I first wanted to make the Klif theme, I didn't find its official website. This made me think at first: "Oh no, there is already an official website, so it will be difficult for me to make a better website." But then I changed my mind and thought that I could make websites with different directions. For example, the official website is mainly for communication and consultation, and I want to make my website mainly for "showing works", so I made some changes.

| Findings | 
This is an interesting project, and I also believe that it is difficult, so time management is required.


Comments

Post a Comment

Popular posts from this blog

Application Design II · Task 2 · Interaction Design Planning & Prototyping

-
Image
21 April 2025 - / Week 1 - Week 7 YANG ZHI CHING / 0365154 Application Design II / Bachelor of Design (Hons) in Creative Media Task 2 · Interaction Design Planning & Prototyping INSTRUCTION Doc 1.1 MIB Requirements: 1. Interaction Design Documents: Creating detailed flowcharts and wireframes to map out user journeys,  creen layouts, and navigation paths. 2. Animation Prototyping Micro Animations: Small effects like button clicks, loading icons, and feedback states, prototyped in Figma. Macro Animations: Larger UI transitions or intro animations. I can use After Effects or reference similar examples if needed. 3. Explanation & Prese...
Read more

Experiential Design · Task 3 · Project Prototype

-
Image
21 March 2025 - 3 June 2025 / Week 6 - Week 11 YANG ZHI CHING / 0365154 Experiential Design / Bachelor of Design (Hons) in Creative Media Experiential Design · Task 3 |  Instruction Doc 1.1 MIB | Visual Design Prototype Concept and Theme | Together with my teammate Tze Wei, we decided on a theme centered around a "technological future" . To match this concept, we chose a light green color scheme and a minimalist visual style. The color light green symbolizes innovation, freshness, and comfort—qualities that align with our futuristic and user-friendly AR application. Fig 1.1 Reference Moodboard Design Guide | ...
Read more

Information Design · Exercises ·

-
Image
3 Feb 2025 - 10 Feb 2025 / Week 1 - Week 2 YANG ZHI CHING / 0365154 Infoemation Design / Bachelor of Design (Hons) in Creative Media Exercises · Quantifiable Information INSTRUCTION Doc 1.1 MIB Instruction | Gather a set of objects and separate it into category such as color, shape, pattern, and other quantifiable factor. Example: 1. Box of Lego 2. Jar of button 3. Jar of marble ball 4. Set of colourful rubber strap In this exercise you're required to quantify our chosen objects and arrange them into  a presentable layout or chart .  The information must be presented as is, and you need to arrange the objects with relevant indicators written out with pens to help you to visualize the quantity and data. The examples of objects that can be use are buttons, coins, lego pieces, M&Ms, and more. Submis...
Read more