Daniel Chew
Triton on Mac.jpg

Triton Promo Redesign

UX DESIGN/REDESIGN

 
Triton New Logo Landscape With Tagline (1).png
 

Triton Promo is a marketing company that offers promotional products, service awards, business gifts, fulfillment programs and creative concepts.

Since its inception in 1985, they have established an extensive global vendor network that stretches across North America to Europe and Asia. Their clients include large and small organizations that need to generate maximum promotional impact in support of their marketing activities and investments.

ROLE: UX DESIGNER TIMEFRAME: 3 MONTHS

 

The primary objective is to improve Triton’s website to convert users into clients and to generate more business through increased sales. It is also intended to educate users on the company’s services and capabilities.

OVERVIEW

 

The first step was to identify the problem and conduct the preliminary research to understand the industry, as well as the pain points of the current website. To understand its users, I created a survey and interviewed 5 people to understand their motivations and to determine what factors would influence their decisions when selecting a marketing company.

Insights from surveys:

Top Influencing factors:

  • Affordable

  • Professional

  • Credible

RESEARCH

 
 
Competitor Homepages.png

Analysis of Competitors

A competitor analysis was conducted with the purpose to glean insights from the data I collected, enabling myself to make informed UX design decisions. This also allowed me:

  • To help solve usability problems

  • To understand where our product or service stands in the market

  • To inform the design process

  • To know the strengths and weaknesses of the competition

  • To have reliable evidence when making website changes

  • To focus our efforts on a target market

 

USER PERSONAS

From my research and experience working at the company, I constructed 2 user personas to represent different targeted users.

Persona 1 represents a young, driven Marketing Director working at a large corporate company. She represents clients who like to be heavily involved with the order process and prefers things to be done as fast and efficiently as possible.

 
USER PERSONA 1: MARKETING DIRECTOR WORKING AT A LARGE CORPORATE COMPANY

USER PERSONA 1: MARKETING DIRECTOR WORKING AT A LARGE CORPORATE COMPANY

 

Persona 2 represents an older, self made business man. He prefers everything to be taken cared of by the team and has little interest in being involved with the process. He just wants to ensure that he is receiving a quality product and that his order will be completed by the scheduled date.

USER PERSONA 2: SELF MADE BUSINESS MAN WHO OWNS HIS OWN BUSINESS

USER PERSONA 2: SELF MADE BUSINESS MAN WHO OWNS HIS OWN BUSINESS

 

USER TESTING

I asked a few individuals to perform some tasks to assess possible pain points users may face while using the old website. For each task, they were asked to vocally explain everything that was going on in their head.

 
Screen Shot 2019-03-19 at 10.12.48 PM.png
 
 

From the usability tests and interviews, I was able to identify 4 visible pain points that users were experiencing:

  • Pain point 1: All inquiries must be done over the phone. Couldn’t order products through website

  • Pain point 2: No up to date online catalog to search for products and pricing

  • Pain point 3: Website is not very informative

  • Pain point 4: Company processes were inefficient

PAIN POINTS

 

Examining the pain points, I came up with solutions for each problem and addressed them accordingly:

  • Solution 1: Design a more user-friendly product search engine, improve the user flow and allow for orders to be placed online.

  • Solution 2: Utilize the website to create an up to date online catalog for users to search for products and find pricing. This allows for client control and can eliminate time spent on the phone discussing their needs.

     

  • Solution 3: Include key facts and information about what the company provides, how the company provides its services, as well as its vision and core values.

  • Solution 4: Incorporate client logins for company profiles. This will allow them to access their order history, saved products and allow for an easier process. This can also assist with company uniform programs and fulfillment programs.

SOLUTION

 

Sketches

I went through a series of sketches and iterations to redesign the user interface and address the pain points that were identified

PLANNING

 
 
 
 

Annotations for Re-design

  • I expanded the About Us page so it could provide more information about the company and designed key features such as the login button and categories for the product search.

  • It was also important for me to include the company’s mission statement and a short paragraph outlining the company’s services, as many users throughout the testing process were not clear as to what the company provided.

  • As customers need social proof and brand assurance, it was essential to include client’s testimonials as well. Building trust in the brand is key, and showcasing customer testimonials would highlight the company’s key benefits and promote the company’s customer experience.

  • As you look at the previous design, the testimonials took up way to much space on the home page. I chose to organize the testimonials as a slider, so it would still be as effective, without cluttering the page.

 

Old layout of Triton’s home page

 

USER FLOW

A user flow was constructed from the point of view of a client to identify the users steps to search for a product and place an order online.

 
 

WIREFRAMES

Low-fidelity Wireframes

Once I had the wireframe sketches done of the user flow, I proceeded with designing low fidelity wireframes on Sketch. I tested a few variations of the design, keeping in mind the pain points that were identified. The main user flows I wanted to focus on were:

  • Searching for a specific product (T-Shirt) and ordering it online.

  • Signing in and learning about the company

It was essential to ensure that users would be able to find products with ease and that all categories were accessible to them. Once clients also signed in, they would be able to access their art files and order history.

 

Lo-Fi Wireframes

 
 

Hi-Fidelity Wireframes

Once I had the low-fidelity wireframes completed, I utilized the prototype function with sketch and tested it with users again, documenting their experience. From the tests, some of the main features that needed to be revised were:

Triton Process :

  • Didn’t need to be included on the Home page.

  • Needed to be formatted differently as the text may not be legible with the 4 across format. I chose to change the layout to a z-pattern.

 
Hi-Fi Wireframes

Hi-Fi Wireframes

 

REVISIONS

Once I had the hi-fidelity wireframes completed, I wanted to assess if it would be functional and easy to navigate for the user. So I proceeded with final usability tests to identify key insights and receive user feedback regarding the redesign. After consulting with the team and drawing conclusions from the final tests, there were some final changes that I made to the user interface:

Navigation bar was changed to include 2 separate nav bars:

  • First navigation bar included the About Us page, Contact, Search bar, Sign in button, and cart button

  • Second navigation bar included the product categories

This was done to eliminate the extra step users would need to search for products.

Incorporating the company slogan/motto on the header of the Homepage proved to be ineffective in clarifying to users what service the company provided. Users also mentioned that the background header image failed to do so as well. So I revised the content and changed the images for the final website.

I added a signature showrooms section to provide products for main industries that Triton works within. I also included a top 25 picks slider to provide suggestions to users who may not know what they are looking for. From my experience working at Triton, many clients have asked for the company to provide suggestions that would fit within their budget. This would essentially do that and help users find new products.

 
Triton Promo website picture.jpg