Skip to main content

Fostering human connection for Breakthrough T1D

Creating a user interface design to inspire, support and foster human connection for everyone living with type 1 diabetes.

Two people in blue shirts embrace each other warmly

Breakthrough T1D charity website redesign overview

Breakthrough T1D (formerly JDRF) is a global charity leading world-class research to treat and cure type 1 diabetes. The cause actively promotes and campaigns for better treatment and support for everyone living with and connected to the condition.

As a phased project, we first deployed a new website to address immediate needs for JDRF in August 2023, inputting user-led insights and a defined site structure from existing research into our redesign and rebuild project. We knew we needed to create a flexible website that could adapt and change for an upcoming rebrand. In October 2024, we worked together to reskin and update the website, maintaining brand consistency, positioning and image.

The website redesign for Breakthrough T1D works to raise awareness, build trust with users, drive engagement and loyalty, and provide fundamental information, guidance and support to those connected to and living with type 1 diabetes.

Working with Pixeled Eggs’ expert team of designers and developers has felt like a true partnership.

Kate Lawton, Head of Digital at Breakthrough T1D

Client challenge

Type 1 diabetes is a serious autoimmune condition that impacts the lives of over 8.7 million people worldwide. In the UK alone, over 400,00 people live with this condition. As a global charity on a mission to cure type 1 diabetes, Breakthrough T1D is often the first online source of information for people connected to type 1 diabetes, including newly diagnosed people, scientific researchers and healthcare professionals. Therefore, a feeling of reassurance and support is essential, whilst also acting as a trusted expert in the field.

Before starting the Breakthrough T1D charity website redesign project, the team at Breakthrough T1D had conducted extensive user research with the in-house team and another agency (93 Digital), providing valuable feedback from over 1,200 participants.

Designed to educate and inform, the legacy website had become overwhelming and hard to navigate for visitors. The research formed the foundation for the new website and identified key user experience and usability insights:

  • With a diverse audience, from people living with the condition and their friends and relatives to healthcare professionals, researchers and policymakers, the charity’s website needed to appeal to all levels of knowledge and user needs.
  • With over 1,100 pages the site had become confusing and overwhelming. Users were finding it difficult to locate the right information, and the content was failing to meet their varying needs.
  • The website lacked visual appeal and contained long walls of text. The in-house team were struggling with limited content formats that lacked visual distinction.
  • With user research, information architecture, wireframing, a technical discovery, and an SEO strategy complete, the in-house team created a product and content strategy. This all needed to be incorporated into the site re-platform and build.
  • In addition, the global brand was being reviewed and updated. Formerly known as JDRF (Juvenile Diabetes Research Fund), the charity had evolved to support everyone living with type 1 diabetes and a complete rebrand was on the way.

Based on our extensive charity website experience and our commitment to making a positive impact, Pixeled Eggs was chosen as the agency partner to undertake the redesign and development of the new website. Our expertise in meeting specific requirements, along with a focus on both users and organisation goals, played a key role in this selection.

Our design and development approach

Using our own user experience (UX) knowledge and expertise, we got to work immersing ourselves in the comprehensive UX research insights and requirements. These strong foundations helped to shape our creative process for the new website design and development project.

We took a phased approach, first updating the website with the immediate needs and requirements in mind: Relaunch it on a modular, easy-to-use content-managed system with a responsive and accessible visual design. With an upcoming rebrand, we built the site on a flexible system that would allow it to adapt and expand, meeting future requirements whilst maintaining consistency and design integrity.

  • As experts in the digital industry, we collaborated with Kate Lawton, former Head of Digital at Breakthrough T1D, to develop the initial approach and structure for the digital rebrand. Additionally, we acted as a sounding board to review the SEO migration plans, ensuring the strategy would generate satisfactory results.
  • We needed to remain faithful to the original user research and outputs defined to ensure we made the most of this investment and the user insights generated. Pixeled Eggs applied the complex technical and UX requirements and outputs combined with best-practice build techniques to build a robust, well-performing website that met the user requirements and organisational objectives.
  • We worked with a panel of testers, specifically with type 1 diabetes, bringing the end-user along the full journey to ensure relevancy and a website experience that would create connection and build trust and loyalty. Testing designs before launch helped us measure and understand perceptions of the new brand positioning, ensuring it would land with the right intent.
  • Pixeled Eggs thoughtfully interpreted the existing brand book, reflecting on challenges identified from testing to create balance in Breakthrough T1D’s human and clinical aspects. We established a connection between emotive positive imagery and strong branded elements to deliver a human-focused feel with the clinical gravitas and impact of the brand. This created a feeling of community, human connection, and warmth.
  • To enhance the website user experience and engagement, we created a user interface (UI) that prioritises ease of use for everyone, regardless of needs. Our main goal is always to produce a ‘silent’ platform to bring content to life, communicate a message and deliver results for visitors and organisations alike. We carefully considered font weights and sizes to ensure effective messaging and a natural flow of content. This approach creates a visual distinction between various content types, blending insightful modules with visual cues and clear calls to action. This design method enables users to navigate and explore relevant and meaningful content throughout the site.
  • To ensure relevance and always-on support, we built the website on a mobile-friendly and responsive framework, prioritising accessibility within all of our designs to ensure everyone could access and benefit from the work of Breakthrough T1D.
  • Through strong project management and forming a trusted relationship, we worked together to address the challenges that can arise from a global rebrand. Shifting timelines and approval processes with international affiliates required a flexible and accommodating style to ensure we could deliver on time and within budget.

We collaborated with the team at Breakthrough T1D to minimise the rebrand’s impact on both the end users and the charity. Done well, a digital rebrand ensures that the brand is presented beautifully with visual impact, meaningful storytelling, and messaging and a technically robust transition, including consideration for content migration and technical SEO.

Pixeled Eggs produced an attractive new design that fully aligned with our new brand while remaining faithful to our original user research. Our experience was yet again highly positive; the whole team supported us to find a way through some development challenges, provided efficient project management and a warm and professional partnership throughout.

Kate Lawton, Head of Digital at Breakthrough T1D.

The results

For the Breakthrough T1D charity website redesign, we created a highly responsive, mobile-friendly and accessible visual design that reflects a strong foundation in scientific research while also conveying warmth, emotional connection and support for people connected to and living with type 1 diabetes. The new website will enable Breakthrough T1D to define its position, expand its reach, and enhance audience engagement.

The updated website design strengthens Breakthrough T1D’s brand position as a trusted source of expert information with a human focus, providing comfort and reassurance during times of need. It also supports and provides scientific-level research and insights to healthcare professionals and experts.

The website redesign and improved user interface have created a high-quality experience that is appealing to all users, from scientific researchers to people living with the condition, carers, and healthcare professionals.

Since the charity website launch, Breakthrough T1D has received positive feedback about the website design and user interface. One notable instance involved a newly diagnosed individual who emailed to express gratitude for the supportive information and felt inspired to donate and become a supporter the same day. This was based on everything from the “wonderful design” to brilliant experience and support. This is a testament to the website supporting both organisational and user needs.

The new Breakthrough T1D charity website redesign has met or exceeded organisational key performance indicators:

19.6% increase in user engagement

Grade A website performance

57% to 90% accessibility score

18% increase pages per session

52% increase in session duration

18% increased engagement time

The technical details

The project followed our defined process to create a robust system with a user-focused approach to website design and development.

  • WordPress modular CMS

    • WordPress CMS build allows website administrators to manage and maintain content easily.
    • The modular approach provides editors with the flexibility to create and manage content while retaining the consistency set in the design system. 
  • Third party integrations and analysis

    • Third-party integrations include DotDigital and Bolt for fulfilment.
    • Data tracking and insights are gathered through tools including GA4, GTM, Hotjar and Facebook Pixel.
  • Testing and UAT

    • We completed full testing and user acceptance testing, including bug fixes and cross-browser testing and functionality. 
    • We created a second staging environment to enable the client to work on content updates and finalisation ahead of the deployment and updates. 
  • Enhanced search

    • The built-in WordPress search functionality wouldn’t support the site’s search requirements, so we implemented enhanced in-site search to provide more accurate and relevant results, including consideration of how and what search results are presented.
  • Brand consistency and accessibility

    • We interpreted and adhered to brand book guidelines with implementation to ensure compliance with WCAG 2.1 AA standards. As sight complications often impact people with type 1 diabetes, this was a key requirement. 
    • The rebrand required several technical adaptations and considerations, including the global name changes across the website.
    • We retained the information architecture and structure and created a reskinned custom theme with a clear SEO strategy to minimise traffic loss due to domain change.