REPORT

Project Name：Thread of Times

The Confucius Institute at the University of Malaya has a Hanfu rental program, and we created this multimedia website based on that to increase awareness of Hanfu and promote exploration of traditional culture.

Project Theme:

This project aims to increase awareness of traditional Chinese clothing (Hanfu) at the Confucius Institute at the University of Malaya by creating a multimedia website showcasing and renting Hanfu.

Project Overview：

The project focuses on demonstrating the specific details, patterns, and how the traditional clothing looks on models, as well as how its history connects the younger generation with Chinese cultural heritage, while also promoting cultural understanding and appreciation between local and international students.

Project Subject: 

Our team will create a website using Google Site, which will serve as an information guide and visual display, integrating historical, aesthetic, and modern elements, as a course assignment (AIM2017- Multimedia Production), for non-commercial use.

1. Introduce and promote the Hanfu rental service offered by Confucius Institutes.

2. Enhance public understanding and appreciation of Hanfu through digital storytelling and multimedia technology.

3. Use multimedia production tools to create easily understandable information and visual materials to promote cross-cultural exchange.

Primary Audience: The UM Community

​The core focus of the website is the internal community of Universiti Malaya (UM), specifically:

• ​Students and Faculty: Individuals looking to engage with cultural activities on campus or participate in university-level events.

• ​Cultural & Photography Enthusiasts: Students specifically interested in traditional culture experiences or those seeking unique attire for professional photography, graduation shoots, or creative content creation.

• ​Event Participants: Members of the UM community who require Hanfu for cultural festivals, performances, or club activities hosted by the Kongzi Institute or other student bodies.

Secondary Audience: Cultural Enthusiasts

​Beyond the university, the website serves as a resource for a broader group of users, including:

• ​General Cultural Advocates: Individuals with a deep interest in traditional Chinese aesthetics, history, and the "Hanfu Movement."

• ​Educational Seekers: Researchers or members of the public who are looking for a reliable source to learn about the evolution of Chinese garments and terminology.

• ​Potential External Renters: People interested in the Kongzi Institute’s offerings who may be looking for high-quality, authentic Hanfu rental services within the region.

The visual identity of the website is built upon the theme of "Harmony Between Past and Present," blending traditional aesthetics with modern usability.

• ​Design Style: Simple yet Elegant. We prioritize clean layouts and ample whitespace to ensure that the traditional elements remain the focus without cluttering the user experience.

• ​Moodboard: The site utilizes a palette of soft pastel pink and red.

1.  Primary Background Color

Warm Peach Beige: A soft, low-saturation peach-beige that creates a calm and welcoming atmosphere.

Used on main page background, section backgrounds, large negative space areas.

Emotion: Warm, gentle, cultural, soothing

2. Primary Accent Color

Soft Gold: A muted golden-yellow with a subtle glow, inspired by lantern light and sunlight.

Used on call-to-action buttons, hover states, icons, dividers, highlights.

Emotion: Warmth, tradition, elegance.

3. Secondary Background Color

Jade Mist Green: A light, misty green with a cool undertone that balances the warm palette.

Used on content blocks, image backgrounds, feature sections.

Emotion: Tranquility, nature, freshness.

4. Secondary Accent Color

Twilight Blue: A muted blue-grey inspired by dusk skies and water reflections.

Used on hero banners, immersive visuals, background overlays.

Emotion: Calm, depth, storytelling.

5. Highlight Color

Cherry Blossom Pink: A soft pastel pink used sparingly for emotional emphasis.

Usage: Tags, badges, hover effects, subtle UI indicators.

Emotion: Romance, softness, delicacy.

6. Text / Neutral Color

Warm Tea Brown: A gentle brown tone that feels softer than pure black.

Usage: Body text, navigation labels, footer text.

Emotion: Stability, readability, warmth.

​To further embody the "Thread of Times" concept, we have implemented a strategic pairing of Montserrat, Lobster, and Playfair Display fonts:

​Serif (Headings & Titles): Chosen for its decorative strokes that mirror traditional calligraphy. It conveys authority, history, and elegance, grounding the website in its historical roots.

​Sans-Serif (Body Text & Navigation): Used for general content to ensure maximum readability and a clean, digital-friendly feel, representing the modern interface.

​Rationale: This combination creates a visual dialogue between the old and the new. The Serif fonts provide a "classic" storytelling feel, while the Sans-Serif fonts ensure the website remains accessible and functional for the user.

Interactive Location Map

​Functionality: This feature displays the precise location of the Kongzi Institute at UM.

​User Benefit: Visitors can interact with the map to get directions, view the surrounding area, and easily plan their visit to the institute for Hanfu fitting or collection.

Google Forms Engagement

​Hanfu Knowledge Quiz: A fun and educational challenge designed to test the viewer's understanding of traditional Chinese attire after browsing our "About Hanfu" section.

​Hanfu Personality & Style Test: Titled "Which Hanfu Suits You?", this interactive assessment analyzes the user's preferences and "vibe." Upon completion, users are presented with a curated Hanfu Moodboard that recommends a specific style of Hanfu tailored to their unique personality.

Interactive Historical Timeline

​Functionality: Instead of static text, users can click through different historical eras or dynasties to see how Hanfu styles changed over thousands of years.

​Design Purpose: This approach transforms complex historical data into a digestible and engaging visual journey, allowing users to explore the "Thread of Times" at their own pace.

This multimedia production project provided valuable hands-on experience that extended beyond technical skills, offering deeper insights into teamwork, cultural responsibility, and user-centered digital storytelling.

1. Importance of Structured Team Collaboration

One of the most significant lessons learned was the importance of structured collaboration in a multimedia project. While each member had clearly defined roles, the success of the project depended heavily on effective communication and coordination. Regular discussions, task updates, and shared planning documents helped prevent misunderstandings and ensured that all components of the website developed cohesively. This experience highlighted that strong teamwork and leadership are just as critical as technical skills in multimedia production.

2. Adapting Creativity Within Technical Limitations. 

Working with Google Sites taught us that creative ideas must often be adapted to fit technical constraints. Unlike advanced web development platforms, Google Sites offers limited customization options. This limitation forced us to prioritize clarity, functionality, and user experience over excessive visual effects. As a result, we learned to approach design strategically—using layout, colour, typography, and embedded tools creatively to achieve meaningful interaction without overcomplicating the interface.

3. Cultural Accuracy and Ethical Storytelling

Producing a cultural-themed multimedia project requires a high level of responsibility. Through researching Hanfu history and presenting it digitally, we learned the importance of accuracy, sensitivity, and respect for cultural heritage. Even small details, such as terminology or visual representation, can affect how audiences perceive traditional culture. This reinforced the idea that multimedia creators are not just designers but also cultural storytellers with ethical responsibilities.

4. The Value of User-Centered Design

Another key lesson was the importance of designing content from the user’s perspective. Interactive features such as quizzes, personality tests, and timelines encouraged users to actively engage with the website rather than passively consume information. This demonstrated how user interaction enhances learning and emotional connection. We learned that effective multimedia production focuses not only on aesthetics but also on how users experience and navigate the content.