Moxo Media Inc. Website (Labels & Stickers' Page)

The Project

Duration: 2 weeks

Project Type: Company's Website

Role: UX Research, UI Design

Method: Sketch, Surveys, Interviews, Affinity Wall, Usability Testing, A/B Testing, Preference Test,

Think- Aloud, Wireframes, Prototyping

Tools: Adobe XD, Adobe Illustrator, Adobe Photoshop, Google forms

Project Brief

About what?

This project started because Moxo inc. was having trouble with the cumbersome pages of its label creation service, which resulted in a low order rate from customers.

For whom?

This is for people who work for companies that are planning to make labels and stickers as promotional goods.

What problems are users having?

When you go to the Moxo inc. the website and visit the page to create a label, the design and form are so simple that users feel confused and uneasy.

Target

Age: Over 20-50.

Gender: Follow all genders

Area: Montreal.

Occupation: Individual, Company

Needs

Speedy
Users are also expecting their designs from scratch.

Competitive Overview

Method Used

Dimension Printing / Impression Tous Formats
Creationexpress Inc.
Atomik Designs
KKP - Montréal Centre
rubiks.ca
Doculand.Net Inc
Click Affiche Inc. Vehicle Wrap & Web design
Code Screen Printing & Embroidery
Multi-Graf Inc.

System Goals

Goal1

To let users imagine how they will want to make stickers at the end.

Goal2

To let them want us to design their design.

Recruiting and Interview Design

I plan to conduct informal unmoderated interviews with three participants between the ages of 20-50.

Participant 1: age 20-30
Participant 2: age 31-40
Participant 3: age 41-50

Interview Criteria

People who have asked to print and done.

Interview Guide and Questions

Below is an outline of potential questions I will use to guide the interviews.

What did you order your thing?
Did you have your designs then asked them to just print them out?
Or did you asked them to include the designs?
How many quantities did you order?
Did you like their work or not and why?
Do you want to ask them again when you have some opportunities?
Did you face some uncomfortable situations?

Needs finding and Initial concept

Conduct Needs Finding and Analysis

I conducted research on services for printing/ designs in Montreal.

I assume that the leads want the following things

Easy to imagine what they exactly want.

Easy to choose and enter their requests and its legibly

Can finish from order to the finish must be 2-3 screen transitions.

Current Practice

It has become a standard for ordering to have the following features to meet the needs of users.

Can drag and drop their designs if they have.

Having icons and pictures of samples.

Fewer screen transitions (at least 4).

Functional Requirement

Showing users what the company can do and custom is required also shown.

3 screen transitions

Can compare the plans and prices.

Showing users how scales are the die-lines (Tight-Medium-Large).

The users can put their postal code and know when they can receive them or come to pick them up.

Constraints

Confusing designs

Too many features

Over 3 screen transitions.

Persona

Gab

Low-Fidelity Prototype and

Micro-usability Test

Wireframe

Based on sketches I started creating wireframes.

Micro-Usability test plan - Overview

○ Overview

I check if the user can reach the goal as soon as possible after installing this website.

Then, I also ask the user to Think-Aloud and find out where the user gets lost and stressed on this app wireframe.

○ Test Goal

Test Goals of this initial user testing is to answer the question:

How is the system less or more efficient are not addressed when the users are attempting to solve their difficulty using this app?

What problems or needs are not addressed when the users are attempting to solve their difficulty using this website?

What experience would satisfy the users of this website?

○ Specific Recruiting and Diversity Criteria

The participants for this test are aged 20-50.
People who have asked to print and done.

Test Component

Note Taking(laptop)
Audio Recorder
User Test Plan
Tasks
Consent Form
Wireframes
Script
Post-Test Questions

The Sequence of Test Activities

Consent Form
Pre-test Interview
Task 1 - Task 2
Thank Participants
Post-Test Questionnaire

Micro-Usability Test Plan - User Test Script

Pre-test Check List

Double-check that all dates in the task are in the future
Fill in all blanks with the name of the website (all documents, including the test plan, test script, and informed consent form)
Go through all of the tasks before performing the test
Print out the task for the user
Print out each task for the user
Print out a post-test questionnaire
Print out or type into the logging sheet
Print out the user script
Record when the test begins

Pre-test questionnaire

How did you find them (company)?
Which website (company) have you used?
Why did you choose that company?
Did you like it?

Task Instructions

Print tasks and present them, one at a time. Read each task aloud and give the printed sheet to the participant. Make notes of successes and failures while the user performs the test.

Task 1

Choose and move forward as below then find the delivery date and the fee.

1st page

On a sheet => Circle => Anywhere Matte => Drop your file here

2nd page

3" x 2" => Quantity: 1000 => 2 - 4 Business Days (Standard).

Task 2

Compare the price as above with below.

1st page

On a roll => Star => Anywhere => Matte => Drop your file here

2nd page

3" x 2" => Quantity: 1000 => 2 - 4 Business Days (Standard).

Debriefing

The focus of the debrief is to walk through any problems that were encountered during the tasks. If any time remains afterward, ask higher-level questions 2-5.

1. Review parts of the test where the user struggled:

(Example)

- What difficulties did you have with this website?

- I noticed you struggled here, can you tell me what happened?

- You paused here, tell me more about that.

2. Preferences: What did you think about the app? What did you like/dislike?

3. Changes: If you had 3 wishes to make this better for you, what would they be? Why?

4. Understanding: How would you describe this to a friend?

5. Use Cases: Under what circumstances would you use this? Why?

Post-test Check List

Keep recording when the post-testing
Stop recording, save audio and video
Save informed consent form
Save logging sheet

Debriefing

The focus of the debrief is to walk through any problems that were encountered during the tasks. If any time remains afterward, ask higher-level questions 2-5.

1. Review parts of the test where the user struggled:

(Examples)

- What difficulties did you have with this website?

- I noticed you struggled here, can you tell me what happened?

- You paused here, tell me more about that.

2. Preferences: What did you think about this website? What did you like/dislike?

3. Changes: If you had 3 wishes to make this better for you, what would they be? Why?

4. Understanding: How would you describe this to a friend?

5. Use Cases: Under what circumstances would you use this? Why?

User Test, Mid-prototype

Create Med- Prototype/ Prototype Screens

Survey