Experiential Design - Task 3/Project Prototype

9/6/2024 - 9/7/2024 / Week 6 - Week 11
Janice Marie Eng Chia Hui  / 0361521
Experiential Design / Bachelor of Design in Creative Media / Taylor's University 
Task 3: Project Prototype

Table of Contents:


Task

To-do list:
  • Make your AR app prototype 

Assets

My app involves me having AR projection of sewing patterns, so I went into Illustrator to trace out the pattern from this free sewing pattern site I found online. Additionally, I also needed a thumbnail for my prototype. The thumbnail needed to show how the outfit would look like, so I went to the website and edited their picture to fit the theme of my app.

Figure 1.1 Making the assets for the pattern in Figma and Illustrator (29/6/24)

Figure 1.2 Thumbnail image (original on the right)(29/6/24)

As my AR projection was to be traced, I opted to use an image target to prevent the projection from glitching and moving around too much. I then needed to make an image target. I initially did circles, but later found out that circles are not viable image targets. I decided to settle for some leaves as the image target first for the prototype due to time constraints. I will be making a new image target for the finished product.

Figure 1.3 Image target (initial on the left, settled on the right for a prototype for now)(29/6/24)

Prototype in Unity

1. Information Page
Nothing particularly hard here. Just needed to make the asset for the thumbnail and size chart because I did not know how to insert a table in Unity. I placed the table in a slider too because the table was too long.

Figure 2.1 Information page in Unity(30/6/24)

Figure 2.2 Making the table in Canva(30/6/24)

2. AR Pattern page
For this part, I wanted to include 3 functions:
  • The ability to change the transparency of the AR projection to allow users to trace better
  • To allow users to change the colour of the AR projection in case it is placed on a dark or bright background
  • The ability to move the AR projection from left to right and vice versa to allow users to place the pattern onto top of their fabrics
For both the transparency and the colour feature, I realised I could make use of the animation and set active function. 

For the movement function, I just Google how to make objects move in Unity and was led to the video below.

Figure 2.3 How to make gameobject move with arrow keys (30/6/24)

Additionally, I also wanted to reset the AR projection to its initial position. I did not know what to search for till my friend told me what it's called. They also advice me to just use AI to get the code on how to do it. I tried that but as I have no background in coding and unity, I had a hard time understanding the instructions and what to do. I had to get further clarification from lect before finally managing to do it. 

However, I realised that there was another problem with the reset position code. So I properly explained what I wanted to ChatGPT and finally managed to reset the projection to its initial position.

Figure 2.4 Having a conversation with my good friend chat GPT (1/7/24)

Figure 2.5 Outcome of AI + colour and transparency (1/7/24)

3. AR Tutorial
This part was generally quite simple. I just had to animate the 2d assets. As well as find a 3d asset for the final step. I had a problem where the animation would not show up when I viewed the image target at a certain angle. Not sure how to fix that yet but will look into it.

Additionally, since this was a step-by-step tutorial, I asked chatGPT again how to switch to a different AR screen with the click of a button. ChatGPT coming in to save the day again.

Figure 2.6 ChatGPT the best (1/7/24)

Build and run

1st attempt
After building the app on my phone, I found out that the AR projection was not similar in size to the actual pattern. I tried to go back to Unity and figure out what was wrong. I was told by lect that one square in Unity is 1m. And I checked it again and again but the size was still different. So at my wit's end, I asked lect what happened and how to resolve it. He told me he didn't know why and asked me to keep on shifting it till it was the right size.

After that, my friend told me about asking AI for help. So I asked ChatGPT for help. Haven't made the changes yet tho, cause right now I am currently rushing this deadline lmao.

2nd attempt
So far so good, trying to implement the reset button.

3rd attempt
All good now just need the AR tutorial

4th attempt
On my fourth attempt, I had an error when I was trying to run and build my app.

Figure 3.1 Error code that haunts my dreams (6/7/24)

I tried asking ChatGPT for help as well as Googling how to resolve this error. Nothing worked. I don't understand. Some people mentioned that uninstalling and reinstalling Unity helped. As I had tried all the other options and was close to crying, I decided to try it. And it worked. Why is the solution to the error a factory reset, what is this T^T.

After that, I ran the app and everything was a-ok.

What is done: The AR elements and all their features, view video for more information.

Yet to be done: Need to update the image target, work on the size of my AR projection, Try to fix the glitching animation, Improve the interface design, and Add in a short onboarding process.

Final Work

Figure 3.2 Video presentation (8/7/24)

Feedback

Week 11
General Feedback: Use Ai to get the code


Reflection

This project was an experience. It involves a lot of me doing random stuff to try to get things to work and praying for the best. My experience with Unity is uh, I don't know.  If I use it longer I'll probably get used to it but right now I am completely new to it so it's a lot of trial and error on my end to understand how to work it. However, I do like how Unity helps in creating apps so you don't have to code everything out. On the other hand, I really hate that Unity changes my laptop into a helicopter with how hot it makes my laptop.

Moving on, I am glad that I chose to do something simple for my AR app because I don't think I or my laptop can handle anything more complex than what I did for my prototype. Additionally, I think that my app interface design really needs more work. I am a design student, I can't have my app interface design be looking like crap lol.

To end it off, learning to use Unity was both a fun and terrible experience, especially when things don't turn out the way it is supposed to. I also like to think that having the basic knowledge of how to use Unity is important to anyone so there that. 


Comments