OnlineLabels

Onlinelabels.com is an online printing supplements store and printing service, provider.
They help customers to find and order printing supplements and blank labels of various materials and sizes.
Customers can design and print amazing labels on the fly.

The company has a slogan 'Click. Print. Stick.'

 

---

The problem

A lot of unsatisfied customers reviews such as "the product was difficult to use after ordering".

Challenge
To determine the difficulties customers have after purchasing the product in realm.

 

My Role
✓ User research
✓ Storytelling
✓ Competitor Analysis
✓ User Flow
✓ Wireframes
✓ Prototype
✓ Usability Testing

 

Timeline
4 weeks
___________
2019

Goal: To understand the current project and audience through research

Process: Client Interview | Online Reviews Analysis I Competitive Analysis | Usability Testing

---

The users are: small and middle business, solo entrepreneurs who want to print out labels by themselves, using their own equipment.

Customers' age is varied. There can be very savvy computer users and “old school” generation of people who are not very familiar with computers.

Storytelling

To fit the user shoes during the process and to understand better-existing scenarios of interaction I created the "happy" storyboard from point A to Z.

Point A – the user identify needs. In my case – the user decided he needs labels.

Point Z – the user is satisfied and happy with the product.

---

✓ hard to find a template to work
✓ useless tutorials
✓ difficulty with editing and printing process

---

In order to determine potential advantages and disadvantages of 'www.onlinelabels.com' service, I conducted a competitive analysis by evaluating the strengths and weaknesses of direct and indirect competitors.

 

I was focused to the following processes (parameters):
1. Printing manual – instructions
2. Find a template on a web site
3. Upload an image
4. Edit the template
5. Preview and print the template

---

To see by my own how the users interact with the web site and what problems they faced (based on their tasks) I conducted in person and remote usability testing on the existing web site version.

 

My Usability testing strategy:

Observe offline and online interactions.

 

2. Define the testing task.

Scenario: "you ordered online stickers paper to print out the labels for your small company needs. The mailman delivered the package the next morning and you are getting a hurry to your computer to print out personal logo-labels".

(at the beginning, every user got an envelope with sticky paper and factory instruction)

 

3. Tasks order.
• Get an envelope with the sticky paper.
• Print out labels.

Goal: Clearly articulate the problems need to be solved.

Process: User flow | Affinity mapping I Site map

---

After watching the records again and again I discovered 3 different routes of users behavior and created 3 user flows.
Next, to each step, I put the emoji to understand user emotional condition.

I use the affinity mapping method to find similar flow issues and combine them into theme groups.

 

I found issues were divided into 3 categories:

1. Instructions – problem definition - Information Design problem – provided information doesn’t help users reach the goal.

2. Getting template experience – poor information architecture – users can not easily find what they want.

3. Creative tool – 'Maestro Label Designer' – poor navigation – users had difficulty to find the right buttons and tool.

 

I also highlighted important findings:

✓  Experienced users didn’t read the instruction at all, they used template number only.

✓  Inexperienced users followed the instructions. The web address in the instruction is too long to type it manually. The web page from instruction itself shows printing tips but NO clue HOW TO GET A TEMPLATE.

✓  For users absolutely unclear what is 'Maestro Label Designer' tool. 'Maestro Label Designer' was guided by trial and error method.

✓  Users faced new challenges after the launch of the 'Maestro Label Designer' tool:
1 – how to upload the image
2 – how to find a full-page design version.

Then I created a sitemap, which I was able to see the navigation structure.

Goal: To develop information architecture and user flows based on research insights

Process: Task Flow | Sketching

---

I accompanied the user flow with a task flow, mapping out the path users would take to accomplish additional tasks. This helped to define the key screens and interactions required for users to find information on the site.

Based on my research findings I had a brainstorming session and moved to a potential problem-solving-sketching stage.

Sketching helped me visualize the structure of the website problems I'm working on.

After creating low-fidelity wireframes, I converted them into an interactive prototype using Marvel software. This prototype was used to run the user testing and allowed to enhance features and to eliminate critical pressure points.

This design demands that users perform a series of steps before they can perform a function, and spend some time to study 'Maestro Label Designer' tool.

Insights from user testing: Users are not reluctant to spend additional time learning a new tool.

I rebuilt new user flow in a way  "minimum affords – maximum information".

Next I would:
✓ Conduct another round of usability testing
✓ Improve navigation design and information design

✓ The importance of fundamental stages of design. It's easier to fix something during the prototyping or designing process rather than fix a part of a huge system.

✓ Information Architecture and Information Prioritizing are like a foundation for the web site.