Advanced interactive design - Final Project: Thematic Interactive Web Application

Fadil puthiya madathummal peedikakandy / 0354579/ Bachelor Of Design (Hons) In Creative Media

Advanced interactive Design



mr razif taught us a little bit of how to use adobe animate cc



We did some basic and simple animations however UNFORTUNATELY my adv interactive design folder got deleted and I lost all the test animations. 

Project outline
I've always had this dream of creating a whac-a-mole game, and this project gave me the perfect opportunity to bring it to life. So, I jumped at the chance to use Adobe Animate for the task.



But here's the thing – it turned out to be much harder and more exhausting than I expected. I felt lost at times, struggling to achieve what I had in mind. However, just when I thought things couldn't get any better, something amazing happened. On that very same day, Figma released a new feature for developers. It allows you to write code, use variables, and create interactive designs with ease.


It felt like fate had intervened. Discovering Figma's developer feature was a game-changer for me. It solved all my problems. With the ability to code and work with variables and components.


However, my excitement took a bit of a dive because I quickly realized just how challenging this new developer feature was. It's complicated, and I had to start from scratch to learn how to use it. But I knew deep down that since this feature will be used a lot in the future, it's worth the effort to learn it now. So, I started searching for tutorials and guides to help me out. Unfortunately, there weren't many available since the tool had just been released, which meant I had to figure out a lot of things on my own.





I decided to take it step by step and experiment with the new developer mode. I won't lie, it was hard and confusing at times, but I was determined to make my project come to life. I knew it would be worth it in the end.

Every small attempt I made brought me a little closer to my goal, even if progress seemed slow. I reminded myself that the journey might be tough, but the satisfaction of creating something amazing and interactive kept me going.


I learned how to do the variables and components and then started setting up the timer and the animations




I placed the heads on the whack machine, ready to see my creation in action. But to my disappointment, it didn't work as expected. The heads didn't pop up correctly, and the interaction was all messed up. It was disheartening, to say the least.

However, I refused to give up. I knew there must be a way to fix it and make it work. So, I started diving into the code, editing and playing around with the variables. It was a trial-and-error process, but I was determined to figure it out.

I made small adjustments, tweaking the timing, position, and behavior of the heads. I kept testing and iterating, learning from each failed attempt. It wasn't easy, and there were moments of frustration, but I persevered.

And then, finally, it happened. After several rounds of editing and experimenting, I achieved success. The heads popped up exactly as intended, and the interaction felt smooth and satisfying. 


Final Result



Link to the prototype



Reflections

Experiences
I must say, this assignment was a real challenge. I spent countless hours trying to figure out how to animate in Adobe Animate CC, but it seemed like I was hitting one roadblock after another. It was frustrating, to say the least. However, just when I thought all hope was lost, Figma came to the rescue with their newly released developer feature.

Discovering Figma's developer feature was like a breath of fresh air. It opened up a whole new world of possibilities for me. The ability to add code and variables was both intriguing and exciting. It meant learning a new skill and approaching the project from a different perspective. So, without hesitation, I decided to give it a try.


To be honest, it wasn't smooth sailing from there. I encountered my fair share of challenges and bugs along the way. Adobe Animate continued to give me headaches, and Figma, being a relatively new feature, lacked the availability of tutorials and resources that could have eased my journey.

Nevertheless, I persisted. I tackled each problem head-on, seeking solutions and experimenting until I found what worked. It was a trial-and-error process, but I was determined to make the most of this opportunity.

In the end, things turned out pretty well. Despite the initial hardships, I managed to create something that I can be proud of. It may not have been the smoothest experience, but the lessons learned and the skills acquired were invaluable.

This project taught me the importance of adaptability and the willingness to explore new tools and techniques. It highlighted the need to persevere even when faced with obstacles. It was a reminder that the learning process can be challenging but immensely rewarding.



Observation
I still really want to learn how to use adobe animate but for some reason coding really makes me naseuous and confused. I tried my best to give it my all in developing this But ended up as a fail. But that doest mean i don't want. I still wanna learn but it just take some extra time for me. U sing figma was also pretty tiring but since i had do this in a cou-le of weeks I had to push mThroughout this project, I had a strong desire to learn how to use Adobe Animate. However, I noticed that coding, for some reason, made me feel nauseous and confused. Despite this challenge, I gave it my all in the development process. Unfortunately, my efforts resulted in failure. But that doesn't mean I've given up on learning. On the contrary, I still have the motivation to acquire the necessary skills, even if it may take me a bit longer.


On the other hand, using Figma was also a tiring experience. With the project deadline approaching, I had to push myself to keep going. It required a lot of effort and perseverance, but I understood the importance of meeting the timeline and completing the task at hand.

This observation has made me reflect on the unique learning preferences and challenges we all face. While coding may not have been my forte, it doesn't mean I won't continue my journey of learning. It simply means that I need to explore alternative methods or take additional time to grasp the concepts 


Findings
Throughout the module, I learned a lot. Even though I couldn't use Adobe Animate as I had hoped, I still gained valuable insights into how animations work and the principles behind them. It was a great learning experience.

I also discovered the importance of time management during this module. Balancing my workload and other responsibilities taught me how to prioritize tasks and make the most of my time. It was a useful skill that will benefit me in the future.

On top of that, I had the chance to dabble with Figma's prototype feature. While I didn't focus on it extensively, I got a basic understanding of creating interactive prototypes. It was quite exciting, and I'm happy with the end result of the product I developed.

Comments

Popular Posts