Close
Close Close Close Close
Contact

Introduce a project

We’d love to hear about your project! Get in touch to get the conversation started.

Talk to us
01227 378 740
Drop us an email
hello@redbullet.co.uk

Artisan Directory

The Artisan Directory required a brand that conveyed organic, natural and handcrafted. Their brand needed to tie into their handmade artisan items at every level, from guidelines to websites.

Moodboard

Presenting our initial direction

We had a vision for the brand and where we wanted to take it! We created a mood board for the client with some rationale behind our vision. Getting the client on board before we commit any time was crucial as it allowed us to spend more time refining the brand.

Initial logo concepts

Presenting different route

We explored different visual routes for the logo mark. Experimenting with different typefaces and visual cues to help convey what they do. We presented these to the client to get their feedback.

Refine

Refining and pushing the logo further

The feedback was mixed and the client like different aspects of each logo, such as the simplicity of one and the handwritten of another. From this, we were able to craft a logo that had all the best aspects of our previous logos.

Testing

Ensuring it works in its environment

The logo will be predominantly used on their website. Around half of their users are on mobile devices, so we needed to ensure the logo was legible when small. We presented the final set of logos, testing how it works when small. This help aided the final decision.

Illustrations

Creating a visual language

Branding isn’t just a logo and colour pallet. We needed to bring in some illustrations which can be used across their site and social media. The difficult task was to ensure they paired with the style of their logo. The illustrations help convey what they do and create unique and consistent visual style that make them stand out from the crowd.

Brand guidelines

Defining the brand rules and standards

Once the brand aspects were signed off, we created the brand guidelines. We outlined how the brand should be represented. The guidelines can be referred to, ensuring there is brand consistency going forward.

Website

Using the brand in the real world

Once the brand was defined, we were able to create their website with its unique style. The use of natural colours, typography and illustrations worked well in tieing it into the handcrafted, natural and humanistic touch. Furthermore, the illustrations went the extra mile in conveying what they do and made the site stand out from its competitors.

Next project
Next project Next project Next project Next project Next project Next project Next project Next project

Gooey

Gooey, one of our digital partners, had an exciting brand makeover! It was our job to bring their brand to life with a slick, exciting and unique user interface that made them stand out in the digital market industry.

Brand

Expanding their vibrant brand

We explored how we can push the brand even further for their website. We defined the accessible digital colour pallet, icons and illustrations, creating brand consistency and impact.

User personas

Understanding target audiences

A persona workshop with Gooey was important at the start. We worked together to define who their users are, their goals, barriers and most importantly, key tasks on the site. Knowing key user tasks ensures the design is optimised toward making these as easy as possible.

Wireframing

Creating a blueprint structure

Wireframing involves planning out the structure of the site without focusing too much on layout and visual design. This allows you to quickly refine the pages, content and navigation early on. Getting the UX foundations right early on is key to any successful site.

Visual design

Thinking outside the box

Most websites have a white background. However, to make their exciting brand stand out from the crowd, we opted for the blue background. The coloured background allowed us to use multilayers, creating depth, hierarchy and also visual impact. The layers included a CSS gooey blob that animates, Gooey illustrations and white containers for long-form content.

Iconography

Making each service stand out

Gooey has 5 core services, so to make each one stand out, we assigned each one colour and shape, helping them are easily distinguished. This translated over to the case studies, so users can understand which service was used. Gooey’s sub-services were unique so we designed custom icons for them to help convey their offerings.

Improvements

Evolving the site to their needs

Since launch, we’ve worked with Gooey, to improve areas of the site. This included evolving the blog with more engaging components and brought through more imagery to make pages more engaging. We’ve also been working with Gooey as an SEO partner, bringing their expertise into our projects.

Next project
Next project Next project Next project Next project Next project Next project Next project Next project

Mountview

Mountview had some key challenges. Priorities included improving the user experience for student applications; build a more flexible CMS, and to create a platform to improve online sales.

Application Design

Booking flow was central to success

If we could carry users through the process better, and allow them to save as they go, we expected to see greater conversion and increased application numbers. We focussed on creating a solution that had these attributes.

Refine

Simplicity down to every detail

The booking flow was simplified to every detail. We removed any fields which weren’t essential, making the task less daunting. Fields were carefully thought out, making them easy to enter such as turning text fields into button options. Taxonomies and groups were carefully considered, ensuring they were easily understood. After refinement, the form was ready for visual design.

Component library

Systems not pages

We used a component design system approach to speed up site development, save time on content management and improve overall site performance. We also build our WordPress systems in the same way. Allowing the admins to create one piece of content once, and add it to any page, course or event as required.

The website

Putting it all together

Once we had all the components, we were able to quickly piece together all the pages with consistency and efficiency. The main benefit to having pre-defined components is it frees us up to easily test different layouts and user flows, ensuring each page is optimised towards the user goals.

In the first four months since launch, we saw an increase of over 20% in applications to our headline courses. We put this down, unequivocally, to the improved design and UX Red Bullet have brought to our website and application form.

Matthew Turnbull, Commercial Director
Next Project
Next Project Next Project Next Project Next Project Next Project Next Project Next Project Next Project

KCC Trading Standards Checked

Kent County Council were looking for a partner to give their Trading Standards Checked website a UX revamp from the ground up.

The problem

Not searching for traders

Kent County Council’s Trading Standards site was relatively new and had been building traction by gathering a list of registered traders. KCC had been working on social media campaigns to increase consumer traffic, however tracking showed that although users were clicking through to the site, they were not then searching for local traders.

Requirements

Understanding KCC’s business needs

KCC approached us because they wanted to expand and improve their reach to their second type of users: consumers. They wanted a partner to support them with campaigns and to improve consumer journeys once on the website. Previous efforts with the site focused on creating trader profiles. Readjusting the focus and structure of the site was a delicate balancing act because the two audiences are interdependent in terms of site success.

Part of our task was to look at the overall IA, user experience and branding so that we could better engage consumers with the listed traders. This in turn makes it a more attractive proposition for traders to register. KCC (like us!) were keen that the decisions for consumers were based on data and real user need, so we undertook a discovery phase to define the direction of travel.

The problem

Digging deep into user behaviour patterns.

We reviewed analytics by each audience segment to understand how consumers and traders were currently interacting with the site – and where the pain points, popular journeys and drop-offs were.

We then created a set of user stories for consumers that would act as an anchor point for future project decisions. Defining what users want to do – and why – was really key in understanding the various barriers and concerns consumers have when both selecting and trusting a registered trader. This insight fed into the site structure, taxonomies and key messaging throughout the user journeys. For example, we needed to plan for a range of users, they might be: planning ahead, in an urgent predicament, verifying a trader they’re already connected with or experiencing a challenge with a trader and therefore in need of support. Through the user stories we created a prioritised list of tasks, which provided a hierarchy for the layouts, call to actions and journeys to key content.

Site mapping

Visualising the structure

With consumers at different stages of the process of engaging with traders, we approached the structure chronologically: a preventative and educational section; a search area with a big focus on refining how users find a trader; and a help area for if things go wrong.

An important piece of our planning explored the search and filters. In particular to cater for a spectrum of consumers, depending on their level of clarity about the type of trader they actually need. It was crucial that we gave very fast direct access for those who felt clear whilst also providing hand-holding for those that needed it. We reviewed best practice examples across the sector to finalise the filter taxonomies to cater for user error or misunderstanding. Some users think in terms of the problem and some have keywords related to the solution in mind. For example, if there is water dripping down the kitchen wall – do we search for a roofer, a plumber, a builder – or perhaps a bucket?! The search needed to be powerful and super usable – as some users will also be in an emergency situation!

Wireframes

Mapping out the blueprint

To validate our initial research and planning, we create a rough structure to the site and admin panel, focusing on a seamless user journey through the content for users to reach their goals. We created a clickable prototype to test our ideas, helping us find issues early on without investing too much time into the visual details.

UI design

A website to suit two audiences

The website had two core audiences, traders and residents. We split the site into two core areas so they could focus on their specific goals. The residents’ area focused on finding traders information really easy and then getting in touch. The main way we did this was making the process as simple as possible. The traders’ area focused on selling the benefits of signing up and then logically placing calls to action in the right place.

UI design

Increasing the number of applications

To sign up to the platform, we needed to get a lot of information from the trader to help sell their service. We logically planned out all the information and grouped all related questions to help separate the form into manageable chunks. Each question was carefully thought out so nothing was misinterpreted. From this, we were able to match the question to the most efficient input method, automating the user’s input.

UI design

Ensuring data is easily managed

If the platform was hard to manage, they may not stick around as this would become an unessasary task. Therefore, it was vital that the admin area allowed the trader to easily view all their applications, see profile traction, update their profile and also upsell their account level. We tried to keep this as simple and as useful as possible, so the trader wasn’t overwhelmed yet could get the maximum out of it.

Component library

Creating the different variations

The forms were vital within this process, so we created a component library to help plan out all the different variations in the form. This ensured that there was consistency across the forms. Furthermore, it was vital to ensure we planned out all the validation and states to ensure users were educated and guided through the application form.

Testing

Validating our thinking

As soon as we had a robust prototype of all the screens, we ran first click user testing to validate our decisions. This is a valuable step before venturing into the build phase because it allows us to make quick and efficient iterations, based on real users’ feedback. We reviewed the taxonomies and were able to tweak some labels to further increase the distinction between sections of content. We also made some minor adjustments with some call to actions to minimise any chance of user frustration. It is always amazing to run user testing – with targeted questions we always get very useful results and it provides an excellent way to fine-tune.

Next project
Next project Next project Next project Next project Next project Next project Next project Next project

Basket app

Kent County Council were looking for a partner to give their Trading Standards Checked website a UX revamp from the ground up.

Our role

Defining the initial UX & branding for the mobile app

We were tasked with performing the discovery, branding and UX design of Basket with the browser extension to come at a later date. The app would be native across both IOS and Android and the front-end would be made in Flutter by their dev team.

For the UX – we championed the wireframes, user flows and information architecture for the app itself. For the brand – we crafted the messaging, tone of voice, logo, palette and typography.

Requirements

Understanding KCC’s business needs

KCC approached us because they wanted to expand and improve their reach to their second type of users: consumers. They wanted a partner to support them with campaigns and to improve consumer journeys once on the website. Previous efforts with the site focused on creating trader profiles. Readjusting the focus and structure of the site was a delicate balancing act because the two audiences are interdependent in terms of site success.

Part of our task was to look at the overall IA, user experience and branding so that we could better engage consumers with the listed traders. This in turn makes it a more attractive proposition for traders to register. KCC (like us!) were keen that the decisions for consumers were based on data and real user need, so we undertook a discovery phase to define the direction of travel.

The problem

Digging deep into user behaviour patterns.

We reviewed analytics by each audience segment to understand how consumers and traders were currently interacting with the site – and where the pain points, popular journeys and drop-offs were.

We then created a set of user stories for consumers that would act as an anchor point for future project decisions. Defining what users want to do – and why – was really key in understanding the various barriers and concerns consumers have when both selecting and trusting a registered trader. This insight fed into the site structure, taxonomies and key messaging throughout the user journeys. For example, we needed to plan for a range of users, they might be: planning ahead, in an urgent predicament, verifying a trader they’re already connected with or experiencing a challenge with a trader and therefore in need of support. Through the user stories we created a prioritised list of tasks, which provided a hierarchy for the layouts, call to actions and journeys to key content.

Site mapping

Visualising the structure

With consumers at different stages of the process of engaging with traders, we approached the structure chronologically: a preventative and educational section; a search area with a big focus on refining how users find a trader; and a help area for if things go wrong.

An important piece of our planning explored the search and filters. In particular to cater for a spectrum of consumers, depending on their level of clarity about the type of trader they actually need. It was crucial that we gave very fast direct access for those who felt clear whilst also providing hand-holding for those that needed it. We reviewed best practice examples across the sector to finalise the filter taxonomies to cater for user error or misunderstanding. Some users think in terms of the problem and some have keywords related to the solution in mind. For example, if there is water dripping down the kitchen wall – do we search for a roofer, a plumber, a builder – or perhaps a bucket?! The search needed to be powerful and super usable – as some users will also be in an emergency situation!

Prototyping

Creating a list

One of the main user flows in basket is creating a list. This was one of the iterations we came up with in order to do this. The necessary information we needed to capture from the user included: List name, list type & description.

Prototyping

Sharing to basket

Another flow that we needed to figure out was how to add a product to Basket from both inside and outside the app. This used the native “share” feature on both IOS and Android, and we needed to design what this flow looked like. This is an interaction of how we envisioned this would work.

Next project
Next project Next project Next project Next project Next project Next project Next project Next project

Haulfryn Group

Kent County Council were looking for a partner to give their Trading Standards Checked website a UX revamp from the ground up.

The challenge

Haulfryn’s business needs

Haulfryn needed a partner agency to help them redefine their digital presence. This included creating websites for their Residential sales, Holidays and Holiday homes sales offerings. They also had a number of satellite sites that needed to be designed for surrounding parts to their business. These included their: Fitness, Food & Beverage, Spa & Wellness & upper market offerings.

Requirements

Understanding KCC’s business needs

KCC approached us because they wanted to expand and improve their reach to their second type of users: consumers. They wanted a partner to support them with campaigns and to improve consumer journeys once on the website. Previous efforts with the site focused on creating trader profiles. Readjusting the focus and structure of the site was a delicate balancing act because the two audiences are interdependent in terms of site success.

Part of our task was to look at the overall IA, user experience and branding so that we could better engage consumers with the listed traders. This in turn makes it a more attractive proposition for traders to register. KCC (like us!) were keen that the decisions for consumers were based on data and real user need, so we undertook a discovery phase to define the direction of travel.

The problem

Digging deep into user behaviour patterns.

We reviewed analytics by each audience segment to understand how consumers and traders were currently interacting with the site – and where the pain points, popular journeys and drop-offs were.

We then created a set of user stories for consumers that would act as an anchor point for future project decisions. Defining what users want to do – and why – was really key in understanding the various barriers and concerns consumers have when both selecting and trusting a registered trader. This insight fed into the site structure, taxonomies and key messaging throughout the user journeys. For example, we needed to plan for a range of users, they might be: planning ahead, in an urgent predicament, verifying a trader they’re already connected with or experiencing a challenge with a trader and therefore in need of support. Through the user stories we created a prioritised list of tasks, which provided a hierarchy for the layouts, call to actions and journeys to key content.

Wireframing & Prototyping

Bringing it to life

After defining the site maps, we moved on to the low fi wireframing stage creating layouts, components and user flows for all the sites. Designing for both mobile & desktop, this is where we established a visual guide for how they would look.

Prototyping

Testing that the user journey is smooth

We tied the wireframe screens together, prototyping every button, action and transition to get a feel for the real life product. This was beneficial as we were able to test the flows of the product, ensuring it was efficient, smooth and easy to use.

Prototyping

Creating a list

One of the main user flows in basket is creating a list. This was one of the iterations we came up with in order to do this. The necessary information we needed to capture from the user included: List name, list type & description.

UI Design

Down to the details

After nailing the skeleton of the sites, we then moved onto the high fidelity stage, introducing the refreshed brand palette, typography and refining details such as imagery and components.

Teams and organisations who are looking for a creative digital partner. Quick flings are exciting but we all love long term relationships. We work across all sectors, but have huge experience in property, healthcare, sports, education and finance.

Sarah Chadwick, Head of Digital @ Haulfryn
Next project
Next project Next project Next project Next project Next project Next project Next project Next project