UX Designs, Visual Designs

UX Design: BriteThings Redesign Website

BriteThings: Redesign Website
BriteThings: Redesign Website

Project: Redesign BriteThings Website
My role: a UX Designer
Other team members I worked with:

  • A General Manager
  • A CEO
  • A Marketing Manager
  • An Engineer

Tools: Post-it!, Axure, Photoshop, Illustrator, PowerPoint

Business goal: Receive more phone calls from clients to discuss further options of BriteThings Artificial Intelligence System or BriteThings A.I.

User’s goal: Find the information about how the BriteThings A.I. works and what the benefits the BriteThings A.I has. Access the contact information to discuss further options of BriteThings A. I.

Outcome: This company has received an investor’s funding and signed a contract with a big customer for BriteThings A.I. after launching this website for three weeks.

Challenge: To clearly explain how the BriteThings A.I works and what the benefits the BriteThings A.I. has

Solution to the challenge: Iteration prototypes and usability studies

Visit the live website


User Research: Analysis of the existing website, compare competitor websites and user interviews

Existing BriteThings website

Original BriteThings Website
Original BriteThings Website

Compare competitor websites

Here are the competitors’ websites:

User interviews

I did not interview the end users, however, the general manager, the CEO and the marketing manager provided me the audio records of the end users information they deal with day in and day out. I listened to these audio records and analyzed these records for my user research to define user groups.

Persona, Storyboard and User Task Flow



User Task Flow Version 1

After discussing with other team members, I updated Version 1 to Version 2 to clarify the users’ behaviors.

User Task Flow Version 2

Task Flow Chris Roe
Task Flow Chris Roe

Iteration: Site Map, Navigation system

While developing user experience, the site map and navigation system was constantly changing.

Site Map:

Navigation System:

Iteration: Sketch prototype, Usability Test

Iteration: Prototype, Usability Test, Design

Iteration Version 1:

Online interactive prototype: http://dfpv5f.axshare.com/home.html

Iteration Version 2:

Online interactive prototype: http://ylro65.axshare.com/home.html

Iteration Version 3:

Iteration Version 4:

Iteration: User Content for this website

I responded to the user content writing. I wrote the draft version, then discussed with the team members, modified the writing, editing the writing with the team members and finally the team members proofread the content before publishing online.

Final Design

I provided 3 sizes — mobile size, iPad size, and big screen size — of design for each page.

Big screen size:(eg, laptop screen, TV)

Normal screen size:(eg, iPad screen)

Small screen size:(eg, iPhone screen)

Design Documentation

Design Specification

Build Website

The engineer used Word Press to build this website. I supported the engineer by modifying my design to fit his technical skills via usability test.

Final Website

Visit the live website

Please follow & like me!