Top Banner
Info Architecture & Web 2.0 Design Standards Case Studies
103

DBS-InformationArchitectureSession

Jan 28, 2015

Download

Business

DBS - Information Architecture Session
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: DBS-InformationArchitectureSession

Info Architecture & Web 2.0 Design Standards

Case Studies

Page 2: DBS-InformationArchitectureSession

Design with Clear Intent

Page 3: DBS-InformationArchitectureSession
Page 4: DBS-InformationArchitectureSession

Clear Layout

Page 5: DBS-InformationArchitectureSession

Clear Layout

Page 6: DBS-InformationArchitectureSession

De-cluttered Logical Flow

Page 7: DBS-InformationArchitectureSession

De-cluttered Logical Flow

Page 8: DBS-InformationArchitectureSession

Demonstrate clear Call to Action

Page 9: DBS-InformationArchitectureSession

Clear Calls to Action

Page 10: DBS-InformationArchitectureSession

Obvious Benefits

Page 11: DBS-InformationArchitectureSession

Obvious Benefits

Page 12: DBS-InformationArchitectureSession

Appropriate Channel Design

Page 13: DBS-InformationArchitectureSession

Appropriate Channel Design

Page 14: DBS-InformationArchitectureSession

Clear and Intuitive Messages

Page 15: DBS-InformationArchitectureSession

Clear Intuitive Messages

Page 16: DBS-InformationArchitectureSession

eCommerce Case Study

Wiltshire Farm

Page 17: DBS-InformationArchitectureSession

Case Study: Wiltshire Farm Foods

Page 18: DBS-InformationArchitectureSession
Page 19: DBS-InformationArchitectureSession
Page 20: DBS-InformationArchitectureSession
Page 21: DBS-InformationArchitectureSession
Page 22: DBS-InformationArchitectureSession

Key Take-Aways

• Remove Clutter – focus on key goals all the time – Remove any obstacles

• Provide lots of visual feedback – Users know that actions have been successful

• Adhere to affordance rules – make them obvious– Big Buttons, Clear Large Links

• Anticipate and Answer questions upfront – Embed as part of user experience

• Knit USPs in copy and images of site– Emphasise all your differentiators

Page 23: DBS-InformationArchitectureSession

Website Optimisation

• Dynamically Testi key elements of site– Test Copy, Calls to Action, Images, Placement– The $300,000,000 Button

• Both Split (A/B) and Multi-Variate Test– Google Website Optimiser or Proprietary tools

• Define and set up conversion points– Need to track and measure user actions

• Clear calls to action significantly augment optimisation goals– Don’t force user to think – TELL THEM WHAT TO DO

Page 24: DBS-InformationArchitectureSession

Test Process

• Never stop testing and tracking user actions on website• A/B Split Testing

– Define specific site goals (sale, sign-up etc..)– Test two specific pages (typically high volume landing pages)– Commercial tools (Vertster) or Google Optimiser – Monitor which test is performing better– Use Variable rate or throttle testing to vary the percentage of traffic that

gets routed to the various pages

• Multi-Variate testing– Enables variable testing of elements within single pages– Different copy text, form layouts and even landing page images and

background colours together– Track combinations that achieve predetermined goals

Page 25: DBS-InformationArchitectureSession

Sales Funnels

Page 26: DBS-InformationArchitectureSession

Boden

Page 27: DBS-InformationArchitectureSession
Page 28: DBS-InformationArchitectureSession
Page 29: DBS-InformationArchitectureSession
Page 30: DBS-InformationArchitectureSession
Page 31: DBS-InformationArchitectureSession

Micks Garage

Page 32: DBS-InformationArchitectureSession
Page 33: DBS-InformationArchitectureSession
Page 34: DBS-InformationArchitectureSession
Page 35: DBS-InformationArchitectureSession
Page 36: DBS-InformationArchitectureSession
Page 37: DBS-InformationArchitectureSession

Amazon Funnel

Page 38: DBS-InformationArchitectureSession
Page 39: DBS-InformationArchitectureSession
Page 40: DBS-InformationArchitectureSession
Page 41: DBS-InformationArchitectureSession
Page 42: DBS-InformationArchitectureSession
Page 43: DBS-InformationArchitectureSession

Amazon Cart Functions

Page 44: DBS-InformationArchitectureSession

Web 2.0 Design Model

Page 45: DBS-InformationArchitectureSession
Page 46: DBS-InformationArchitectureSession
Page 47: DBS-InformationArchitectureSession
Page 48: DBS-InformationArchitectureSession
Page 49: DBS-InformationArchitectureSession
Page 50: DBS-InformationArchitectureSession
Page 51: DBS-InformationArchitectureSession
Page 52: DBS-InformationArchitectureSession
Page 53: DBS-InformationArchitectureSession
Page 54: DBS-InformationArchitectureSession
Page 55: DBS-InformationArchitectureSession
Page 56: DBS-InformationArchitectureSession
Page 57: DBS-InformationArchitectureSession

Calls To Action

Page 58: DBS-InformationArchitectureSession
Page 59: DBS-InformationArchitectureSession
Page 60: DBS-InformationArchitectureSession
Page 61: DBS-InformationArchitectureSession
Page 62: DBS-InformationArchitectureSession
Page 63: DBS-InformationArchitectureSession
Page 64: DBS-InformationArchitectureSession
Page 65: DBS-InformationArchitectureSession
Page 66: DBS-InformationArchitectureSession
Page 67: DBS-InformationArchitectureSession
Page 68: DBS-InformationArchitectureSession
Page 69: DBS-InformationArchitectureSession
Page 70: DBS-InformationArchitectureSession
Page 71: DBS-InformationArchitectureSession
Page 72: DBS-InformationArchitectureSession
Page 73: DBS-InformationArchitectureSession
Page 74: DBS-InformationArchitectureSession
Page 75: DBS-InformationArchitectureSession
Page 76: DBS-InformationArchitectureSession
Page 77: DBS-InformationArchitectureSession
Page 78: DBS-InformationArchitectureSession
Page 79: DBS-InformationArchitectureSession
Page 80: DBS-InformationArchitectureSession
Page 81: DBS-InformationArchitectureSession
Page 82: DBS-InformationArchitectureSession
Page 83: DBS-InformationArchitectureSession
Page 84: DBS-InformationArchitectureSession
Page 85: DBS-InformationArchitectureSession
Page 86: DBS-InformationArchitectureSession
Page 87: DBS-InformationArchitectureSession
Page 88: DBS-InformationArchitectureSession
Page 89: DBS-InformationArchitectureSession
Page 90: DBS-InformationArchitectureSession
Page 91: DBS-InformationArchitectureSession
Page 92: DBS-InformationArchitectureSession
Page 93: DBS-InformationArchitectureSession
Page 94: DBS-InformationArchitectureSession
Page 95: DBS-InformationArchitectureSession
Page 96: DBS-InformationArchitectureSession
Page 97: DBS-InformationArchitectureSession
Page 98: DBS-InformationArchitectureSession
Page 99: DBS-InformationArchitectureSession
Page 100: DBS-InformationArchitectureSession
Page 101: DBS-InformationArchitectureSession
Page 102: DBS-InformationArchitectureSession
Page 103: DBS-InformationArchitectureSession