Project 2: Ideas, Wireframes, and Moodboards

I’ve boiled my list of possible products down to the following:

  1. Apple Magic Mouse
  2. Kershaw Knife
  3. Gibson Guitar
  4. Chrome Backpack
  5. Milwaukee Power Tools

I’m looking to save time in the design stage by using my chosen product’s current branding and photography. For this reason I have chosen products that already have product videos and high resolution images, as well as well defined type choices and color palettes. Since this is a coding class, I want to spend most of my time coding and learning about interactive features. This is something I did not do much of in the previous project because I spent most of my time gathering content and figuring out how I would present it while respecting the narrative.

Wireframes and moodboards for Apple Magic Mouse option:


I would like to include the following features in project two:
Animated SVG, parallax scrolling, snapping scrolling to page, full page video, animated gifs or video player without interface pause/play on scroll

Ideally, I would like to show an exploded diagram of sorts, some sort of product animation whether it’s rotating it or showing it’s movement (for example if it’s a knife showing it flip open and close). I want to vary my layout by showing close ups, wide shots, side views of the product, as well as showing the product in context and in glossy studio shots.


Leave a Reply

Please log in using one of these methods to post your comment: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s