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
Janice Marie Eng Chia Hui / 0361521
Experiential Design / Bachelor of Design in Creative Media / Taylor's University
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)
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.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.
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)
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
Google Drive Link (Assets + Video Presentation):
https://drive.google.com/drive/folders/19tCldsJSxFhBW7JvgfDutRmYqezbr9Am?usp=sharing
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.
.png)
.png)
.png)

.png)
.png)


.png)
Comments
Post a Comment