21.04.2025 - 07.08.2025 (Week 1 - Week 16)

Janaan Ahmed (0353333)

Minor Project/ Bachelor of Design (Hons) in Creative Media

Project Compilation

Instructions

WEEK 1 + 2: Project Selection / Group Formation

Despite being a UI/UX based project I was curious about the AR x culture element that WarisanXR was about and so selected this group. Since our group has no one from Graphic Design, Mr. Mike said that me (Digital Animation) and Felita (Entertainment Design) might have to anticipate doing some GD work. I myself am also prepared for any 3D work that I think will be needed in this project.

Fig: Group info
Our group members:

Jie Xuan (Group Leader)
Joey
Ser Chen
Zhi Ching (Chelsea)
Tze Wei
Felita
Me

Project Brief: WarisanXR (by TrueXR)

WEEK 3: Secondary Contextual Research (Empathise Stage)

The initial stage of our project was to first build a solid understanding of the client, their needs, and gather more background information surrounding the project to set the foundation for the upcoming stages.

Our group brainstormed and created a Miro board with each member contributing to one area. Since WarisanXR is a cultural holographic experience done in collaboration with Muzium Negara (National Museum of Malaysia) with Istana Satu as the target location, we also looked into relevant areas such as AR in museum settings, etc.

The main (final) topics and designated teammate are listed below (view full board here):

Janaan (me): Overview of WarisanXR
Tze Wei: Background on Muzium Negara (TrueXR’s client)
Felita: Pilot location - Istana Satu
Chelsea: AR-based cultural exhibits/events in Malaysia
Joey: UX principles for AR in museums/cultural spaces
Ser Chen: Case studies of AR use in similar museums
Jie Xuan: Visitor reviews from those case study museums

Fig: My contextual research board

As for me, I looked in to TrueXR as a company, and more about WarisanXR and its goals, objectives, target audience, location, and what was included in the experience. I learned that WarisanXR is a location-based AR experience and that their first launch was at Central Market. It is genuinely really cool to see culture and tech be bridged together through things like holograms. Their goal is mainly to increase youth engagement with Malaysian heritage, and though I am not Malaysian myself, I found it very interesting and found myself getting inspired with ideas that can be implemented in my home country too. Preserving each of our rich cultural identities is incredibly important, which is why I deeply resonated with WarisanXR’s vision to foster national pride and help the younger generation feel more connected to their respective heritage.

WEEK 4: Refining Contextual Board

Mr. Mike mentioned that our topics were a little too broad and that we had to narrow things down or be more specific. My group members and I helped each other where needed to refine our topics. Our group then summarised all our findings into one board as follows:

Fig: Summarised Contextual Board

In my case, I added an additional section to my board about the proposed tech that WarisanXR plans to use, which are the XReal Utlra Air 2 Glasses, and BeamPro combination. Since I am a tech noob it gave me a brief idea of what to expect when we got to try out the tech during our meeting with the client. It was important to understand how the devices work, especially since our final design outputs will involve using them. One key takeaway was learning about the 6 Degrees of Freedom (6DoF), which allows users to move freely in 3D space as the tech tracks their movement.

Reference videos:

WEEK 5: Creating User Personas

This week we moved on to the next step of the empathise stage which was to develop early user personas. They are fictional and realistic depictions of users developed based on our research to help us understand users needs, motivations, experiences and pain points. At this point we hadn't really done a field visit to the museum which worried me since I felt that the field visit could've provided a more accurate insight into the user demographic. In our case we referred to the visitor stats in Muzium Negara's annual reports which listed 3 categories; local visitors, international visitors, and students. We also looked up reviews for Muzium Negara on Google Maps. From these resources we made 3 user personas consisting of:

Dad on a family outing

Culturally-curious tourist

Local Student

Fig: Persona 1 profile

Fig: Persona 2 profile

Fig 3: Persona 3 profile

WEEK 6: Data Collection Prep (Survey Questionnaires & Interview Questions)

This week we prepared for the user research data collection by first creating a survey questionnaire. We held a group meeting to discuss the sections and each of us set out to create questions for one section.

Fig: Questionnaire sections

The sections include:

Demographics

Cultural Interest & Heritage Engagement

Awareness & Past Experience with AR/MR

Motivations & Expectations of using AR

Concerns using AR

Introducing WarisanXR

I managed section 2, which was Cultural Interest & Heritage Engagement. This section was designed to explore the participants' interest in Malaysian culture and heritage, and how they typically engaged with museums/cultural spaces.

Initial Survey Questionnaire:

Mr Mike commented that some parts of our questionnaire needed major refining as they either didn't make sense or had poor directing. And so we refined the questionnaire and included a rationale for why each question was asked. Chelsea created the form, and I refined the introduction part and some parts of the structure.

Amended Survey Questionnaire:

After having our questionnaire approved, we each shared the questionnaire online with a target of 100 respondents by the next week.

Fig: Online distribution

During this week we also created interview questions for our field visit to the National Museum planned for next week (finally!).

Since we were on a tight deadline, I thought it would be helpful and speed up the process to also shared the questionnaire with visitors during our field visit so generated a QR code we could show them.

WEEK 7: Muzium Negara Field Visit

By this time, we had somehow already received 50 survey respondents. During our visit to the museum we each had a few tasks assigned to us:

Jie Xuan: interviewer

Joey: interviewer

Ser Chen: videographer

Tze Wei: Check AR features, photograph sections C+D, distribute survey

Chelsea: Check AR features, photograph sections C+D, distribute survey

Felita: Photograph section B + distribute survey

Me: Photograph section A + distribute survey

Tze Wei and Chelsea used the AR app in the museum since they both had iOS and the museum app was not up to date for Androids. There weren't a lot of AR elements to be honest.

Other interactive elements were in gallery A which had a screen showcasing the ancient civilsation, and gallery B with an interactive puzzle.

Felita and I stuck together throughout and we both distributed the survey questionnaires via QR by approaching visitors. It was difficult at times since some people understandably did not want to speak, but the ones that did gave us really insightful views on the use of AR and museum culture in general. I also observed how people behaved in the museum (as in how they interacted with the exhibits, and the social dynamics particularly in family settings to see how it influenced their experience/interaction with the exhibits. This would later prove useful to refine our user personas.

The other group members conducted the interview with 3 people. The interview video and transcript can be found below:

Interview Video

Interview Transcript

WEEK 8: Data Analysis & Problem Statement - Define Stage

We managed to reach 70 respondents and thus closed the form. My main task this week was to refine the user personas alongside with Felita. But since we finished our parts quite quickly, we both helped Chelsea do the survey analysis (which Mr. Mike proposed we used AI to assist us in since it involved huge chunks of information). We took relevant points from each one and kept it short.

Fig: Survey Analysis

We did this in stages. After analysing each individual question, we combined them to create a section summary (6 sections total). These were then combined into one overall survey analysis. We also analysed the interview data and summarised key points, which were then integrated with the survey findings to form a complete user research summary.

We then move onto finding our top insights from the user research, and defining the problem statement.

Fig: Defining the problem

Each member first noted down their 5 top findings and as a group we categorised all our findings into key themes.

Fig: Deriving key themes from data findings

From these key themes, our group created 5 insight statements :

People like culture but don’t visit museums because of things like cost, time, or difficulty getting there.

Short, fun, and easy AR works best because it's quick to enjoy, keeps attention, and is simple to use.

AR is well known, but not common in museums because it needs money, skills, and time to set up.

Social media drives awareness because it spreads information fast and reaches many people easily.

Users resist downloading due to limited storage, low interest, unfamiliarity, and the app’s unavailability on Android.

These insights guided us to define the problem statement which will shape the design direction moving forward and ensure our solutions are rooted in real user needs.

Fig: Crafting problem statement

To narrow down on the most relevant user for our problem statement, I also filled in the user stories to identify what they want how they could benefit from it:

Fig: User Stories

We had to rationalise why we selected a particular user for the problem statement. The student persona aligns with one of WarisanXR’s primary target audiences AND supports its goal of increasing youth engagement with heritage. Also, the majority of survey responses came from tech-savvy students who expressed a strong interest in culture, reinforcing the relevance and impact of designing for this group. Therefore we selected student and also proceeded to complete the empathy map.

Fig: Empathy map

Our problem statement:

Students seeking immersive history experiences need to engage with the past interactively, excitingly, and authentically because they want fun, accessible AR culture experiences.

To then help us drive a design solution, we had to create 'How Might We' statements (HMV) which are derived from the insights. They are shown below:

Fig: HMW's

At this point we were prepared to finally start putting together our design proposal.

WEEK 9A: Site Visit & Client Meeting

We finally got to meet our client Justin from WarisanXR and check out the pilot location Istana Satu. Additionally we got to try out the AR glasses for ourselves. Unfortunately our group leader Jie Xuan, and Chelsea had a clashing programme so couldn't attend which was very sad. At the site we didn't have a clear direction of what to do and our group was a bit lost but Tze Wei and I stepped in and managed to come up with a few tasks for all of us to do:

Analyse and photograph the interior of Istana Satu, for lighting, measurements, motifs, etc (assigned to all)

Map out the user journey from different entry/exit points leading to Istana Satu

Museum Entrance (Joey, Ser Chen)

Car Park (Joey, Ser Chen)

MRT (Me, Tze Wei, Felita)

Museum Exit (Me, Tze Wei, Felita)

Interview Mr. Justin to understand his expectations for the project + tech involved (Joey, Ser Chen)

Istana Satu Visit Video:

Interview Transcript:

Ser Chen needed some help with transcribing the interview to include in the edited video, so I helped her with it.

From Speaking to Mr. Justin, we pin-pointed some important things to keep in mind regarding the project. Mr Justin emphasised heavily on the user journey and user experience, but also gave us notes about the theme, marketing, ticketing etc. Tze Wei, Felita and I discussed these as we travelled back home together.

Fig: Notes from client meeting

WEEK 9B: Design Proposal & Initial Concept Ideation - Ideate Stage

This week each of us were tasked with brainstorming and coming up with some conceptual ideas. However I guess our group was a little lost since no one really had ideas, myself included. I came up with the two initial ideas which were roleplaying experiences around daily palace life of historic roles.

Jie Xuan our group leader liked idea 1 and so expanded on the specifics of the idea as shown below:

WEEK 10A: Concept Finalisation (Mak Yong) - Ideate -> Prototype Stage

Mr. Mike raised some important points about our initial Palace roleplay idea. Following this, some of our group members proposed that we center our project around Mak Yong, an ancient Malay theatre form from Kelantan that combines acting, singing, and dance to tell traditional stories. This concept offered greater potential as an immersive cultural experience, allowing us to clearly define the era, adapt to Istana Satu’s limited space, and connect directly to our main persona’s learning goals.

In this revised storyline, visitors take on the role of a spiritual guide or time traveller who journeys back in time to help a young Mak Yong dancer rediscover her confidence and the artistry of Mak Yong traditions. I found the idea both culturally rich and fitting for our project particularly given Mak Yong’s historical significance and its ban for pre-Islamic elements, which makes it a lesser-known tradition worth preserving and sharing with students.

However I was a little disappointed that this concept was finalised and discussed without all group members present. This made me feel somewhat left out and highlighted a sense of disconnect within the group. I raised the issue of communication so that we could ensure equal contribution and stay on the same page.

At this stage, I was also unsure about my specific tasks. Later, our group leader clarified the roles assigning Felita and me to work together on the exhibition space decor, photobooth design, and key visual.

I worked on creating the key visual.

The initial art direction was more traditional-based with warm and earthy tones and accent neon colours from the Mak Yong costumes. Ser Chen and Joey were in charge of coming up with the art direction and creating the UI buttons, so I followed those to create my part.

Fig: Mak Yong Moodboard

Fig: Project art direction

For the key visual I referred to the script and storyboard made by Chelsea & Tze Wei who were in charge of defining the interaction points and user experience. I referred to station 3 - Practice & Instruments, particularly the interaction point involving the Mak Yong musical instruments rebab, gendang, and tetawak (see below).

Fig: Station 3 User Experience

We were on a time crunch, so I thought to keep things simple instead of building the visual from scratch. So I found relevant images of the 3 instruments, and a Mak Yong dancer and used Photoshop to separate them from their backgrounds. The output honestly looked very rough, but at this point I just needed for it to be done by our first presentation deadline so just made it so that our idea was communicated.

Fig: Illustrator workspace

Outcome:

Fig: Key Visual frame 1

Fig: Key Visual Frame 2

WEEK 10B : Proposal Presentation and Client Feedback

Our client gave us several suggestions for improvement. The main points were to build a stronger rationale for why we chose Mak Yong and to connect it clearly to our user research and target demographic. They also advised us to refine the design for youth appeal, enhance interaction (consider gamification), and ensure consistent storytelling and branding.

WEEK 11: Mascot Design

This week we each worked in our sub team to refine our proposal based on the client's feedback:

Research & Content Team (Felita, Joey)

Visual Design Team (Janaan, Ser Chen)

UX & Interaction Team (Chelsea, Tze Wei)

Mak Yong Pelakon Interview (Jie Xuan)

Ser Chen and I divided our workload as follows:

Ser Chen

Mini research or moodboard: related to Mak Yong patterns

Colour palette

Patterns, motifs/symbols (so we can copy and paste these into buttons, character clothing patterns/accessories, etc.)

Me:

Mini research or moodboard related to Mak Yong outfits

Character sketches

3D render (Pak Yong, Mascot)

Moodboard & Reference

I first looked up references for the mascot and Pak Yong's character design and and made simple sketches so that they can easily be modelled in 3D.

Fig: Character Moodboard

For our mascot, I didn't want to use something random so chose between a tiger and bird since they are often symbolically featured in Malay folklore and mythology. I learned that Traditional Mak Yong stories sometimes include bird imagery or characters representing birds, which reflect themes like freedom, transformation, and messages from the supernatural world. The graceful movements in Mak Yong dance can also imitate birds’ flight, adding to the ethereal and mystical atmosphere of the performance. Ultimately, I chose the tiger because it is a powerful symbol of strength, courage, and protection which are qualities often featured in Malay folklore and thus very fitting for Mak Yong’s dramatic and spiritual themes. The tiger embodies the bold energy that balances the delicate grace of the dance, making it a compelling and meaningful mascot for our project.

To make it memorable I named our mascot Rimau, short for harimau which means tiger in Malay.

Fig: Character sketches

Fig: Illustrator workspace

Fig: Rimau no headpiece (vector)

Fig: Rimau with headpiece (vector)

Fig: Blender Workspace

Fig: Rimau 3D model

Sadly I was not able to do the 3D model for Pak Yong since the workload felt a bit heavy for me alongside balancing with other modules.

WEEK 12: Refined Art Direction

There was some confusion with the colour palette and general art direction and we were at a standstill, so Chelsea took the initiative and suggested a really bold and interesting art direction with retro cyberpunk aesthetic to complement Mak Yong's vibrant and neon costumes. This fusion highlights the traditional brightness of Mak Yong while introducing futuristic, glowing elements that appeal to younger audiences, creating a visually striking blend of heritage and modernity.

Fig: Moodboard for updated art art direction

Fig: Moodboard for updated art art direction

Fig: Updated Art Direction

At this point I also felt a bit more comfortable since we now had a clearer art direction. Our aesthetic case studies involved Chinese cyberpunk and Vietnamese neo traditional pop (referencing Hát Bội, a Vietnamese theatre form).

WEEK 13: Reworking Rimau, Key Visual & Customer Journey Map

At this stage Jie Xuan and Tze Wei start creating the customer journey map. In the meantime my main task was to update our key visual and Rimau to reflect this new art direction. Once Chelsea and Tze Wei redesigned the user flow and story script, I referenced their storyboard and built the new key visual. The musical instrument section was now updated and gamified (similar to piano tiles).

Fig: Updated gamific reference

Modeling the Gendang

Fig: Gendang reference images

Looking back I could've expedited the process by using a pre-modelled Gendang, but I couldn't find any free ones. So I looked for some online and studied them to create my own 3D model of the gendang on Blender.

Fig: Blender workspace

I then duplicated the gendangs and tried to create the scene by adjusting the camera angle and perspective, and adding lighting.

Fig: Scene setting on Blender

Creating the motifs

To create the notes, instead of using random symbols, we thought to apply traditional songket and batik symbols some of which are often featured in Mak Yong costumes.

Fig: Motif research by Ser Chen

In addition to this, I also referenced a wonderful E-Book to study the motif designs

Fig: Ethnic Motifs of Malaysia (link here)

I created the flat vector motifs on Illustrator.

Fig: Illustrator workspace for motifs

Fig: Finalised motifs

I them imported them into Blender and added lighting that matched the motif colours, as well as added a photograph of the inside of Istana Satu as the background of the final render.

Fig: Adding lighting to the motifs

Fig: Nodes for setting background image

UI Layout

I then import the newly rendered scene into Illustrator and use the UI buttons designed by Tze Wei to complete the scene.

Fig: Illustrator Workspace

For the AR walkthrough, Tze Wei found that my key visual didn't fit the dimensions of the AR glasses so later I fixed the perspective of the scene back on Blender and imported it back to Illustrator.

Outcome:

Fig: Key Visual

Fig: Rimau with upated colour

Fig: Rimau (Flat Design) - Updated

WEEK 14: Merch Design

At this stage, Jie Xuan created the final task list for us following the customer journey map. we are also working on the final proposal slides. Felita and I were tasked with creating the merch, photobooth, and station designs.

My tasks:

Merch

Stickers x3

Enamel Pins/badges x3

Stations

Station 1 (Offering Table)

Station 4 (Battlefield/Storming Forest)

Station 5 Performance Stage

I watched some Mak Yong videos to reference some of the hand gestures, headpieces, costumes, and other elements of the performances.

Fig: Sticker/pin moodboard

Fig: Sketches

Fig: Illustrator Workspace

In addition to finding mockups, I also designed the pin backing boards, coming up with catchy phrases and thoughtful naming to make them more engaging and memorable for the audience, adding a layer of personality that complements the overall theme of our project.

Fig: Pin board design progress

Outcome:

Fig: Final Sticker Designs

Fig: Sticker Trio Mockup

Fig: Sticker 1 Mockup

Fig: Sticker 2 Mockup

Fig: Sticker 3 Mockup

Fig: Enamel Pin Pack Mockup

Fig: Pin 1 Design

Fig: Pin 2 Design

Fig: Pin 3 Design

WEEK 15: Station Design

For the station design, I used Blender, creating some objects on my own but mostly downloading free 3D assets to build each scene. At this point I was also really really burned out because it felt like the work was never-ending. I looked up some references for each of the scenes I was tasked with.

Station 1: Offering Table

Fig: Station 1 Moodboard/Reference

Fig: Progress on Blender

Fig: Front view on Blender

Station 4: Battlefield (Storming Forest)

Fig: Station 4 Moodboard/reference

Fig: Viewport Shading View Blender

Fig: Scene progress on Blender

Fig: Making glowing board

I made 2 variations for the background board to simulate scene changes

Station 5: Performance Stage

Fig: Station 5 Moodboard/Reference

Fig: Scene Progress

Fig: Adding motif

Fig: Scene progress

I could not complete this station and had to really rush and cut corners for this one. It is really unfortunate and I definitely acknowledge that it falls short by a big margin. But I really did try my best for the other two stations.

Outcome:

Station 1

Fig: Station 1 Final Render

Fig: Station 1 Closeup

Station 4

Fig: Station 4 Final Render

Fig: Station 4 lighting variation

Fig: Station 4 Closeup

Station 5:

Fig: Station 5 Final Render

WEEK 16: Final Presentation

We had 3 rehearsal sessions before our final presentation.

Reflection

Experience

Now that the project is done, I can be honest in saying that this was somewhat of a disappointing group experience for me :( But I tried not to let this show to any of my group members as I did not want it to affect our dynamic or progress, especially since we were constantly behind. Our group felt somewhat disconnected, and communication not always the best which I realised can greatly affect productivity and the quality of the final work. Sadly I believe this disconnect was reflected in our final design outcome, as our clients mentioned that the visuals felt inconsistent and not seamless. It also felt as though some members carried a heavier workload than others. That said, I truly appreciate the members who gave their best effort despite the imbalance. There were moments when we were all aligned and on the same page, and those were the times when we had the best momentum and produced our strongest work. Within my own role, I recognise that my perfectionistic tendencies slowed my progress at times, as I often spent longer refining my work than planned. Fortunately, our group leader was understanding of this and maintained a positive, encouraging attitude, which helped reduce pressure and keep me focused on contributing my best. This experience taught me that maintaining a positive and resilient attitude can make a difference, even in challenging situations. I also realised how much clearer communication and shared accountability can improve group work, and I will carry these lessons into future collaborations. Despite the challenges, it was exciting to learn about Mak Yong and explore how traditional art could be blended with futuristic influences. I believe our art direction had strong potential, even if our execution did not fully achieve what we had envisioned.

Observation

During the project, I noticed that the design thinking process really helped guide our approach, especially in the early stages. The empathy stage was particularly important, as learning about Mak Yong’s cultural significance allowed us to think more deeply about how to represent it respectfully while still incorporating futuristic influences. Researching the traditions, costumes, and performance styles helped me see the value of grounding creative decisions in cultural context. Since our project was AR-based, it was especially exciting to try the AR glasses for myself and experience how our ideas could come to life in an immersive way. This hands-on experience made it easier to visualise how the audience might interact with the event and what adjustments could improve usability and engagement. I also observed that user-focused decisions shaped the direction of our work. Considering the needs and expectations of our target audience (youth) encouraged us to think about accessibility, visual clarity, and how to blend tradition with modern appeal in a way that would resonate with them. While not all of these ideas translated perfectly into our final outcome, the process showed us how important it is to keep the end user in mind throughout every stage of design.

Findings

This project showed me how design process and teamwork directly affect results. Immersing myself in Mak Yong’s heritage and experiencing WarisanXR deepened my understanding of adapting tradition into interactive formats. As a non-Malaysian, I felt responsible to approach the subject with cultural sensitivity, aiming to honour it while engaging modern audiences. It also inspired me to consider using AR for cultural revival in my own country. From a collaborative side, moments of full participation produced our strongest, most unified work. I learned that combining empathy, cultural research, and user-focused thinking with consistent teamwork leads to meaningful outcomes.

Minor Project / Compilation - Warisan XR