Overview

Security Camera Manufacturer specializing in 360 Degree and panoramic cameras. Deals mainly in B2B sales (most are small businesses) and international clients in Australia.

Objective

To design a new e-commerce site which showcases the vast inventory of Sentry360 and allows customers to purchase cameras or place inquires.

Website should also provide users with extensive support documents and software downloads.

Gathering Requirements and Research

Defining a repeatable process to release sustainable UI updates.

User Journey Map

Defining a typical journey for a first time customer.

Customer Research

Conduct users surveys and evaluate results

Findings

  • Users value details on products and have specific needs for a specific camera. 
  • If a product is sold out or is unavailable, the user should be able to submit a backorder using a contact form on the product page.
  • Support pages should be easily accessible. Large displays (banners, videos) were highly influential in customer's decisions on current site.
  • Website needs to be localized for international users and should contain detailed information on international shipping.
  • Many users will access support documentation on website with Android tablets. 

Define Architecture

Defining assets, and creating a design system.

Early Concepts

Brainstorming ideas, create sketches and then lo-fi design. Gather feedback for Home page including (intro video, banners, navigation and footer.) 

Intro Video - Prototype

Work with design team to create prototype for home page including intro video.

Product landing page - concepts

Create concept sketches and gather feedback for product category pages, and product pages. 

Product landing page - prototype

  • Focus on structure
  • Gather feedback from design and dev team
  • Communicate designs with stakeholders and marketing to check if concept meets requirements

Working Prototype

Create working, responsive prototype from earlier designs with all possible assets. 

Usability Testing

Perform monitored interviews to test how users may find a product on the website.

  • Example Scenario - "You own a shop in a rural area of the United States. You need to find and purchase an HD security camera which works best at night"
  • Metrics - Time per task, success rate, error rate, bounce rate. Interviewers will record user's thoughts during each session and also ask for additional  feedback at the end of each session
  • Analyze data to find conclusive correlation of problems within the prototype.


Development Requirements

  • Gather and utilize feedback from prior testing to finalize prototype
  • Added filters for products, refined icons and buttons, added "scroll up" button for user convenience
  • Final approval from stakeholders on design
  • Send all visual assets and prototypes to Dev team

Development and Launch

Worked with dev team in agile to launch application

  • 2 Week Sprints
  • Input and communication with designers during development process
  • Unit test for back-end, Integration pipeline tests, automated testing (selenium)

Post-Launch A/B Testing

The company already used G-suite with google analytics, and I recommended google optimize for A/B testing. 

The requirement was testing a pop-up when the customer tries to exit the site at any time.

  • 15% off product price vs Free shipping (User provides e-mail and unique code is sent to them)
  • Goal - Increase in mailing list of customers to increase sales after with sales team calls. 
  • Both ideas were tested independently for 2 weeks each
  • Free Shipping had a much greater increase in adding customers to mailing list
  • Free shipping exit pop-up was implemented on the site for 6 months after the test

1 Year Post Launch Analysis

  • Overall 105% increase in completed sales 1 year after new website launch
  • Sentry360 hired additional accounts specialists for the sales team to accommodate additional sales calls
  • Closed largest sale in company history 3 months after website launch (NFL)