-2.png)
Experiential Design - Task 3 : Creative Experience Design Project Prototype
INSTRUCTION
Once the proposal is approved, students will required to work on the prototype of proposed project. The prototype will enable the students to discover certain limitations that they might have not learnt about before and they’ll have to creatively think on how to overcome the limitation to materialize their proposed ideas. The objective of this task is for the students to test out the key functionality of their project. The output may not necessarily be a finished visually designed project. Students will be gauge on their prototype functionality and their ability to creatively think on alternatives to achieve the desired outcome.
EXPLORATION
After I had finalised the project proposal on Task 2: Experience Design Project Proposal, I started my first step before jumping into the exploration in unity by create the marker card. As proposed iconology, I had further explored on the varieties towards the backgrounds and position.
Fig 1.1 Screenshot, Development on creating Marker Card (week 8/ 23.05.2023)
In order to having a better visualisation towards the marker card, I did a mockup on the most appreciated design to check whether which is the most approachable.
Fig 1.2 Mockup (week 8/ 23.05.2023)
Fig 1.3 Outcome _ Marker Card (week 8/ 23.05.2023)
[OS: the reason of printing out is due to my personal satisfaction to treasure all of them as well as in order to achieve my own UX :D goshhh,, love it!]
After having the cards, I just noticed that I should check on the graphic stars in Vuforia Engine before I proceed to printing, so I reversed my steps and checked all the images again in Vuforia Engine. WOAH! Probably most of the images that I printed did not have even one star. OK, it's time to get back and reconstruct the illustration. And it was really "out of my expectation," as the image check had taken me 4 hours to recheck and refine the images. But, finally, I got a mostly 4-star rating, with only the Earth having a 3-star rating.
Fig 1.4 Image Rating Check _ Vuforia Engine (week 10/ 10.06.2023)
Fig 1.5 Final _ Marker Card (week 10/ 10.06.2023)
It can be stated that I was having a very terrible snow balling effect due to the technical and skill issue that occurred within this module. As the time limitations, I found for other sources and start figuring on my own-self in order to create the prototype outcome. By first, as the tutorial video given by Mr. Razif, I create a new project > core > 3D and start launch Vuforia engine in Unity :
Fig 1.6 New Project in Unity (week 11/ 20.06.2023)
Then, drag Vuforia file packages into Unity Hub, so this time means that when I right click, I should having the "Vuforia Engine" options.
Fig 1.7 Import Vuforia Engine (week 11/ 22.06.2023)
Then, add AR Camera by Right click > Vuforia Engine > AR Camera.
Fig 1.8 Active AR Camera (week 11/ 22.06.2023)
Continued, I proceed to add the License Key to my project document. Open Vuforia Engine Configuration > Open License > Insert License. And, continue to add the image target to the Unity Hub.
Fig 1.9 Import Database (week 11/ 22.06.2023)
In order to having the planet to pop out when scanning the marker card, for the prototype, I tend to use the "Sphere" instead of the 3D planet as the object. [Right click> 3D object> Sphere] and parent the sphere under the Image Target. As I having a total of 8 planets to navigate, I duplicated the card x8.
Fig 1.9 Duplicate 8 cards (week 11/ 23.06.2023)
After checking all the marker card works with the "sphere", then I proceed to insert all the 3D textures. I downloaded the textures from Planet Texture Map and import into Unity.
Fig 1.10 Planets Textures (week 12/ 29.06.2023)
As I had no idea on how to insert the textures into the sphere, I find some sources online and concluded the solution :
Fig 1.11 How to insert Textures in 3D object (week 12/ 29.06.2023)
#Solution:
1. Right Click > Create > Material
2. Drag the texture image into the "Map" Albedo
3. Under the 3D object inspector, add the "Map" to the materials
Fig 1.12 3D Object with Textures (week 12/ 29.06.2023)
As think of if I can do the animation direct in Unity, why I need to do in blender? Initially, I was planned to make the rotation speed in "real" of each planets, but I think it's was too boring. So, I make all the animation clip done within 2 min by the sequences. So, it means that mercury will be the one rotate the fastest, whereas Neptune will be the one slowest.
Fig 1.13 Animation Clips Timeline (week 12/ 29.06.2023)
As my idea is to create an application that having onboarding page. There are no button indication to navigate to the next page, it was to pause the canvas in 2-3 seconds and direct navigate to the next page. Initially, I wish to create the 3 canvas under one scenes with the help of Ai generator, but failed. Then, I tried the alternative methods that using different scene to connect the "canvas" and using a C# script to make the page pause in 2 seconds and direct navigate to the next page, but the last page was to tap and navigate to the main scene.
Fig 1.14 Screenshot, Development (week 12/ 30.06.2023)
Fig 1.15 C# Script to "Stop 2 S and navigate" (week 12/ 30.06.2023)
During this stage, I was "stuck" at the font. As I had proposed the Jura font as the main font for the CelestAR application, so I found sources online and finally found the solution on "how to import font into Unity" :
Fig 1.17 How to insert Font into Unity (week 12/ 30.06.2023)
For the inner part of the navigation screen, I did not capture much on the progress as I was in the exploration of try and error to get a satisfied outcome. For example, when I did the 3D screen, the AR camera was not functional in this situation, so I need to use an alternative method to show the planet, so I take references from YouTube video. So, basically, the things that I did was create a camera by adding a layer "UI camera", add a render texture and raw image to reflect the planet.
Fig 1.18 How to show "Planets" in 3D screen (week 12/ 30.06.2023)
And, continued to the AR screen, although it seems I may "duplicate" the 3D screen and change some "minor" stuff, but the issue was the built camera was not functional in this case. For AR screen, we need the AR camera, and with the help of Ground Plane Stage and Plane Finder. The process was "link here and there".
Fig 1.19 Outcome, AR Screen Scene (week 12/ 02.07.2023)
Before I duplicate the 1st demo try version to the other 7 planets, I try and build to my phone and check the condition [double check on the functionality] before I continued proceed to the next stage.
The issue : The tap screen was not active, the "button" was not be detected.
Fig 1.20 Before Vs. After (week 14/ 03.07.2023)
Fig 1.21 Solution: The missing "link" (week 14/ 03.07.2023)
#Solution:
Under Tap Screen Scene, navigation "on click" had missing, so re-link the script.
I had questioned Mr. Razif on this issue and received the solution.
//I did not tend to show in the video presentation due to the fact I insert in a wrong scene so I was thinking to explore it in final prototype. But now I had fixed the issue by change the "sky box" to the "solid colour"//
After done the AR scene and 3D scene, I continued my development into the final stage : Quiz Scene. I had no idea on how to create a "quiz" in Unity, so I took several days to explore and tried out based on the online sources. The most difficult part is to generate the result as all the users would having a different answer / score.
Fig 1.22 Development, Quiz Screen (week 14/ 06.07.2023)
Fig 1.23 Script, Quiz Result (week 14/ 07.07.2023)
Fig 1.24 Quiz Outcome (week 14/ 07.07.2023)
And, I'm thinking I had a basic structure for the current status excluded from some functionalities such as the text, zoom in and out features, animation, scroll bar issue, lack of the quiz review, BGM and etc. So, I planned to stop here as my prototype submission and showcase my current progress on what I had done and haven't, or plan to do.
Fig 1.25 Video Presentation, Prototype (week 14/ 12.07.2023)
As I figured that my video presentation was a bit dull / not clear (because I used zoom instead screen recording to show my face 🥴) and I planned to do a walkthrough demo version on my phone (build out from Xcode) :
Fig 1.26 Application Walkthrough,
IPH11 Promax (week 14/ 12.07.2023)
Fig 1.27 Script Compilation (week 14/ 12.07.2023)
FEEDBACK
Week 13/ 03.07.2023 @ Skybox Issue
Maybe it's your contents are big file to load so it shows the skybox first while loading, try to set the skybox to solid colour instead.
REFLECTION
Throughout my journey working on the project prototype, I found myself feeling lost and often backtracking right from the beginning of the session. Although my prototype lacks detail and completeness in terms of delivering an "AR experience", I have gone through the process of exploring the concept and functionality, which I think it's out of my "limitation". I owe much of my progress to ChatGPT, as without the help of this AI generator, I would not have been able to stay on track and complete this prototype. Being a newcomer to Unity and C#, I faced significant difficulties in understanding the fundamentals. My only option was to explore through trial and error in order to find the "right" answers. There are numerous aspects and details that I wish I could have delved into and mastered within the final prototype. However, I can confidently say that reaching 60% progress from ground zero is a significant achievement. Throughout the semester, I never expected to make this much, given my initial state of being "LOST" and "PANIC". The experience has taught me that Unity and C# functionality is not as straightforward as the relative simplicity of HTML and CSS. To gain a complete understanding of the fundamentals, there are more concepts and knowledge to explore. But for now, my main goal is to complete the full set of my CelestAR project! So, ALMOST THERE! 💪😭
Comments
Post a Comment