ux project · for further prototyping and testing, i have started preliminary development on the...

17
UX Project Matthew Aldrich Sia

Upload: others

Post on 14-Jul-2020

0 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

UX ProjectMatthew Aldrich Sia

Page 2: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

Project Overview

Purpose

● This purpose of this project is to create a website for Simplified Home Solutions, an internal startup for a traditional consumer goods company.

● The website will function as a marketing tool and a direct-to-consumer e-commerce channel for the client’s products.

Objective

● The main deliverable of this project is the front-end design of the website.● Other deliverables include competitive analysis, user personas, user journeys,

mood boards, wireframes, and prototypes.

UX Project

22

Page 3: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

Project Overview

Approach

● To approach this project, I applied UX principles with the goal of teaching their significance to the client.

● I went through the Strategy, Discovery, Analysis, and Design phases.

Role

● As the designated UX person of the company, I led in creating the deliverables.● I also took the lead in strategizing for business and user needs.

3

UX Project

3

Page 4: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

Table of Contents

02 Project Overview05 Business Goals and Strategy07 Competitive Analysis08 User Research09 User Persona10 User Journey Map11 Mood Board12 Sitemap13 Wireframes14 Prototypes16 Usability Testing17 Next Steps

Page 5: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

Business Goals and Strategy

Goals

● Develop the Simplified Home Solutions brand● Be a marketing tool for Jobar products● Be a direct-to-consumer e-commerce channel for Jobar products● Be a small-scale test market for potential Jobar products● Target a new market segment: adults aged 22-35● Setup to potentially be its own company in the long term

Key Performance Indicators

● Sell $100,000 worth of product in 2018● Have 500 registered users by the end of 2018

5

UX Project

5

Page 6: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

Business Goals and Strategy

Minimum Viable Product

● Have a functioning shopping cart system that allows users to purchase product● Have a simple, usable, and satisfying interface on web and mobile● Have an About Page that describes the SHS brand● Have a Contact Page for customer service purposes

Value Propositions (to be tested)

● SHS solves problems in your home you didn’t know you had - giving you new ingenious products every month.

● SHS provides useful and practical home gifts for you to give to your loved ones.● SHS gives you a box of home solutions - letting you create a customized package of

ingenuity for your home.

6

UX Project

6

Page 7: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

Competitive Analysis

For direct competitors, we took a look at retailers that also sold our client’s products. For indirect competitors, we observed other online retail stores that also sold consumer goods. We registered for accounts on these sites to take a look on what makes them work.

7

UX Project

7

Page 8: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

User Research

Methodology

● To pick users to interview, we spoke to people who were already interested in buying our client’s products.

● We did this by approaching customers at Bed Bath & Beyond who picked up our client’s products from the shelves.

Data

● To gather data, we asked questions about their motivations for buying this product and their life goals and frustrations.

● We also observed the general demographic of the customer.

8

UX Project

8

Page 9: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

User Persona

Using the data we gathered, we developed a persona that closely resembles the user. More importantly, our research validates the assumption that there is need for our client’s products in the young adult market.

9

UX Project

9

Page 10: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

User Journey Map

10

UX Project

10

Page 11: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

Mood Board

For inspiration on visual design, we worked with our client’s art department to hand pick product images and lifestyle images that fit the overall aesthetic of what we were trying to achieve.

11

UX Project

11

Page 12: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

Sitemap

12

UX Project

12

Page 13: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

Wireframes

13

UX Project

13

Page 14: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

Prototypes

14

UX Project

14

Page 15: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

Usability Testing

Introductory Questions:

1. How do you currently shop for home goods (such as…)?2. What issues have you had in trying to do this?3. How often do you face this problem?

First Look Questions:

1. “What are your first impressions?”2. “What do you think you can do on this site?”3. “Who do you think this site is for?”

15

UX Project

15

Page 16: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

Usability Testing

User Tasks:

1. “Look around the website and find something you like”2. “Sign up for an account with Shopshs.com”3. “Buy something you like for less than $20 (with this credit card number)”4. “Learn more about Shopshs.com”5. “Contact customer service about a return”

Concluding Questions:

1. How did the website make you feel?2. On a scale from 1-5, how satisfied did the website make you feel?3. On a scale from 1-5, how confused or lost did the website make you feel?4. Is there anything you would have liked to see on this website?5. Is there anything you would rather have not seen on this website?

16

UX Project

16

Page 17: UX Project · For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript. Further development

Next Steps

Now in Development

● For further prototyping and testing, I have started preliminary development on the Magento 1.9 content management system using HTML, CSS, and JavaScript.

● Further development will be outsourced.

Future Features

● Other features that will need to be tested for the next phase include an interactive idea board, a gift-giving page/program, and a mystery box event.

Measure and Repeat Design Phase

● We will use feedback obtained from Google Analytics to measure clicks, conversion rates, and user data.

17

UX Project

17