Advanced Interactive Design: Task 3 (Completed Thematic Interactive Website)

  

Advanced Interactive Design: Task 3 (Completed Thematic Interactive Website)


22/10/2024 - 6/11/2024 (Week 5 - Week 8)
Afif Shukri / 0354429
Advanced Interactive Design / Bachelor of (Design) in Creative Media / DST60804
Task 3 (Completed Thematic Interactive Website)



PROCESS




Fig 1.1 - Process of website 


This assignment I started with 3 layers that is the action layer, button and background. This is easier for me to navigate and design the website. Although I have tried plenty of ways on designing this website, this seemed to be the easiest for me.


Fig 1.2 - Landing page animation


For the animation of the landing page, I did a animation using classic tween fade in transition. This creates a more minimalistic approach that fits well with theme of the website.


Fig 1.3 - Action button process


Fig 1.4 - Action button process

Throughout this project, I have stumbled upon hurdles when it comes to font. The original font that I was suppose to be using had problems in Adobe Animate. When I designed my wireframe on Adobe Illustrator and Figma. The font had no problems, but in Adobe Animate there seem to be some kind of a problem with the font, hence I went for an alternative choice.

Fig 1.5 - Alternative font



Finished timeline with all the layers.

Fig 1.6 - Finished timeline


After finishing all the designing, animation and doing all the action buttons. I published my file HTML and JS to have it published on Netlify.


Fig 1.7 - Netlify Process




INSTRUCTIONS 


Figure 1.8 - Module Information Booklet




ASSIGNMENT



Final Submission Task 3:





Screen Record:


Fig 1.9 - Screen recording of website





REFLECTION



Overall this journey was very tough and overwhelming for me. It really drained me mentally and physically. From trying to code actions, design and to publish it on web was really difficult for me. 


The help from Mr Shamsul was tremendous. He was very helpful in guiding me throughout my journey. He taught me well, in terms of navigating through this project on Adobe Animate.

Adobe Animate has always been a struggle from me as I am quite new to the software. Overtime, I managed to learn and improve myself on using this software. This assignment really pushed me to my limits. Building this website was one for the history book for me, the creativity and the handwork behind building a website is very applaudable. 

Comments

Popular posts from this blog

Creative Writing: Final Compilation

Design Research Methodology - Assignment 4: Research Report & Final Presentation