Succeeding in Today's Dynamic Business Climate



      How DiscoveryStore.com used Web 2.0
   technologies to improve the...
About Discovery

• Discovery Communications, LLC (“Discovery”) is
  the number-one nonfiction media company
  reaching mor...
Discovery Commerce & DiscoveryStore.com

• Discovery Commerce helps consumers live a life of
  Discovery by offering high-...
Web 2.0 Enhancements


1. Customer Ratings &
   Reviews
2. Add to Cart Pop-over
3. Dynamic Shopping Cart
4. Persistent Car...
Customer Ratings & Reviews




                             5
Customer Reviews: Upgraded with Bazaarvoice
•   Replaced home-grown rating and review functionality this year;
    New fun...
Customer Reviews: Product Page




                                 7
Customer Reviews: Microsite




                              8
Product Reviews: Lessons Learned

• Switching from unauthenticated to authenticated users
  suppressed review volume
• Rev...
Checkout Redesign




                    10
Checkout Redesign: Goals

•   Increase average order size
•   Decrease cart and checkout abandonment
•   Simplify and stre...
Checkout Redesign: Approach

•   Started analysis/design in Q1 2007
•   Outsource the UI design and wire-frames
•   Use in...
Checkout Redesign: Product Page
                                  Features:
                                  1. Add All B...
Checkout Redesign: Add To Cart Popup
                                  Features:
                                  1. Add ...
Checkout Redesign: Shopping Cart
                                   Features:
                                   1. Add Al...
Checkout Redesign: Single Page Checkout
                               Part 1: Address Entry


                           ...
Checkout Redesign: Single Page Checkout
                           Part 2: Shipping & Payment


                          ...
Checkout Redesign: Order Confirmation
                           Features:
                           1. Printable receipt...
Checkout Redesign: Technology Choices
• WCv6 FP2 Web 2.0 components
   – Upgrade to WCv6 and FP2 did not happen until July...
Checkout Redesign: Lessons Learned

• Phase in major functionality incrementally as they are
  completed and tested
• Be s...
Checkout Redesign: Lessons Learned cont.

• Use small server side JSP fragments and partial page
  refreshes to render sec...
Checkout Redesign: Testing Approach

• Usability Testing
  – External expert review of wireframes
  – Wireframe testing in...
Questions?
•   Chris McFadden: chris_mcfadden@discovery.com or
•   Larry Rosen: larry_rosen@discovery.com




            ...
Upcoming SlideShare
Loading in …5
×

WebSphere Commerce Leadership Summit - Discovery

2,004 views

Published on

How DiscoveryStore.com used Web 2.0 technologies to improve the purchase process

Published in: Business, Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
2,004
On SlideShare
0
From Embeds
0
Number of Embeds
13
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

WebSphere Commerce Leadership Summit - Discovery

  1. 1. Succeeding in Today's Dynamic Business Climate How DiscoveryStore.com used Web 2.0 technologies to improve the purchase process Chris McFadden: Director, E-Commerce Systems Development Larry Rosen: E-Commerce Development Lead Discovery Communications, LLC
  2. 2. About Discovery • Discovery Communications, LLC (“Discovery”) is the number-one nonfiction media company reaching more than 1.5 billion cumulative subscribers in over 170 countries. • Discovery's 100-plus worldwide networks (14 US) include Discovery Channel, TLC, Animal Planet, Planet Green, Discovery Kids, The Science Channel, and Discovery Health. 2
  3. 3. Discovery Commerce & DiscoveryStore.com • Discovery Commerce helps consumers live a life of Discovery by offering high-quality merchandise that informs, excites and entertains. • The division’s channels include a robust e-commerce business, seasonal catalogs, DRTV, and domestic licensing partnerships. • At the DiscoveryStore.com customers can shop for an expanded assortment of exclusive Discovery merchandise including DVDs, Toys, and fan-gear. • DiscoveryStore.com has more than 12 million unique visitors annually, and reaches even more consumers through a flourishing affiliate network and partnerships with leading e-commerce sites such as Amazon.com. 3
  4. 4. Web 2.0 Enhancements 1. Customer Ratings & Reviews 2. Add to Cart Pop-over 3. Dynamic Shopping Cart 4. Persistent Cart in Top Hat 5. Single Page Checkout tag cloud by Markus Angermeier 4
  5. 5. Customer Ratings & Reviews 5
  6. 6. Customer Reviews: Upgraded with Bazaarvoice • Replaced home-grown rating and review functionality this year; New functionality includes: – Customers have profiles with all their submitted reviews – Badging of reviewers: expert, top 10, staff, etc. – Upload customer images and videos – Finer tuned ratings: went from half star to tenths of star – Multi-dimensional reviews based on product type • Quality • Educational Value • Entertainment Value • Construction • Ease of Use • Value Added Benefits – New microsite with additional SEO benefits – Outsourced moderation – Ratings and reviews best practices – Share products and reviews on Facebook, Digg, Delicious 6
  7. 7. Customer Reviews: Product Page 7
  8. 8. Customer Reviews: Microsite 8
  9. 9. Product Reviews: Lessons Learned • Switching from unauthenticated to authenticated users suppressed review volume • Review quality and character count increased • Integration using Javascript tags was relatively straightforward but required collaborative UI design effort • User registration integration was required with additional validation • Summary rating data needs to be imported to display on product listing pages and for merchandising rules • Reverse proxy resolved domain name issues: – reviews.shopping.discovery.com/path? -> shopping.discovery.com/reviews/path? 9
  10. 10. Checkout Redesign 10
  11. 11. Checkout Redesign: Goals • Increase average order size • Decrease cart and checkout abandonment • Simplify and streamline checkout • Create a more engaging user-experience • Minimize business logic changes 11
  12. 12. Checkout Redesign: Approach • Started analysis/design in Q1 2007 • Outsource the UI design and wire-frames • Use in-house staff for implementation • Review and prototype technology choices – Dojo, Ajax, WCv6 FP2 • Minimize interdependencies to allow phased in approach • Do extensive testing at all stages of project • Ensure both flows run concurrently • Implement A/B testing to measure results 12
  13. 13. Checkout Redesign: Product Page Features: 1. Add All Batteries checkbox 2. Gift Wrap checkbox 3. Accessories checkboxes Demo 13
  14. 14. Checkout Redesign: Add To Cart Popup Features: 1. Add to Cart pop-over – customer remains on same page 2. Add All Batteries checkbox 3. Gift Wrap checkbox 4. Show accessories with options 5. Change quantity 6. Persistent cart updates 7. Continue Shopping or go to Checkout 14
  15. 15. Checkout Redesign: Shopping Cart Features: 1. Add All Batteries checkbox 2. Gift Wrap checkbox 3. Change quantity 4. Persistent cart updates 5. Shipping & Tax estimator 6. Coupons entry 7. Cart up-sells: rollover and add to cart 8. Print cart 15
  16. 16. Checkout Redesign: Single Page Checkout Part 1: Address Entry Features: 1. Login or guest 2. Mini-cart displays cart contents, shipping, estimated tax & order total 3. Ajax address validation, no full page refreshes 4. Remaining sections remain hidden until address is entered 16
  17. 17. Checkout Redesign: Single Page Checkout Part 2: Shipping & Payment Features: 1. No full page refreshes 2. Easy shipping options with costs 3. Alternative payments: Gift Cards, Bill Me Later & PayPal 17
  18. 18. Checkout Redesign: Order Confirmation Features: 1. Printable receipt 2. Display full details of order and line items 3. Allow creation of account for guest users to save information for next time 18
  19. 19. Checkout Redesign: Technology Choices • WCv6 FP2 Web 2.0 components – Upgrade to WCv6 and FP2 did not happen until July ‘08 – New components did not match our design requirements – Programming model would require modification of business logic – Additional overhead was not desirable • Dojo Toolkit – Too big and complex for our needs – No previous experience with the toolkit – Limited documentation available, no vendor support, and lack of other books and online references Custom Ajax solution using JavaScript, Ajax, and CSS – Simple, lightweight, standards based solution – Use existing unchanged business logic – Use partial page refreshes - JSP fragments generate HTML – JavaScript/CSS control display and event logic 19
  20. 20. Checkout Redesign: Lessons Learned • Phase in major functionality incrementally as they are completed and tested • Be sure to A/B test –newer is not always better since your existing checkout may be more mature, error free, and more familiar to customers • Prototype the basic functionality as early as possible to determine technology choices: expect some trial and error • Allocate sufficient time for project due to criticality and complexity of checkout process and the new technology • Usability testing is vital in finding road-blocks in purchasing flow • Adjust implementation approach based on performance impact • Do extensive browser compatibility testing since JavaScript is very browser dependent. 20 – Use analytics to determine which browsers to test
  21. 21. Checkout Redesign: Lessons Learned cont. • Use small server side JSP fragments and partial page refreshes to render sections of page – This is faster, more reliable, and less browser dependent than parsing XML with JavaScript to update HTML • Chaining refreshes prevents timing issues on complex pages such as a single page checkout – More reliable than sending multiple requests and listening for multiple responses – Easier to develop and debug than event driven components • Use of Ajax works well when using Akamai or other caching on catalog pages • Structure JavaScript code for readability – Include all JavaScript in separate include files • Provide some feedback to user such as “Loading..” when making Ajax calls. 21
  22. 22. Checkout Redesign: Testing Approach • Usability Testing – External expert review of wireframes – Wireframe testing in usability lab – Live alpha testing in lab • Functional Testing – Test case creation and execution by internal QA – Functional and browser compatibility testing by external QA vendor in production • A/B Testing – Using web analytics to measure AOV & conversion • Load testing using third-party 22
  23. 23. Questions? • Chris McFadden: chris_mcfadden@discovery.com or • Larry Rosen: larry_rosen@discovery.com 23

×