This is Popsnap! A site meant to mimic the feel of opening an unexpected package. This always follows the process of finding the box, opening it up, popping the bubble wrap (of course, and finally finding out what’s inside.
The site is relatively responsive, though the media queries were all handled by plug-ins. Links at the bottom will send you off to purchase an item you found!
Thanks for checking it out!
Currently working on a new aesthetic direction for my project 2. I couldn’t get the photo-realistic direction to look decent without looking tacky.
Since I’m trying to develop a site, optimized for smartphones, I’m using a lot of jquery mobile plug-ins like Menu (menu slide-out to look at your collection of items) Jquery Flip (Photo-flipper). Device.js (which detects what orientation the phone is being held in)
Here are some annotated comps for my interactive site optimized for mobile devices. Very simple, but with many new ideas I haven’t had the chance to try yet. Hope all goes well!
I was having issues with the file size so I’d prefer if it was viewed locally, which has been emailed to the group!
This would work well for showing facts of the planet. (especially over time)
I may be able to use this to navigate to different frames in the main animation.
This would work very well to allow the user to investigate elements further by mousing over or clicking. I’d love to reveal more about a specific element to include more levels of information.
Full-screen video plug-in. I may be able to use parts of this to play and stop the video at specific parts.
The 3D elements may be used to create the illusion that the text is part of the animation/video in the background.
This would work well to track the parts of the video/animation that need to be called-out.
Hopefully I can put some of these together to create something pretty neat.
Extending one of my topics to include space!
The first concept involves using the scrollwheel to progress through footage (scrub forward and back). Call-outs will appear with the option to click on them to reveal more information.
The second concept involves a rotating earth (again controlled by the scrollwheel (or arrow keys) As the Earth rotates call-outs will be revealed allowing the user to investigate closer.
The third concept is a simple scrolling website in which photography fades in and out while paragraphs of text slide in to educate the user on what is being shown onscreen.