You Are Reading

Brief 11: YCN Topdeck - Website Animation Prep

Running Order
I planned the running order of the animation so I knew what I needed to do when I got onto After Effects, and could plan what elements I needed to save separately.





  • Logo fades in
  • 'The App' appears in Rockwell
  • Home page (hero area) appears
  • Click gesture on Find a Trip
  • Filter slides down
  • Cursor moves to search form
  • Types in Florida
  • Map changes to focus on on Florida
  • Cursor moves to Miami and clicks on it, changes colour
  • Cursor moves and clicks on Cocoa Beach and changes colour (line connects the two)
  • Cursor moves and clicks on Savannah, changes colour (line connects these)
  • Cursor moves to budget
  • Drags budget down to £3000 - text changes, lines changes white
  • Cursor moves to June and clicks on it, changes grey
  • Cursor moves to July and clicks on it, changes grey
  • Cursor moves and clicks on Search button, changes grey
  • Search results scroll up
  • Scroll down the page
  • Cursor moves and clicks on Check it Out button, changes grey
  • Trip result page appears
  • Scroll down
  • Slogan appears
  • Logo appears 
  • End

Animation Prep
I needed to save different elements separately for the animation so certain areas can be animated, and I did this before I went to After Effects to make the process smoother.











Comments for this entry

Leave your comment

 

Copyright 2010. All rights reserved.

RSS Feed. This blog is proudly powered by Blogger and uses Modern Clix, a theme by Rodrigo Galindez. Modern Clix blogger template by Introblogger.