The below images are screenshots of my process of creating the animations for this page.
I wanted to play with the code in order to make responsive buttons that would appear one by one in order to display different part of the conversation between the user and the figures. Another complicated part was that I had to make sure that the ‘click’ buttons become visible one at a time and that two buttons would not be visible at the same time as I thought that will confuse the users. I thus, had to input various ‘Click’ buttons on the circle around the figures and make sure that a button goes invisible once clicked and then another button would appear, revealing more of the story. Despite the fact that I managed to achieve that in the end and I was very happy that I got to play around with the code which allowed me to get more familiar with the capabilities of Adobe Edge, I didnt end up liking the effect that was created. I mentioned earlier that next term I would like to also allow the users to animate parts of the figures themselves by displaying ‘click me’ buttons. Separately these two effects might look interesting, but together they look too messy and confusing and I think they would disrupt the flow of the website and make the users loose their interest.
Thus, I decided to just make a simple gif animation for the conversation part of this page. This will allow me to add interactive movement of the figures next term, which will appear as ‘click me’ buttons after the gif text finishes playing.
I was overall very pleased with the result of this page and Im happy that I experimented with new features of Adobe Edge. Even though I didn’t end up using the coding that I learned, I still feel like I could apply this knowledge next term if I decide to create responsive buttons to any of the pages. I could also apply these skills that I have gained in my career in the future. If I ever need to create an animation for a company that I’m working for, I could use my existent knowledge to produce something even better.
Additionally, in the lecture with John Marchant, he highlighted that not following conventions could create an interesting effect. I thought that my website will not have a menu which in a way relates to his point of not following conventions because typically, websites have a navigation menu. Thus, by making the choice not to include a menu, I am forcing the user to follow a specific path and because the user cant go back and forth between the pages, he/she will have to stick to my navigation plan. Additionally, not including a menu was done in order to make sure that the user follows a specific journey because if the user had the option to choose which section of the quiz he could go on, then the narration would be ruined. Thus, the order of everything within the website is extremely crucial for the desired effect.