Advanced Interactive Design / Final Project

12/11/2024 - 11/01/2026 (Week 9 - Week 15)
Nadia Chong Wen | 0355736 / Bachelor of Design (Hons) in Creative Media
Advanced Interactive Design - Final Project


Instructions


Final Project

After learning about the basics of Adobe Animate and how we could use, we started working on our website. I spent most of my time just transferring my assets from Figma into Adobe Animate and redrawing the assets of my website.


Most of the pages have an ease-in animation to help make it feel cleaner than it actually is. Sir also introduced the concept of transitioning using shape-tween and using a hot-spot for hidden buttons.



Transitions happened with turning the images into graphics to allow the Classic-Tween to take effect.



After that, I was done with most of the pages, I started coding in the buttons control. While doing this, I realized that I might not be able to fix up the loading area as it would have to constantly reload again and again. So, I decided to sacrifice that part for a more seamless loop of the website.

After that, I went onto add sound effects and a BGM for the website. I wasn't able to quite figure out how to make the music continuous, so I decided to place it in every page. Even if it reloads, it's still follows the same tune.

Final Project Assets



(If you don't see the pages, reloading the page should help.)

BGM: https://freetouse.com/music/massobeats/aromatic 
Sound Effect: https://freesound.org/people/njjjjjjjjjjjjjjjjjjjjjjjj/sounds/566176/


Reflection

While it was difficult to understand what I was doing at first, I gradually was able to learn how to code in Adobe Animate and it became super fun to work on this. It's a really big shame I couldn't do much more for it with my limited skill and the nature of my website but I really loved doing this. 

The only thing I have to complain about would be that sometimes the buttons don't work for some reason haha. Also the lack of tutorials above the basics of Adobe Animate HTML5 out there in the world.

Comments