Task 3: Thematic Interactive Website [Advance Interactive Design]
Task 3: Thematic Interactive Website
26.12.2024 - 29.12.2024 /Week 9- Week- 14
Rafa Maritza Hertrian [0364958]
Bachelor of Design (Honours) Creative Media/ Taylor's University
DST 60804/ ADVANCED INTERACTIVE DESIGN
INSTRUCTIONS
Bachelor of Design (Honours) Creative Media/ Taylor's University
DST 60804/ ADVANCED INTERACTIVE DESIGN
PROCESS
Organizing Files
To start making the thematic website on adobe animate, I organized the images that will be used in the website so it is easier to apply. 
Loading Page
Next, I illustrated the lasagna for the loading page in Adobe Illustrator because the one from the prototype looked bland. I chose to have a lasagna-eaten animation for the loading page because Garfield is famously known for having lasagna as his favorite meal. Hence, I made it more detailed. I tried to figure out how to animate it by creating different frames of lasagna slowly getting eaten. Initially, I used the Pathfinder minus tool but it ruined the strokes.
Therefore, I decided to just make the bite pattern the same color as the background to make an illusion that the lasagna is bitten.
Starting Page Then I start putting other elements similar to the prototype. For the 'Start' page I made a minor change by not applying the outer box because I felt like it was unnecessary and distracting. I also added the cartoon sparkle effect to add more consistency since I use that effect on other pages.
Starting Page
Then I start putting other elements similar to the prototype. For the 'Start' page I made a minor change by not applying the outer box because I felt like it was unnecessary and distracting. I also added the cartoon sparkle effect to add more consistency since I use that effect on other pages.
When creating this page, I realized that a dropdown menu might be impractical to use and more difficult to make. So, I decided to make a menu bar on top of the header. This way, the viewers can immediately press to the page they want to go to.
When creating this page, I realized that a dropdown menu might be impractical to use and more difficult to make. So, I decided to make a menu bar on top of the header. This way, the viewers can immediately press to the page they want to go to.
For this page, I changed the text style of the characters' names because I didn't find the tool for making a text with outlines in Adobe Animate.
For this page, I changed the text style of the characters' names because I didn't find the tool for making a text with outlines in Adobe Animate.
New Movie Page
New Movie Page
Evolution PageI made the layout of this page more simple compared to the prototype because I didn't want the viewers to get distracted by the overwhelming design.
Evolution Page
I made the layout of this page more simple compared to the prototype because I didn't want the viewers to get distracted by the overwhelming design.
Evolution DetailI changed the background of this page so that it contrasts with the page before and the images for these pages. This would make it clear that the page has changed.
Evolution Detail
I changed the background of this page so that it contrasts with the page before and the images for these pages. This would make it clear that the page has changed.
Animating
Putting Action on buttons and pages. 
Comments
Post a Comment