Experiential Design - Task 1: Trending Experience
22/4/2025 - 29/5/2024 / Week 1 - Week 4
Cindy Clarissa Leslie / 0367677
Experiential Design / Bachelor of Design (Hons) in Creative Media
Task 1: Trending Experience
Experiential Design / Bachelor of Design (Hons) in Creative Media
Task 1: Trending Experience
LECTURES
Week 1: Lecture 1
Figure 1.1 AR playlist of past works by seniors
During the first week, the lecturer mostly took time in class for introduction and providing us a playlist for giving us an idea on how getting into the module would look like. Each videos had a unique theme and concepts that have been tackled, whether it was educational, enterntainment, etc, each of the projects have utilized AR design for a certain function. This week overall, provided me ideas and inspired me to start brainstorming on what I should create for my project.
Week 2: Lecture 2
User Mapping
Empathy Map
Tool used to articulate what we know about a particular type of user to:
- create a shared understanding
- aid in decision making
- Consider: what the user would say, think, do and feel
Journey Map
Mapping a journey or experience (task flow). It is important to note down the potential pain points and gain points in the eyes of the user. With these points create a potential solution.
For week 2, we had an in-class group exercise where we had to create a user journey map of a physical location while also utilising AR based solutions for problems.
Figure 2.1 Miro board for week 2 exercise
Me and my group decided to tackle on a theme park, which was Sunway Lagoon specifically since we were all familiarized by it. Throughout the journey, we were required to come up with a possible user flow, while each listing down its: gain points, pain points, AR based solutions throughout the process. While completing the project, the problems that usually uprises are navigation and overcrowding, therefore these are the main AR based solutions that we have came up with:
AR map with arrow guidance:
- Shows exact location of where visitor currently is in an app where it has the replica of Sunway Lagoon's layout, with real time updates whenever they move to places.
- Have a system where visitors can follow a planned itinerary so that they can explore the place as efficiently as possible.
- Show a live population count in specific areas of the place to avoid crowds.
- Have a scan system on an area so visitors are aware that they have completed all the entertainments.
Timer system:
- For lockers, create a timer system so that no visitors joy ride or keep their lockers to themselves for unnecessarily too long.
- Visitors each have a timer to which how long they stay in a certain area to prevent overcrowding and ensure that every visitor spends the same time fairly.
Week 3: Lecture 3
AR Design Workshop
AR/MR/VR
AR - augmented reality, combines real+virtual objects (enhanced physical world)
MR - mixed reality, enhance within the physicals of the physical world, interact and manipulate virtual objects
VR - virtual reality, computer generated world with a sense of presence
During week 3, we had another group exercise, to which again, we had to propose an AR based solution for a specific situation. Our group discussed and eventually came up with utilising AR in the medical field: Hospital Consultation
Figure 3.1 Figma jam for week 3 exercise
Instead of focusing on navigation, we were focused on the consultation process with a doctor itself. Our problem statement was mostly from lack of efficient communication between doctors and patients. therefore our proposed solution was:
Interactive AR Visualization:
- Visualize problem areas, with functions to zoom in, view in detail with additional information.
- Be able to show the surgery process, furthermore recovery or using medical devices.
- Does not require jargon for patients to understand.
After the group exercise, we had an individual tutorial where the lecturer taught us how to use vuforia in Unity for image scanning.
Figure 3.2 Using vuforia license
First, we were instructed to create a license, this is so that we can insert it into unity using the plugin based on the license key simply by copy and pasting.
Figure 3.3 Generating database in vuforia
Moving onto target manager, we press generate database and select cloud in order to use the license key we have just created. With the database generated, we can create a target by uploading an image file. After the image is successfully uploaded, the site shows a rating of augmentability, with 5 being the most augmentable. The lecturer suggested that 3 stars is still okay, but 4 or 5 stars are more preferrable for easy image scanning.
Figure 3.4 Adding image target in Unity
After downloading and inserting the vuforia plugin into Unity, right click on the hierarchy bar to add ImageTarget from vuforia. Within the inspector, add in the license key that has been created in order to officially add in the image used for scanning into the engine.
Figure 3.5 Adding a 3d object from image scanning
Right click on the hierarchy bar to create a 3d object and place it directly under image scanning. Next, I resized and positioned it however I want before running it through a playtest to make sure that it works.
Figure 3.6 Successful image scanning
To conclude the exercise, I pointed the image from my phone to the laptop camera and have proven that the image scanning works.
Week 4: Lecture 4
For this weeks exercise, we continued where we left off in Unity last week, where this time we added in a functional UI that is interactive.
Figure 4.1 Deciding on the aspect ratio
Since during class, I haven't had the extra android installments in my engine I had to make the aspect ratio myself to replicate a mobile phone screen. This is important as it decides on the screen size it shows up on the phone once exported.
Figure 4.2 Created UI in Unity
Right click on the hierarchy bar to make a canvas, double click the canvas and set as 2d viewing to make it easy to design. Right click again, this time create UI > Button - TextMeshPro and insert it under canvas, create 2 buttons that says stop and play.
Figure 4.3 Adding in an animation for the cube
Back to dealing with the 3d cube, this time, add an animation panel from the window. Add keyframes in order to animate it by changing its position similar to After Effects, copy paste the beginning at the end to create an animating loop.
Figure 4.4 Making the buttons interactable
In order to make the button directly interactable with the cube, drag it down from the hierarchy bar onto the space found in the interactable section. We chose a script for animation, which was animator.enabled, for he button that plays the animation ensure that the box is ticked meanwhile leave the stop button unticked.
Figure 4.5 Different interactions and scripts
This works the same way when you want to make buttons that show up and disappear on command, simply change it from animator.enabled to GameObject > SetActive (bool).
INSTRUCTIONS
Task 1: Trending Experience
Initial Research
Figure 5.1 First research
To understand further about AR before creating a project based on the concept, I first had to learn and gain more knowledge about the term. For the first research, I learned from a video form on YouTube and jot down notes while ensuring I have a strong foundation of understanding already.
Here's what I have learned from watching the video:
Augmented Reality (AR) is the real-time integration of digital content into a user's real-world environment.
There are 2 types of Augmented Reality:
Marker-Based AR
- requires a marker/trigger to start the experience
- Needs user interaction for activation
- Usually flexible and cost-effective
- Ex. scanning a QR code to launch an experience
Markerless AR
- Relies on aspects such as GPS, sensors, computer vision
- does not require a marker
- Maps out a user's environment in real-time
Possible use cases of AR:
- enhanced product visualization for easier information communciation
- Improved location navigation
- creates a smooth user experience across all platforms such as: websites, mobile apps
- Additional industries that may benefit from AR: Healthcare, Manufacturing, Education, Gaming
Figure 5.2 Article about utilising AR in the education field
Here's what I've learned from reading it:
AR helps transform learning experiences
- AR overlays digital content onto the real world, allowing students to interact with 3D models and simulations. This enhances understanding and retention by providing experiential learning opportunities. For instance, apps like "Dinosaur 4D+" and "Element 4D" enable students to explore complex subjects like paleontology and chemistry through interactive visuals.
Enhances professional training:
- Beyond classrooms, AR is utilized in professional fields such as aerospace, military, and hospitality for training purposes. NASA's "Sidekick" project uses AR to assist astronauts with real-time instructions, reducing the need for extensive physical resources and minimizing risks during training.
Boosts e-learning engagement:
- In the realm of eLearning, AR addresses challenges like student engagement, especially in remote learning scenarios. AR-enabled applications offer interactive content, making learning more engaging and accessible, thereby improving knowledge retention.
Benefits of AR education:
Accelerated Learning: AR implements aspects such as visual and auditory which means that it can cater towards different learning styles, creating easier understanding.
Accessibility: AR can replace traditional learning materials, offering cost-effective and easily accessible resources.
-
Practical Application: students are able to practice their skills in a virtual environment without having to getting into real world risks.
Increased Engagement: Gamified AR experiences make learning enjoyable, encouraging a positive attitude towards education.
Ideas & Brainstorming
Ideas:
- AR Star map
- A Look Into History (Fossil exhibition, extinct animals)
- Solar system model (functions such as AR planet view)
- Aquarium
- Coral reef exploration
- Journey to enlightenment Buddhism simulation
Final Task 1: Trending Experience
1st proposal: A Look Into History
Problem statement:
Fossil exhibitions are often information-packed, with little to no interactivity that becomes disengaging to visitors.
Despite the growing interest into natural history especially through museums, traditional fossil exhibitions are often static, text-heavy and difficult for younger or less abled people to fully engage in. This may limit the visitor's ability to connect emotionally, reducing their learning potential and visitor retention.
Proposed solution:
"A Look Into History" is an AR exhibition app that transforms fossil prints or displays into living, interactive constructions of extinct animals. By scanning a printed fossil (ex: mammoth tooth, trilobite, ammonites), users are able to see a 3d version of these animals, additionally with environmental cues, movement and educational overlays.
Aims:
- Increase engagement
- Aid education
- Expand accessibiltity
Mockups:
Figure 6.1 Rough sketch of first proposal
.png)
Figure 6.2 Digital mockup for first proposal
2nd proposal: Coral Care AR
Problem statement:
Coral reefs are rapidly depleting due to climate change and human activities, however there's limited awareness especially from younger audiences who may not fully grasp the urgency.
Aquariums often showcase coral reef systems for display, however the message of restoration is often missing or ineffectively displayed in static text panels. These executions fail to create a sense of connection or involvement, which is especially important especially in terms of building awareness. Without a more immersive execution, educational efforts around coral reef are often overlooked or easily forgotten.
Proposed Solution:
By creating an AR experience, Coral Care AR is an interactive way to raise awareness simply by scanning a designated marker where users can trigger an animated coral reef ecosystem that dynamically changes according to their choices.
The AR experience will first start with a damaged, bleached reef scene, where users first interact by removing pollutants, then they are given choices (buttons) which could either help with the restoration or even damage it further. Each interaction is accompanied by educational pop-ups explaining real coral restoration techniques. Lastly, the scene will show a healthy coral reef full of marine species, where users can tap on the species and learn further about them and why there are crucial for its restoration.
Aims:
- Raise awareness of coral reef bleaching
- Educate users through interactive learning
- Promote empathy
Mockups:
Figure 6.3 Rough sketch for 2nd proposal
Figure 6.4 Digital sketch for 2nd proposal
3rd proposal: AR Star Map
Problem statement:
The study of the stars and constellation may be challenging especially for new learners, with traditional starmaps or planetariums feeling overly technical. Additionally, real hands-on study on astronomy from night skies have been limited due to urban light pollution, with many learners missing an opportunity to experience learning astronomy in an engaging way.
Proposed solution:
To make learning easier, we are able to use AR as a simulation of the night sky through the screen of a mobile phone. Users can simply turn their phone towards any direction towards a sky in order to locate a specific star/constellation that they desire, additionally when users tap on a star, information (ex. scientific information and greek mythology option) will be displayed for an engaging way of learning. At the end of the experience, users may take a quiz to test on the knowledge that they have gained through the app.
Aims:
- Create a hands on, engaging learning experience of the night sky
- Convey information effectively for new learners
- Promote the study of astronomy
Mockups:
Figure 6.5 Digital mockup of 3rd proposal
FEEDBACK
Coral Care AR:
If doing photocard for image scanning, design more than one card, a simple drawing is already enough. When doing the additional information for the fishes, make sure that it is relevant to benefitting coral reefs to make sure it is relevant. The pollution disposal in the beginning of the scene may be unnecessary as it becomes uninteresting for users to stay in one scene for too long. Find a way to gamify and make the app more interesting, come up with a different scene other than the coral reef 3d model.
REFLECTION
Week 1
In this week, the class was mostly focused on introducing the students to the module right before properly getting into it. The lecturer was showing us previous works to help us generate ideas and inspiration of what concept we want to tackle. Overall, the experience made me rather excited with all the possibilities and ideas I can do which may align with my interests, which hopefully would make the learning experience more interesting. Since it would be my first time using Unity and using the AR concept, I rather felt like I was taking a step closer towards being a better UI/UX designer.
Week 2
In week 2, the exercise consistent of working in a group, where we basically had to come up with AR solutions for a user journey in a location. While doing the work, not only did I improve my collaborative skills, I've also learned how much AR could help in terms of improving user experiences. AR isn't limited to just playing games or have something cool through the screen of mobile phones, but could potentially tackle problems such as overcrowding or navigation. Getting further into AR, at this point I've started to brainstorm and think of ideas that I wanna do. I was quiet satisfied with my group work, although there are still ways to improve especially in the utilisation of AR, I especially felt like I learned a lot from listening to other groups' presentations.
Week 3
We had another group work for this week, instead of creating a user journey however we had to implement AR solutions into real life situations. Again, working with AR to solve problems really had my brain racking. This week was also the week where we started learning Unity hands on, we started simple as an introduction to using the engine and also vuforia. The tutorial was overall easy to follow and I had an enjoyable first experience. I observed how
Comments
Post a Comment