Labels

Experiential Design / Task 4: Completed Experience

2025.07.06 - 2025.08.01 Week 12 - Week 14

Teh Ming En/0364908

Experiential Design-Bachelor of Design (Honours) in Creative Media--Taylors University

 Task 4: Completed Experience

Instructions


 Task 4: Completed Experience

Instructions

We need to synthesise the knowledge gained in tasks 1, 2, and 3 for application in task 4. We are required to create and integrate visual assets and refine the prototype into a complete working and functional product experience.

Requirements
  • Project file and Folders
  • Application installation files (APK for Android, iOS Build Folder for IOS/iPhones)
  • Online posts in your E-portfolio as your reflective studies
  • Video walkthrough (Presentation)
To-do:
  • Change the image target to the building picture
  • Apply the route to transparent
  • Refine the turn point mentioned panel
  • Create a setting panel (sound button, duckling collect button, and arrived button)
  • Collectible 3D duckling model
  • Profile page

Progress

Image Target Rearrangement

In the previous task, we used a QR code image as the image target. To create a more realistic experience, we decided to replace it with a real building image. We took a photo of the E7.14 classroom and set it as the new image target. Now, when users scan the building and this image is detected, an information panel will appear.

Fig 1.1 Changing Image Target

Route Refinement

We applied a transparent gradient material to the route to enhance its visual appearance, making it more closely resemble the design from the previous task in Figma. Additionally, we adjusted the thickness of the route arrow to be slimmer, ensuring it appears more subtle and appropriate during the AR experience when users start the app.

Fig 1.2 Route Path Refinement


Fig 1.3 Route Arrow Refinement


Turn Point Mention Panel Refinement

In the previous task, we created the direction panel using a 3D object. However, after receiving feedback from Mr. Razif, he suggested that we improve the visual design of the panel. We showed him our Figma prototype, and he encouraged us to refine the panel to more closely match the prototype’s style.

I was in charge of this part. First, I implemented a script that triggers the panel to appear as the user approaches a turning point. The panel displays dynamic distance updates such as '5m turn left,' '4m turn left,' '3m turn left,' and so on.

Fig 1.4 Turning Point Mention Panel Refinement

Setting Panel Design

Since we added background music to enhance the AR route experience, we decided to include a panel that allows users to turn the music on or off.

Chin Ting was responsible for this section. She first designed the panel and button layout using Adobe Illustrator, then imported the assets into Unity. After that, she created two visual states for the button: when the background music is turned on, the button is filled with a dark green colour; when it's turned off, the button displays only a dark green outline with a white fill. This provides users with a clear visual indicator of the current audio status.

Fig 1.5 On-Off Sound Button

Fig 1.6 Button & Panel Design

We also added an 'Arrived' button that users can click once they reach their destination. After clicking the button, a completion panel will appear, giving users the option to either save the current destination or simply close the scene.


Fig 1.7 Arrived Panel Design

Duckling 3D Model

We added a new playful feature to enhance the user’s AR experience. Specifically, we introduced a collectible duckling function. We sourced a 3D duckling model online and placed it along the AR route. As users approach the model, they can collect it, and the system will track how many ducklings they’ve collected.

After placing the duckling model, we applied a box collider to enable interaction, allowing users to tap and collect it. We also wrote a script and integrated game data to record the total number of ducklings collected by each user.


Fig 1.8 Applying the 3D Duckling Model

Fig 1.9 Applying the Collecting Duckling Game Data

Returning to the settings panel, we added a dedicated toggle button that allows users to enable or disable the duckling collection mode. This gives users greater control over their AR experience, whether they want to focus purely on navigation or engage with the more playful, gamified element of collecting ducklings along the route. When the mode is turned off, the collectible ducklings and related UI elements will be hidden to minimise distractions.

Fig 1.10 On-Off Collectible Duckling Mode Button

Profile Page

We designed the Profile Page to allow users to track the number of ducklings they’ve collected throughout their AR experience. In addition to the collection count, the page also displays achievement badges that are unlocked based on the number of ducklings collected. This feature not only helps users monitor their progress but also adds a sense of accomplishment and motivation through a simple reward system.

Fig 1.11 Profile Page Design

Submission

Task 4 Presentation Video

Task 4 Walk Through Video


Feedback

Week 14:

Mr. Razif mentioned that our overall functionality and app workflow were well-executed. However, he advised us to place greater emphasis on enhancing the visual design and user experience, particularly during the app’s runtime in Unity. He encouraged us to refine the interface elements, improve visual consistency, and ensure that the aesthetics align with the intended user experience to make the app feel more polished and immersive.


Reflection

Through Task 4,  I learned a lot not just technical skills, but also how to refine ideas and work together to complete the work. At first, I wasn’t very confident about working with Unity and combining everything from previous tasks since we were all new to Unity. But after starting to refine each part, I could clearly see how much I’ve improved. 

I was mainly in charge of the turn point mention panel, and this part gave me both stress and satisfaction. Writing the script that shows took time and a lot of trial and error. I had to test and adjust the distance triggers constantly, it is a hard process. But it gave me another feeling which was solving a real-world problem and turning it into something useful and engaging. There were moments where I felt stuck or unsure, but finishing this project gave me confidence in both my design thinking and problem-solving skills. 



Labels:

Comments

Post a Comment