b&o play website analysis
TRANSCRIPT
B & O Play
Website design analysis
START
Junchen chenE-commerce Personal project
CONTENT
INTRODUCTION
Page layout
NAVIGATION SYSTEM
Checkout funnel
MULTI BROWSERS FUNCTIONALITY
Interactive design
INTRODUCTION
Band & Olufsen
Founded in 1925 by Peter Band and Svend Olufsen, whose
First significant product was a radio with a trending style.
This company manufactures a highly distinctive and exclusive electronic products such as television, loudspeakers, telephones, and multimedia products combining technologies with emotional appeal.
In order to achieve those high quality products, B & O applies it acoustic skills and design competences in creating high-performance sound systems.
INTRODUCTION
Band & Olufsen + play = B & O PlayFour key points heritage from B&O
Visual beauty Crystallizing the fundamental user needs through the engineering phases
Natural and balanced to reproduce emotions
fit human needs
INTRODUCTION
Band & Olufsen + play = B & O Play“PLAY” Definitions
Curiosity Energetic Positiveness
Page layout
Website keywords Searching
Search those keywords on main stream searching engines in US to find out ranks of B&O Play
Page layout
Results of Searching
bing + = Ranks out of top 100!
Page layout
Page Templates
Three boxes
Simple, allow to put large and hi-definition pictures to attract people`s attention.
Featured graphic
Lack of distraction Easily being read
Page layout
Homepage Advanced version of three boxes.
First full screen area used to promote new product
Following blocks are gates to detailed product pages
Page layout
Detailed product page
Extremely straight ford to present product details.
Theme is super clear: showing product
NAVIGATION SYSTEM
NAVIGATION SYSTEM
B&O Play navigation system structureTwo components
Top navigation blocks
Bottom navigation system
NAVIGATION SYSTEM
Homepage top navigation block
Clearly show product categoriesSimple Purchase orientated Icon design is brilliant
NAVIGATION SYSTEM
Detailed product page top navigation block
Additional page jump function
miniature table of contents Quickly jump to interesting block
NAVIGATION SYSTEM
Detailed product page top navigation block
Button enabling people go back to homepageMaking homepage as the central hubAvoiding people to lost their way
NAVIGATION SYSTEM
Purchase orientated design
Every page is embedded the gate to checkout funnel, which is extremely to find out
NAVIGATION SYSTEM
Bottom information block
Provide further information about website, and available contact method
Checkout funnel
Checkout funnel
Checkout page design
1
2 3
Progress indicator is a good guideline for customers
Double emphasize the location of checkout funnel
Summary block reminds people how much they have to pay all the time
Checkout funnel
Multi available payment
Include main stream online payment methods
Checkout funnel
Trust and security
Lock icon and “secure checkout by Amazon” put in every checkout page to tell people it is safe if they purchase on this website
MULTI BROWSERS FUNCTIONALITY
MULTI BROWSERS FUNCTIONALITY
Brilliant multi browsers functionality Tested by tool named MultiBroswer, B&O Play website can open and display it well on almost every popular electronic devices:
Iphone Android phone Tablet Major browsers
MULTI BROWSERS FUNCTIONALITY
Drawback
Since many large and almost full screen pictures, displaying results are not perfect on some small screen devices like Iphone4s.
Interactive design
Interactvie Design = playful
Animated graphics and videos embedded in everywhere!
Interactive design
Interactvie Design = playful
Static graphic transform to animated pictures by your click!
Interactive design
THANK YOU