Following are links to websites that demonstrate some of the features and functionality that could be successfully used in the Smart Centre website. The principal would be to design for mobile first, so some of the suggestions are most applicable to phones and tablets.
EXPERIENTIAL SITES
These sites are examples of cutting-edge design that creates a fully immersive user journey and an ‘interactive brand experience’:
Common features are:
- Good quality HD video
- First person perspective – immersive experience
- 3D scrolling – user interactivity
- Hotspots to provide additional information
- Tells a story, and lets the visitor pick the bits they want to interact with
- Visitor able to transact (on main website) without being forced to to go through the experience
PROS: greater engagement from user; virtual hands-on experience; cutting-edge
CONS: can be slow to load; needs latest platforms/browsers to work; more prone to failure to load/run; requires a lot of dev time and creation of high-quality content; takes a long time to navigate through whole ‘story’
PLUS: Quirky way to keep your brand alive across other websites: https://apps.warnerbros.com/gravity/zerogravity/
EVEN QUIRKIER:
- Voice controlled website with no visuals at all: www.croaciaaudio.com
- You have to draw on the screen to reveal the navigation: www.offpixel.co
DUAL SCREEN
Taking the immersive experience to the next level by giving the user a (semblance) of contr
ol over what’s happening on the website by using their mobile device.
(Needs to run on Chrome)
PROS: involving the user creates brand advocates; potential to provide valuable two-way communication between website and handheld devices
CONS: bit of a gimmick with few benefit as yet; some examples only run on Chrome
3D EXPERIENCE
Positive parallax to give a 3D experience without need for 3D glasses, make the user feel as if they’re on the set of Star Trek by navigating the site/app by voice control and allowing the product catalogue to come alive as an interactive eBook.
- Positive parallax on Amazon phone: https://vine.co/v/MTajt09U6Ub
- Voice activation: www.talater.com/annyang
- Interactive eBook example: www.hyperfinepress.com
PROS: futuristic experience for users; taps into existing functionality on platforms/software
CONS: mostly applicable to mobile devices only; time required to produce content; voice activation doesn’t work on all browsers
PRODUCT DETAIL
Use Augmented Reality (AR) to enable visitor to get closer to the products. Can see information overlaid on the image, can show how product can fit into spaces physically and can bring to life technical drawings.
• Technical support information: http://youtu.be/m2Dho7o0VoY
• How products can fit into a space: http://youtu.be/vDNzTasuYEw
• See a product in 3D incl. tech drawing: http://youtu.be/w_Emga97WaI
PROS: could be used for training and technical fault-find and fix; allow user to focus on part of product most interested in; brings it to ‘life’
CONS: limited application (technology still developing); some of this requires printed material; has already been done by: Brother (http://youtu.be/dGnupnBRRSo) and HP (http://youtu.be/pbDeNUIIGVg)
FUTURE:
May soon be able to use glasses for true heads-up display tech support (http://youtu.be/-0HqpxTUBGY ) and development underway to allow interacting with any surface (http://youtu.be/t1HmYNqp8NM)
OTHER FEATURES
These ideas are commonly used on the Internet but should not be overlooked in developing the website:
- Product 360 views (www.thehouseofeyewear.com)
- Product personalization (www.jaguar.co.uk)
- Walkthrough with hotspots (www.eyerevolution.co.uk)
(Page Last Updated 23/07/14)