Action Screen Website (Stage 1)

E-commerce Website Redesign

Arrow Icon

Overview

In this project, I was tasked to help a client that runs a commercial printing business to come up with a redesign and strategy for the company’s website and business operation.

Role: UX/UI Designer
Visual & Interaction Design, User Research, Information architecture, 3D modeling, Content Strategy
Project Duration
Aug 2023 - On-going
Stakeholders
Business Owner, Project Manager
Client/ Team
Action Screen

Project Stage

Stage 1
The Website Revamp
(1 Month)
Stage 2
E-commerce platform
(1 month)
Stage 3
SEO Consideration
(1 week)

1. Discovery

User Research

Who are the users?

It was really important to address the relationship between the business owners and his clients. The website acts as the communication between the two parties and it is crucial that this process is design as seamless as possible.

Occupation: Printing Business Owner

Age: 60 years old

Founded Action Screen 30 years ago and is an expert in the printing field, but as the demographic changes, Vincent has found it hard to adjust his business.

Main Demographic

Occupation: Real Estate Brokers/ Realtors

Secondary Demographic

Occupation: Retail store owner

Occupation: Restaurant Owners

Occupation: Education/ Schools

Business Owner & Customer Flow

Customer

Business Owner

1. Method of customer traffic

Method 1: Customer to the business owner via word of mouth or social media

Method 2: Customer comes in contact with business owners website

Insight #1
- Website so under utilized when it has all details for product & Services

Insight #2
- Not capitalizing on social media marketing for potential leads

2. Call from customer and figures outs what they want

Customer wants printing inquires (Submitting artwork)

If they need artwork done from scratch, then it is a longer conversation

Insight #3
- Everything feels like a custom order when customers go to you directly to perform a transaction

3. Order Confirmation

A) Business Owner creates an invoice on Square

B) Business Owner sends an email and the invoice to confirm the order

C) Customer agrees to the order via email

Insight #4
- Having customers confirm their order via email may require a buffering time

Insight #5
- Does not have a clear method of showing the final outcome of the product

4. Production

A) Business Owner sends the artwork detail to a 3rd party company for Production

B) Customer Order has finished printing

C) Customer agrees to the order via email

5. Product Delivery

Delivery option 1: Business Owner Delivers product to the customer at a designated location

Delivery option 2: Customer picks it up from business owners location

Business owner receives payment for his services from the customer

Insight #6
- Runs into troubled customers that may not pay for the business owners services after the product is sent to them
- Results in the business owner chasing after the customers for payment

The Challenges

Under-utilization of potential digital traffic
It feels like a manual process to make an order
Trouble securing payment transaction

2. Heuristic Evaluation

Current State - Website

1. Homepage

Nav Bar: Too much going on with the highlighted tabs

Land page banner: Has too much going on with the background

Feature Products: Consistent Visuals and if it weren’t for the text, I wouldn’t have known what the “For sale signs” and “Directional signs” were

Company Values: Spacing is very off

2. Product/ Service Listing

Embedded PDF Product List: It does not show up right away or it requires the user to refresh the page. Harder for users to find what they want

Text: Less text and more visuals to communicate how the product looks like

Carousel Images: Hides the images that communicate what the product is

Approach:

How could we use the website to create a more seamless interaction between business owner and customer?

Goals of Redesign

Establish clear information architecture and visual hierarchy
Clear and reliable way for customers to view products and services (E-commerce)
Secure method of payment transaction

3. Develop

Ideations

Action's Screen's Competitors

  • Has an integrated E-commerce platform
  • Has variety of printing options
  • For real estate printing, it does not have brokerage specific printing
  • Lack clear navigation of the site
  • Too much text on the homepage
  • Not a clear call to action
  • Has printing templates for specific industries and brokerages
  • Printing specific to real estate
  • Less variety of other printing options
  • More intuitive website navigation
  • Larger variety of printing options
  • Expensive

Wireframes

Realization

Addressing Constraints

Using Wix

Low-Fidelity Mockups

Push to High-Fidelity

User Feedback #1: Felt that the look of the site did not fit the businesses primary customers of real estate brokers

User Feedback #2: Too much empty space in certain areas of the site

User Feedback #3: The assets showcasing his product and services need a better representation

User Feedback #4 (V2): Be very careful with visual accessibility with content overlaying on a blue background

Version 1

Version 2

4. Final Design

The New Look

Homepage: Clear Call to Action


From the start of entering into the site, it should be clear and intuitive for the user to acquire more information regarding the types of product and services.

Homepage: Establishing Client Trust


To really establish trust regarding for a small business’s product’s and services, it was very important to indicate the clients that have had a positive experience doing business with Action Screen.

Homepage: Product/ Service Representation


In the past, the business owner had a hard time fully visualizing how the product will turn out post-production. It was important that the visuals on the site clearly indicate to customers what they are paying for.

Other Pages

View Live Website

6. Reflection

The Next Step

Potential metrics


With the Stage 1 iteration implemented, these would be some of the metrics that I would measure moving forward to continuously improve designs and business growth:

Overall customer Traffic to the website
Click rate for “view products” & “Request Quote” button
Rate of customers uploading their own artwork

Upcoming Stage

Stage 1
The Website Revamp
(1 month)
Stage 2
Ecommerce Platform
(1 Month)
Stage 3
SEO Consideration
(1 week)