3/3
This blog will be mainly showcasing the technical journey throughout the semester break.
Information deliverance
The previous idea was to execute the information using vanilla HTML + CSS, however due to some restrictions and the excessive workload, I decided to go with the 2D interface provided by Playcanvas itself.
Through the 2D interface, I used the Scrollview to deliver the content information and I was able to access the scroll value which I wasn't able to achieve when executing using HTML + CSS. I was also able to make the camera move as plan as the users scroll through the information by utilizing the scroll values.
With the help of Tween.js, I was able to deliver the camera movement smoothly and easily. I also used Tween.js on the photographs for the slide-in and fade-in animation.
Animation on images
While executing the photographs animation, I faced some technical issues which was quickly overcame after a short meet up with one of my advisor.
Completed the necessary button assets ↓
Homepage arrangement DONE ↓
3D technicalities
I manage to finish the 3D scene for Sarawak and I am slowly working on fixing the lightings in Playcanvas itself.
However, there are an issue that I am facing as I am trying to export animated 3D objects from Blender and import it into Playcanvas. But my current progress is not really working, I might need to spend more time figuring it out.
Information layout technicalities
I've already executed the information content for all 3 states with them fully animated and with the full and final arrangement of the layout.
Right now, I'm left with the execution of the scroll bar/indicator and the Airbnb accommodation information for each location presented.
Remaining assets to execute:
- functionality of the Landing page
- Navigation page
- Gamification system
- 3D scene for Penang
- Animation for 3D (export from Blender and import into Playcanvas)
- Info page
The coming weeks will be focusing on executing these few items to achieve the full functionality of the microsite.
3/3
Comments