Beyond

Bleep 360 Care Website ReDesign

Using Design Thinking to Create a Better Website

Part 1: The Challenge

Background

Since its inception in 2018, Bleep 360 Care has carved out a significant place for itself as a quality provider of health and social care services, with a dedicated focus on enriching the lives of its service users and assisting them in realising their full potential. This is accomplished by continuously challenging the conventional boundaries of what is possible and striving for the extraordinary.

In the current competitive landscape of the care market, major competitors such as Salutem Care and Education, HCRG Care Group, and Active Assistance, necessitate that Bleep 360 Care consistently delivers a user experience that is unparalleled. My role as a UX designer has been centred on crafting both online and offline interactions that are not just functional, but truly remarkable for our service users.

Problem

Recognising a gap between Bleep 360 Care’s existing website and their authentic brand identity, the team decided to embark on a journey to reflect their people-first ethos more accurately in their online presence. This journey entailed diving deeper into the needs and expectations of their audience, leveraging these insights to breathe life into a more engaging and resonant digital experience.

Two crucial objectives steered the direction of our redesign efforts: 1) Enable users to effortlessly access information on services, and 2) Facilitate a smooth referral submission process. As a UX designer, I understood the importance of structuring these user journeys in a way that was intuitive, satisfying, and sustainable.

This necessitated a thorough re-evaluation and re-design of the website’s information architecture, to ensure content was organised effectively and logically. Enhancing user experience was the top priority, particularly for our primary user groups: Payers and Funders (e.g., ICB, Local Authorities) and Referral Partners (e.g., GPs, Hospitals, Local Authorities). Through this redesign, we aimed to cultivate an online environment where these user groups could seamlessly navigate and accomplish their tasks, aligning with Bleep 360 Care’s commitment to putting people first.

 

Old Website

Scope

At the outset of the Bleep 360 Care’s website redesign and development project, I initiated the process with a thorough user research. Using tools like paper, markers, and Miro, I brainstormed and documented user needs and expectations, thereby laying the groundwork for the subsequent design decisions. Drawing insights from this research, I then built the information architecture of the website to ensure a seamless and intuitive user journey.

Following this, I established the content strategy, determining what type of content would best engage users and fulfil the website’s objectives. To implement this strategy, I took on the role of copywriting, creating compelling and clear content. I also incorporated the use of AI-based tool ChatGPT to assist with content generation.

Next, the visual design of the website was taken into consideration. Using Figma, Adobe Photoshop, and Illustrator, I created designs that resonated with Bleep 360 Care’s brand image and enhanced user experience. These designs were then brought to life during the website development phase, using WordPress as the primary development platform.

As a final step, I executed rigorous testing to ensure usability and functionality of the website.

Throughout the project, Confluence proved to be an invaluable tool for project management and documentation, keeping all tasks and progress transparent and organised.

Part 2: The Process

Using the design thinking methodology, I’ve conducted a one-week design sprint. This include the 5 stages – empathise, define, ideate, prototype and test. Upon launch, we will be able to validate the solution through testing and revisions so as to complete the process.

Step 1: Empathise

As part of my commitment to designing a superior user experience for Bleep 360 Care, I partnered with a healthcare professional to conduct an exhaustive competitive analysis. This analysis involved auditing the websites of primary competitors including Salutem Care and Education, Pulse Community Healthcare, Voyage Care, LifeWays, Active Care Group, TheKeysGroup, and Achieve Together, enabling us to pinpoint their strengths, weaknesses, and opportunities for innovation.

What we observed was a common theme of suboptimal information architecture, convoluted user journeys, and outmoded visual designs plaguing many of these competitor sites. Nevertheless, a few competitors, such as Active Care Group, stood out, showcasing a modern visual design, engaging video banners and an effective information architecture.

To make our analysis more robust, we simulated the experience of our typical users by performing five key tasks on each of the competitors’ websites. These tasks are essential to our users and representative of their needs:

  1. Access information on services
  2. Locate facilities and contact information
  3. Submit referrals
  4. Explore job opportunities
  5. Request a quote or funding information

 

These site visits allowed us to empathise with our users’ journey and inform our design approach for Bleep 360 Care’s website, with the ultimate goal of creating an enhanced, seamless user experience.

Step 2: Define

Task Process
  • Access Information on Services – [Discovering service offerings] > [Submit a referral]
  • Locate Facilities and Contact Information – [Find details] > [Submit a referral/General Contact]
  • Submit Referrals – [Find referral programme] > [Submit referral] Needs work – see competitors
  • Explore Job Opportunities – [Explore Jobs] > [Apply] Internal & External

  • Request a Quote or Funding Information – [Request information] > [Submit form]

As part of our design thinking process, we utilised the powerful tool of experience mapping in Miro. This tool provided us with a landscape akin to an affinity diagram, honing in on patterns, trends, and gaps in the user experiences offered by different competitors. This approach enabled us to isolate shared pain points, successful design elements, and ripe opportunities for innovation.

To kickstart the process, I began by collating the most critical or impactful insights derived from our competitive analysis and site visits. This data formed the foundation for our experience map. We then conducted a workshop to gather rich user experience data, which we represented on the map using colour-coded sticky notes, each colour corresponding to a specific competitor.

Each primary column on our experience map stands for a task (indicated by a yellow sticky note) and is further split into two stages (highlighted by blue sticky notes): the initiation and the execution of the task. This framework allowed us to comprehensively visualise the user journey across different tasks and competitors, thereby informing our design decisions for Bleep 360 Care’s website.

In crafting the design strategy for Bleep 360 Care, my focus was on creating an engaging, accessible website tailored for Payers, Funders, and Referral Partners. The site aimed to provide comprehensive service details, simplify referrals, offer an intuitive facility locator, and showcase job opportunities.

Key Focus:

  • Primary Audience: Payers, Funders, and Referral Partners.
  • Services Highlighted: Complex Care, Domiciliary Care, Supported Living, Crisis Circuit Breakers, Transforming Care, Bespoke Care.
  • Design Principles: Emphasised Bleep 360 Care’s brand colours and clean, innovative aesthetics for user appeal.
  • Homepage: Featured dynamic video banner, prominent contact number, and ‘Make a Referral’ option for a clutter-free interface.
  • Services Pages: Detailed information, visuals and a service-specific facility locator.
  • Referral: Integrated contact form and callback service for easy submissions.
  • Job Opportunities: Dedicated page with search functionality and options for online applications.
  • Accessibility: Prioritised readability, clear layouts, high-contrast colours and user-friendly features for accessibility.
  • Additional Features: Social media buttons and testimonials for engagement.

 

Testing and Optimisation:

  • Rigorous testing on various devices and browsers for compatibility.
  • Optimised website speed, performance and ensured adherence to WCAG standards.

 

Launch and Maintenance:

  • Produced a launch video for promotion.
  • Utilised multiple channels for site promotion.
  • Planned regular content updates, job postings, and news.
  • Continuous monitoring of analytics and user feedback for ongoing improvements.
Persona Board

Here is an exhaustive list of our target audience, divided into two groups – primary and secondary. Each group is organised by their level of priority:

Primary Audience

  1. Payers and Funders (e.g. ICB, Local Authorities)

  2. Referral Partners (e.g., GPs, Hospitals, Local Authorities)

 

Secondary Audience

  1. Service Users (Patients and Clients)

  2. Health and Social Care Professionals

  3. Family Members and Caregivers

Utilising the rich insights gleaned from user feedback sessions, I leveraged Canva’s persona board to craft a variety of user personas. I designed primary personas, namely Payers and Funders and Referral Partners, as well as secondary personas, which encompassed Service Users, Health and Social Care Professionals, Family Members, and Caregivers.

As our understanding of our users deepens through continuous testing and data collection, these personas will not remain static. They are dynamic templates, open to refinement and recalibration. This iterative process will ensure that our personas remain valid and relevant, and most importantly, accurately reflect our users’ evolving needs and behaviours.

Part 3: Ideate

In the process of planning a complete redesign for the website, it is crucial to comprehend how users navigate inner pages from the main menu, homepage, and footer. Consequently, my sketches for the site map eventually led to a more intuitive and streamlined structure.

To ensure a thorough consideration of the sitemap, I created task flow sketches outlining the steps that the primary persona (Integrated Care Boards, Local Authorities, and other stakeholders involved in service referrals/applications) and the secondary persona (candidates) need to complete to engage with the Bleep team. These sketches guided me in analyzing all the necessary tasks and identifying opportunities to streamline the process, reducing the number of clicks required for each task to enhance efficiency.

Design Inspired by Fantasy Interaction

The clients drew inspiration from the innovative design of the Fantasy website (https://fantasy.co/) and requested a similar approach for their project. As a UX designer, this presented an exciting challenge to interpret the elements that captivated the clients and seamlessly integrate them into the new design. I approached this task by meticulously analysing Fantasy’s user interface, focusing on user interactions and visual cues, ensuring that the final design not only mirrored the inspiration but also prioritised a user-centric experience.

Instead of traditional sketching and wireframing methods, I employed the Fantasy.co website’s structure as a reference to design the project. By studying the layout, navigation, and user interactions of Fantasy.co, I adapted and integrated similar elements into the new design. This approach allowed for a streamlined process, leveraging an existing, successful framework to create a user-friendly and visually appealing design, saving time and ensuring alignment with the client’s vision.

Part 3: The Solution

View the live website here

Final Thoughts

In reflecting on this project, I find great satisfaction in the synergy between user experience principles and the client’s vision. By utilising the innovative structure of Fantasy.co as a foundation, we crafted a website that not only met the client’s expectations but also provided a seamless and intuitive experience for their users. Integrating elements inspired by Fantasy.co allowed us to strike a balance between creativity and functionality, ensuring the design not only looked appealing but also functioned seamlessly. Witnessing the client’s enthusiasm as they saw their vision come to life through a user-centric design reaffirmed the power of UX principles in creating meaningful digital experiences. This project highlighted the importance of leveraging successful design paradigms while tailoring them to specific client needs, resulting in a project that I am genuinely proud of, both in terms of aesthetics and user engagement.