CirrusLED® 

Design a digital signage software company website for a better user experience.Seeing through the customer’s eyes and designing the website interface according to the research result

Digital signage is a huge market – many organizations either have already adopted it or are planning to soon. It is a powerful visual communication tool that engages audiences, improves efficiency, and reduces operating costs. With digital signage, businesses can streamline communication with their employees and customers. This improves engagement, productivity, and profits.

Cirrus LED was built on the idea of creating a better, more cost-effective way of engineering and manufacturing high-quality, cutting-edge modular display systems for outdoor digital signage.

The client reached out to me and asked me to design a website that aligns with users’ needs and provides a better user experience. So, I set out to fix the usual users’ typical issues by developing Cirrus LED site with an interactive layout and user interface.

After getting the overview of the problem, I stepped into the findings of the user’s pain points.

Cirrus LED website must fit all screen resolutions and provide a better user experience. I must ensure that the website is functional, intuitive, reliable, user-friendly, and easy to navigate. These factors increase the pleasurability of interacting with the site and make browsing a more pleasant experience.

Role

Role

Role

UX/UI Designer

UX/UI Designer

UX/UI Designer

Timeline

Timeline

Timeline

Jannurary 2023 - April 2023

Industry

Industry

Industry

E-commerce

E-commerce

E-commerce

Revenue

Revenue

Revenue

$1.578 billion (2019)

$1.578 billion (2019)

$1.578 billion (2019)

Company size

Company size

Company size

5,000+

5,000+

5,000+

Objectives

The main objective was to build a website where users could view the products and estimate their ad revenue.

Design the website from scratch and incorporate smart solutions by learning directly from the users - what/why they use the website for, what is causing problems, what are they looking for, etc.

Make sure that it is an easy-to-use web application and the customer experience is built for convenience. In addition, Users should find the process simple and intuitive.

The proposed website design should also meet several dimensions that enable the essential services and enhance users’ experience.

I also wanted to use a few predictive technologies to help users find important contextual features. The concept will address the user’s pain points, resulting in a better experience.

Challenges

The main challenge was to understand the user flow; since I designed the website from scratch (not redesigned), there were no existing users.

Create a design better than existing/competitors’ websites that attract users through a simple and accessible experience.

Figure out the ways to enable users to understand the website at a glance and easily achieve their goals.

35%

Improved onboarding process

25%

Increase in user retention

84%

Increase in time spent on website

Stack

Stack

Stack

Process

01

Discovery

02

Define

03

Design Process

04

User Testing

Discovery

Discover and Understand

The first step in a website design is the understanding phase. I started by studying the existing similar websites. I then identified the areas that need improvement and introduced enhanced solutions.

Competitor analysis

To understand the competitive landscape and site architecture, I looked at direct competitors like Optec, lighthouse-tech, Lcf-led, silicon-core, vantage-led.

The competitive analysis helped me validate my hypothesis and see what competitors are doing in the current market. In addition, data from competitive analysis and user research will help me identify user pain points and gaps in existing solutions that I may not be aware of.

To better understand users’ needs and pain points, I defined a series of questions and researched the problem.

  • Which competitors address user pain points?

  • What are the competitor’s strengths and weaknesses?

The goal was to compare and identify common features across the competitor’s websites.

Findings

  • Use a sentiment selling approach.

  • Make an open-content layout. Build zero to no hidden content on the products page.

  • Highlight key product features.

  • Highlight Social proofs such as case studies and top brand clients.

The most important takeaway from this activity was learning how different websites organized their content and the overall layouts.

User & Audience

The property owns and entrepreneurs who want to make more money with advertisement.

Market research

It is essential to get a big picture of the market to understand what we don’t know yet, the recent trends, rules & Regulations, news, etc.

Growing market & Scope

Digital signage used in public venues has a broader reach, with up to 10% of American residents aged above 12 seeing the content compared to 41% on Facebook or 43% on the internet.

The global digital signage market reached $23.5 billion in 2021. It should see a CAGR of 6.3% between 2022 and 2031, reaching $63.3 billion by 2031.

The adoption of digital signage solutions is on a steady rise, with 60% of enterprises without digital signage in their stores planning to invest in the technology within the next two years.

80% of brands that use digital signage record an increase in sales, up to 33%, with a greater appeal towards epicurean product purchases instead of planned purchases.

Define

User Research

I conducted qualitative information research and quantitative data research to better understand users' needs.

Research enabled me to dig deep into my understanding of users – not only their immediate frustrations but also their hopes, fears, abilities, limitations, reasoning, and goals.

User Interviews

I conducted in-person interviews with targeted users to better understand under what circumstances they will trigger issues and how effective the existing solutions are. I also figured out why they use the competitors’ websites, what they look for, what they need, trying to learn and understand their user experience and pain points.

During interviews, I gathered qualitative data about their goals, needs, frustrations, and motivations. Here are the questions I asked during the interview:

  • What kinds of issues are you facing right now?

  • When interacting with digital signage websites, what are some of your most significant pain points or gripes?

  • How would you describe your typical experience with a digital signage website for a seamless experience?

  • What do you think can improve the overall journey and experience?

The qualitative information research helped me confirm invalid assumptions about users and their expectations regarding the website.

Qualitative information research

Firstly, I performed qualitative information research to give myself some direction. For example, I find out how often users have encountered difficulties performing different tasks. What are their current pain points, fears, and needs? I also figured out what motivates or demotivates them from using the competitors’ websites.

Quantitative data research

After qualitative information research, I performed Quantitative data research to learn user behavior.

Findings from interview

  • All participants stated that they often visit digital signage websites on smartphones, but unresponsive designs cause difficulties.

  • Most of the time, the product pages take a long time to load.

  • No policy and social proof were mentioned; hence the customers were afraid to do the business for the first time.

Persona

I developed a user persona to address the major needs of the targeted audience. Persona would guide the process and evolution of developing user flows. I referred to it throughout the entire designing process.

Name

John

Age

35 years old

Job

Pizza Shop Owner & Baker

Location

Brooklyn, NYC

Bio

John is a young professional baker and entrepreneur. Enjoys watching cooking channels and often experiments with recipes. John is a tech savvy. John is looking for an efficient way to display special offers to his regular customers and potential customers.

Goals & Needs

  • Display special offers on the window of the shop where they are fully visible to the potential customers that are passing by.

  • Affordable device or display.

  • Makes quick updates or adjustments to the poster suck as correct typos, update photographs, update special offers etc.

  • Have a way to automatically update content such as schedule for a certain time or period such as holidays.

  • Wishes to captivate the attention of people passing by since the restaurant is located on a rather busy street.

Frustrations

  • Having to constantly print and replace posters.

  • Posters leave glue marks on the window which take some time to be fully cleaned.

  • Needs a device smaller than a TV screen but larger than a tablet.

  • Traditional TVs don’t allow people to view the content if the display is in direct sunlight.

  • Printed media lacks movement and easily blends into the background no matter how colorful and visually attractive it is.

Brainstorm

I promptly designed a user flow diagram, keeping the interview users and different scenarios in mind, to understand how users will navigate through the website and browse product subscription, industry, and resources pages. This helped me align the website’s goals and prioritize the essential features in the prototyping phase.

Card Sorting

Restaurant

fast food

fast food

food

drive-thru

drive-thru

takeaway food

coffee shop

coffee to go

drinks

drinks

winery

bakery

bakery

Entertainment

comedy club

comedy club

sport events

sport events

movies

movies

food festival

open mic night

open mic night

amusement park

theater

theater

concerts

video games

video games

User Flow

Homepage

Products

Subscriptions

Industries

Resources

About

Blog

Digital billboards

Digital signs

Outdoor

Indoor

Screenhub

Book a call

User Journey Map

I analyzed and mapped out the user journey to find the redundancies in the competitors’ websites and see how I could simplify their journey and help them reach their most important goals. I constantly referred back to the customer journey map and user flow diagram as I sketched out concepts.

Scenario

John wants to update data on posters that are hanged around the shop. Since the shop is located on a busy corner street, John hangs 3 posters visible from the outside and another 4 visible inside.

Expectations

Posters need to be visible, have an easy-to-read text, bright colors, no typos, correct prices.

Phase

Activity

Thought

Emotion

Opportunity

placing an order

Receiving order

Updating the price

Drop old poster

Putting up new posters

Gets in touch with local agency and asks for a poster design.

“I need to go pick up the order. I can also ask them to deliver it.”

Gets in touch with local agency again, as there was a math error in the final price.

Needs to take down the current posters, wash the glue and hand prints off the window.

Uses transparent tape to glue the new posters on the windows.

“I like working with this agency. Customers notice the posters they design.”

“I need to go pick up the order. I can also ask them to deliver it.”

“I forgot to double-check. Now I have to reprint everything.”

“I need to do this before I open the shop. I wish there was a faster way to do this.”

“The sunlight might make the poster hard to read. The colors might also fade away.”

Show available locations based on work place.

Allow the agency to upload the poster on the app. Allow the user to preview it.

Provide reviews of previous attendands.

Provide transportation options.

Help carry up luggage at no extra cost.

Design

After specifying the issues and analyzing each pain stage, I was prepared to produce solutions. I was also able to think about what design principles are important to carry through the product.

Sketches

I quickly developed how the potential solutions address the user’s needs using sketches.

Wireframe

I started building screens, buttons, and all sorts of other artwork, trying to create something that looks clean, modern, and simple to use. Then I defined functionality, content, and navigation through wireframes.

I designed the wireframes for product subscription, industry, resources, homage pages, blog, and about page to visualize the layout of the overall website. It helped me conceptualize the basic blueprint of the website early in the design process.

Prototypes

I created clickable prototypes using AdobeXd, maintaining interaction and visual consistency to communicate the design strategy effectively. This is considerably quicker than diving into the complex website build.

Test

I conducted usability testing with ideal users to verify the design and quantitatively review the usability assumptions.

To measure how ‘usable’ the website is, I measured three things:

  • Effectiveness - Whether users can complete a task;

  • Efficiency - How long it takes them to complete a task;

  • Satisfaction - How users feel about the task.Learning about the target user’s behavior and preferences.

The outcome of the usability testing

My prototype tested exceptionally well during the last round. Users were thrilled by such an accessible way to find relatable information and enjoy a seamless browsing experience.

Projects outcomes

Coming out with a design based on user research helped me understand a lot. So luckily, I designed a responsive, simple-to-use, and interactive website for Cirrus LED to make user’s life more delightful.

I followed a light design style because I wanted the project to come off friendly and ultimately not give off a technical “database” vibe. Instead, the design will give users a familiar and delightful experience.

Reflection

A quality and simple-to-use site can make a world of difference between a customer browsing and a customer purchasing. A simple, intuitive website design lets customers comfortably browse on any device.

“Beauty” is a highly subjective assessment. However, when it comes to web design, “good looks” usually mean a convenient layout, aesthetically pleasing typography and iconography, crisp visuals, and other on-site design elements that differentiate your site from competitors.

Let's talk

Let's talk

Let's talk