BRND WGN BRND WGN

How to improve your website’s User Experience and gain more loyal customers

You can’t afford to get it wrong with your website. Your website must work well, speak for your brand and make your customers glad that they landed on it.

Your user experience is just as good as the groundwork you do before.

In today’s digital world, you can’t afford to get it wrong with your website. Surrounded by a plethora of online jargon and trends, all you want is a website that works well, speaks for your brand and makes your customers glad that they landed on it. That’s what will bring you those leads and conversions you’re looking for.

In this article we will explain the benefits of a well-crafted User Experience and how UX can work for your business.

Intro to UX Design
The BRND WGN Process

UX is the overall experience a user has when interacting with a product or service. The design aspect of UX often refers to the utility, ease of use and efficiency for a particular user’s interaction with a product or service.

* * *

Intro to UX Design

In its simplest form, User Experience Design (UX) is the process of creating products that provide meaningful and relevant experiences to users.

A person’s perceptions and responses resulting from the use and/or anticipated use of a product, system or service.

ISO 9241-210:2010, subsection 2.15

A key factor in UX design is enabling users to make their way through digital processes or products with minimal effort and maximum value. The field of UX design has significant importance in the digital environment, specifically in software development, website development and app development. The field of UX is ever-evolving and therefore its core definition is continually adjusting. With UX we are always concerned about users’ motivations. Why did they decide to leave the website? Why didn’t they check out? What information are they looking for? What solutions do they need for their problems? Understanding some of these concerns will enable us to tailor an experience that can ultimately satisfy their requirements.

Misconceptions of UX design

UX will incorporate all aspects of a user’s interaction with your brand, which will make or break the quality of the online product or service you offer – and consequently, the type of relationship you will manage to build with your customers.

The first misconception of UX design is that UX design is graphic design.

While UX Designers use graphic design in their work, a UX Designer’s main objective is to focus on the step-by-step experience that different types of users will encounter online.

Another misconception we often encounter is that UX design is web development.

Both UX design and web development have the final goal of creating a digital product that works well and makes your brand stand out, but the UX designer will be designing that experience, while a developer will have the technical expertise to actually bring it to life.

A UX designer acts as the connection between the Brand Team and Developers. As part of the UX design process, it’s extremely important for us to work as a team to understand business requirements and to keep aligning them with current and prospective customers’ needs and wants.

That’s how we can help a brand fully reap the benefits of UX design.

Benefits of UX

Brands are looking to put their customer experience at the forefront of their touch-points. Creating interactions that are relevant, easy, enjoyable and can translate into better ROI from that enhanced user experience. The importance of UX goes both ways, on the one hand it helps improve the overall user experience for a product or service, and on the other hand a good user experience increases the adoption of that product or service. 

A considerable influence of UX has helped the Accessibility sphere within the digital space. UX has helped by delivering smoother user experiences which include different users’ needs ranging from making sure a page loads quickly, to helping users with disabilities to perceive, understand, navigate and interact with the ever-evolving digital space, even making significant contributions to it. UX design is shaping the digital landscape of websites and applications. Through the use of UX design we are evoking different emotions from users. A well curated mix of UX techniques such as Journey Mapping, User Flows, User Personas and Information Architecture are all important to create a memorable experience for the user.

At BRND WGN we are user obsessed, that’s why our UX team primarily focuses on aligning the goals of the user with the goals of the business, with the overall experience based on 3 core pillars:
  1. Useful: UX must meet a user’s need and solve a problem. If it fails to do so, users won’t return. 
  2. Usable: Usability needs to be clear, so that users know exactly how to interact with you online. 
  3. Memorable: Once Usefulness and Usability couple up with good branding, that’s when a memorable experience can also set you apart from your competitors.

With UX, we keep what works and elevate it.

Making dramatic changes to a website’s UX can make the experience disorienting and frustrating. It’s important to minimise the user’s memory load by having common found elements in places they expect them to be. By keeping what already works, we can then apply subtle tweaks to elevate the experience whilst keeping users comfortable to keep exploring.

User Experience and Branding go hand in hand

UX and Branding are interdependent. You can’t have a great brand identity without a user experience which is just as good, and vice versa. Both Branding and User Experience are about perception – and both must be consistent for your customers to recognise your brand’s unique positioning and offer.

A solid brand identity will feature elements which are specifically tailored to work online and enhance the UX of a brand, while a solid UX will include those elements in the most effective way, so that your online presence can truly stand out.

Our teams work in a collaborative manner where UX designers are included in the early stages of the Brand Identity process, ensuring that nothing is overlooked.

UX vs UI: Key Differences

User Experience Design (UX) and User Interface Design (UI) are often thought to be the same discipline, but while they work in tandem, there are some key differences between the two.

Generally speaking, UX is concerned with the overall “feel” or “flow” of a product/service experience, while UI is concerned with the overall “look” of a product, working in harmony, to achieve the best final result. 

During the UX phase we are concentrating on research, behaviours, functional and emotional interactions throughout the user journey. We aim to answer key questions such as:

  • Why do customers shy away from a particular feature?
  • What stops them from scrolling down a page or navigating to another?
  • Why do they hover over a content section without clicking the Call To Action button?

On the other hand, UI design will cover all the visual and interactive elements of your interface, such as buttons, icons, spacing, typography, colour, ensuring they adhere to your brand identity while being pleasing to the eye.

Customers today are quick to judge a decision based on usability, and good UX design can determine whether or not your user will take the actions you want, such as becoming a lead, sending an enquiry, or making a purchase. UX defines where an audience wants to go and UI helps them get there.

It takes about 50 milliseconds (ms) – that’s 0.05 seconds – for users to form an opinion about your website that determines whether they’ll stay or leave.

From helping you identify your users’ ideal journey and solve problems they may currently be experiencing, to designing and developing your end product, the UX, UI and Tech team at BRND WGN can help. Some of our UX work will include Research results, Sitemaps, Low-fidelity Wireframes and Prototypes. UI work includes Moodboards, Design Systems, High-Fidelity Wireframes and Mockups.

* * *

The BRND WGN Process

UX can make the difference between a returning and a non-returning customer and can boost your online reputation in ways that impact your offline reputation too. The advantages of a good UX are enormous, but so are the effort, research and variables to consider before you dig into the work of creating it. 

That’s why we have refined our tried-and-tested process over the years, allowing both our team and our clients to know where they stand, which objectives we have and which actions to take from the beginning until the final website, in 4 steps.

Step 1: Discover

(Understanding the Needs / Market Research / User Research / Workshops)

When starting on a new project, business goals are an essential part of the UX process. Creating a new website or application, or even redesigning an existing one, must align with the agreed business strategy. One could make use of our Brand Discovery services during our BRND Strategy phase. Both our Brand and UX/UI teams apply Design Thinking principles at the forefront of every project. During the initial Workshop with the client it is important for the UX team to understand their target audience, their behaviour, goals, motivations and needs. At this stage the UX team puts themselves in the shoes of the end user, ensuring that a user’s experience is guided by empathy. At this stage we begin to understand the motivations and pain points that a user might experience. User research helps to remove the guesswork and allows our team to see the real challenges and expectations that people may have. Instead of making assumptions, actual data may help us make informed decisions to improve the overall success of the product or service. As part of our research process we leverage stakeholder objectives, changing consumer habits and the industry competition to develop and deliver the optimal product or service.

* * *

Step 2: Define 

(Journey Maps / User Flows / Personas / InformationArchitecture / Sitemap)

Using the research obtained in our Workshop, we leverage certain UX tools to consolidate the research insights into actual tangible outputs. The first tool in our process is a Journey Map.

Journey Maps

What are Journey Maps?

A Journey Map is a visualisation of the process that a user goes through in order to accomplish a particular goal. A journey could be seen as a timeline consisting of a series of user actions. Supporting this timeline are the user’s thoughts and emotions in order to create a narrative. These Journey Maps are user-specific with high-level phases that are made up of the user’s actions, thoughts, and emotions. To support this timeline we apply a section dedicated to opportunities in order to identify key areas where we can optimise the user experience.

Benefits of Journey Maps

Journey Maps prove to be very important on two fronts. Firstly, they help create alignment between the team and the client. Having a fragmented understanding of our users could be detrimental to the success of your business. Having this widespread vision of a user’s journey when using your product or service helps identify those key areas where customer experience can be improved. Also, Journey Maps provide a holistic view of your customers’ experience by showcasing moments of satisfaction and frustration in a concise way. When done successfully, they can enable us to address users’ paint points, mitigate fragmentation and provide an overall better experience.

User Flows

What are User Flows?

User Flows are a tool which help to lay out the user’s movement through the product, mapping out each and every step the user takes from entry point right through the final interaction. The flow is a compilation of the different avenues a user is able to take when participating in a specific task. A typical flow will always begin with the user’s entry point (i.e. your home page) and ends with a final action or outcome (purchasing a product, filling out a contact form, booking a Calendly appointment or signing up for a newsletter).

Benefits of User Flows

By interpreting these flows, our UX team can evaluate and optimise the user experience and therefore help increase conversion rates. Creating these User Flows will enhance the ease of movement through the product/service with no bottlenecks or added friction. Knowing there might be alternative routes for a user to complete the end task, User Flows allow us to convey these patterns and assess their efficiency. Our main priority is to design a product or service where users can easily flow through an interface without hesitation or confusion – which will eventually end up in higher conversion rates for our clients.

User Personas

What are User Personas?

A User Persona is a fictional yet realistic representation of a typical target user. Based on the research carried out in our Workshop phase, we create User Personas pinning down their needs, concerns, goals as well as background information; such as age, gender, behaviours, and occupation. It is important to differentiate between user groups or market segments and User Personas. The broad characteristics of a wider user group are often too impersonal and difficult to keep in mind when designing. In contrast a User Persona is an individual user derived from our research, whose needs are always addressed in our designs.

Benefits of User Personas

Knowing your audiences will help influence the features and design elements you choose, making your online presence more successful. Well-defined user personas will enable you to efficiently identify and communicate your customers’ needs. Personas will also help you describe the individuals who use your product, which is essential to your overall value proposition. Personas help with strategising and making smart design decisions. They make real users memorable for the UX/UI team, helping to focus efforts and build empathy.

Information Architecture leading to a Sitemap

What are Sitemaps?

Before the actual creation of Sitemaps we tackle the Information Architecture (IA) spectrum. Information architecture is the organisation and structuring of content across a website. Here, we stress the importance of having organised content so that users can effortlessly maneuver through the end product or service. IA is a blueprint of the design structure which can translate into sitemaps and wireframes of the project. UX designers use them as the basic materials to plan a navigation system.

Benefits of Sitemaps

Sitemaps bring a bundle of benefits when implementing Search Engine Optimisation (SEO) strategies. While a Sitemap will not directly increase your keyword rank on the search results, it will enable search engine tools to process content, information and data of a website more rapidly and accurately.

* * *

Step 3: Design

(Moodboards / Design Systems / UI Design / Prototyping)

With the User Experience (UX) architecture at hand, we are able to plan and deliver the UI. This is our time to group up and assemble the right team to kick off our internal brief, align on the delivery of goals and prepare to design all of the UI elements.

Moodboards

First, we create a visual map that helps frame our design thinking and recommendations for Online Typography, Colour Sets, Tone of Voice, UI Design Styles and UI Component Styles. A UI moodboard is a great way to set out the look and feel of a new design project without having to produce new work, instead, arranging carefully curated existing designs, colour choices, text styles and UI components to evoke the style that we’re looking for. It’s an incredibly effective way to communicate our ideas with the relevant stakeholders.

Design System

Over time, we’ve developed a unique Design System which will enable you to take full ownership of your brand and carry out these principles through the years. Our proprietary design system aims to be scalable and modular.

We like to think of Design Systems as the Single Source of Truth containing elements that help teams design, conceptualise, and develop enjoyable and consistent online products or services. Typical elements included in a design system would be design principles, typography, colour, layout, spacing principles, button design, iconography and reusable UI components. The design system is the basis of a shared language between designers, developers AND marketers. This shared language allows designers, developers and marketers to reuse images, buttons, codes and styles on the fly.

UI Design

UI design is a multidisciplinary field that requires UI designers to perform multiple roles in one. While UI designers need a keen visual eye, there’s also a psychological aspect that many don’t consider to be part of visual design. UI designers also have a crucial role to play in designing for accessibility and inclusion. From designing a suite of UI elements, such as buttons, icons, and scrollbars, choosing colors and typefaces, to regularly testing their designs through prototyping, UI designers carefully weigh up what each design choice means for the end user.

In the UI design of a website we take into consideration screen layout, transitions, interface animations and every-single micro-interaction. Any visual element, interaction, or animation must be designed. As part of our process when Building a Website, having the gathered data during the Define phase will help in making informed design decisions. As part of the UI team it is our priority to focus on aesthetics. Every single visual element needs to feel united both aesthetically and in purpose.

Prototype

Prototyping is an integral part of our design process for two main reasons;

  • Visualisation: prototypes help designers show stakeholders how the final product would look and function.
  • Feedback: prototypes are a useful internal tool to generate feedback from team members as well as stakeholders. Prototypes can also be used by potential customers who can interact with a near-final product and highlight the main pain points, which designers can address before the project moves onto the Development phase.

High-fidelity prototypes bring about many advantages, as these will be used to show the functionality and visuals of the product, so that it can be approved before the final hand-off to developers. Getting our clients’ feedback on a design before handing it off to our developers is crucial, as any changes or design errors will be expensive and time-consuming to fix once the coding has started. Testing a prototype isn’t just concerned with stakeholders input, but also considers the end user. If users are able to navigate the product well and accomplish the tasks you’ve set for them and they like the design, our process can proceed onto the Deliver phase.

Quoting Tom and David Kelley, from the IDEO design company:

A person’s perceptions and responses resulting from the use and/or anticipated use of a product, system or service.

* * *

Step 4: Deliver

(User Testing / Tech / Responsive Designs / Training etc)

Your website is the backbone of your business, supporting all your digital marketing efforts. There are different types of websites depending on the need. We can deliver 1-page marketing websites, themed websites, semi-custom websites and full custom website designs. Our Tech team aims to help brands with gaining a strong online presence, launching or testing out a new product, building dedicated landing pages, portfolio websites, e-commerce solutions and more

User Testing

During User Testing we strive to get real people with similar characteristics identified in our User Personas, to interact with a website, application or any other product we’ve developed to observe their behaviour and reactions. This type of testing is a necessary step to make sure we’ve built an effective, efficient and enjoyable experience for our users. Through user testing we aim to reveal areas of confusion or uncover potential opportunities to improve the overall experience.

Responsive Design

Responsive design means that a website’s content will adapt to different devices’ screens. We strongly value the importance of designing for different screens, so we present our designs in both desktop and mobile versions or any particular device our clients may request.

According to Global Stats Counter mobile web traffic has now overtaken desktop and makes up the majority of website traffic, accounting for more than 54%. Mobile devices have the capacity to provide users with numerous applications. Through the years we’ve been entrusted with the design and development of corporate websites, dashboards, casino screens and many more.

Training

Once your web presence is developed and looking great, we need to ensure that it is future-proof too. In order to support our clients in managing their website’s content in the longer run, our Tech team will set up a dedicated meeting so that you can familiarise yourself with the website’s Content Management System (CMS). This will allow you to input and edit content independently any time you need, be it a new tagline, address or opening hours, new products, media and more.

* * *

Providing the best possible user experience shows you care for your customers and are living up to your brand’s purpose, which will translate directly into brand success. The complex groundwork and elements to factor in require expert knowledge and business acumen. Trusting an expert team will make your online presence as effective as possible in the shortest amount of time, leaving no room for costly mistakes. 

Do you need to re-engineer your digital experience? Do you need help maximising your online engagement? Let’s chat.