Above and Beyond - UI Design Concept

Website Design Brief from A&B A&B would like to promote a professional slick image that engages customers through the use of enticing imagery, videos, articles and reviews together with well placed messages and ‘easy to find it’ navigation. We want to be perceived as the industry experts – while price will always be a factor in online purchase, we are keen to be seen to be synomymous with the delivery of high-end, quality goods from well recognised and often coveted brands. Currently the site does not lend itself well or make good use of lifestyle imagery which we feel is a mistake as lifestyle imagery has the ability to evoke an emotional response and an affinity with the observer. A key objective is to develop a tone that we adopt throughout the website. Professional but not too formal, cool without being too young, real and warm yet authoritative. Working closely with social media platforms, from our blog to Facebook and Twitter, A&B should present a consistent image across all platforms that actively encourages interaction. A&B should come across as a serious site that engenders customers trust and leaves them with no qualms about spending money with us.

Project Info
Client Above and Beyond
Skills UI Design
Project Description
Above and Beyond Brief
 
•  Specialist outdoor e-tailer
•  8 years old
•  Won Online Retailer of the Year 2013 at TGO Awards. Voted for by the readers of The Great Outdoors Magazine
•  Started out with a concentration on maps, books and guides and the progressed to compasses and GPS
•  In recent years they have massively increased their product and brand portfolio and now consider themselves a high-end, specialist retailer of outdoor navigation, camping, clothing and bushcraft and suvival equipment
•  They now wish to reflect these specilaisms in the look and feel of their website
Aims for new build
 
•  Fully Responsive
•  Increase Traffic
•  Increase Product Awareness
•  Increase Basket Spend
 
Website Design Brief from A&B
 
A&B would like to promote a professional slick image that engages customers through the use of enticing imagery, videos, articles and reviews together with well placed messages and ‘easy to find it’ navigation. We want to be perceived as the industry experts – while price will always be a factor in online purchase, we are keen to be seen to be synomymous with the delivery of high-end, quality goods from well recognised and often coveted brands.
 
Currently the site does not lend itself well or make good use of lifestyle imagery which we feel is a mistake as lifestyle imagery has the ability to evoke an emotional response and an affinity with the observer.
 
A key objective is to develop a tone that we adopt throughout the website. Professional but not too formal, cool without being too young, real and warm yet authoritative.
 
Working closely with social media platforms, from our blog to Facebook and Twitter, A&B should present a consistent image across all platforms that actively encourages interaction.
 
A&B should come across as a serious site that engenders customers trust and leaves them with no qualms about spending money with us.
Retina Ready
 
Main Header Elements
 
•  Logo
• Strapline/Slogan
• TrustPilot Logo – 5 Stars
• Search Bar (prominent)
•  My Account
•  Contact Us
•  Currency Options drop-down (£, €, $…etc)
•  Simple Basket
Navigation
 
•  Attractive top navigation that scales well for tablet and mobile devices
•  Drop-down menu with lifestyle/product images
•  Top Level Departments shown across the board.
•  Clear divide between the products to help guide the shopper to the correct product
Banners
 
Main Banner
 
•  Stretches beyond the main page size (e.g. more than 1000px)
•  Overlaid “Buy Now” or “Shop Now” buttons
•  Nav Arrows (previous and next) – These will only show when a banner is hovered over
•  Nav Links – These will be shown at the bottom of the slider to show how many banners there are to scroll through
Other Banners
 
•  Newsletter Sign Up
•  New In
•  Ultralight Kit Dept
•  Seasonal Department Categories
•  Season Brand Banners
•  Online Retailer of the Year (TGO Awards)
•  Free UK Delivery
•  Overlaid “Buy Now”, “Shop Now” or “Sign Up” buttons
•  Overlaid links within panels i.e. Nemo could have “Nemo Sleeping Bags”, “Nemo Tent” and “View All Nemo”
Top Offers
 
•  4 products in a row
•  Arrows to scroll and view more
•  Products would be displayed as they are on the product listings pages
Content Boxes
 
•  Text blocks nicely laid out for SEO purposes
•  3 in a row
•  Our Ethos
•  Award Winning Kit
•  Award Winning Service
Footer
 
Main Footer
 
•  Text Links
•  Social Media Icons
•  Online Retailer of the Year (TGO Awards) graphic
•  Newsletter Quick Sign Up
•  Expert Advice
•  Contact Details
•  Latest Blog
•  Brands (Kit Heads)
•  Scrollable with arrows
Back to Top