Case study · 2024

3rd Fife Scouts

Bright, parent-friendly pages for Beavers through Network — easy to scan, easy to join.

Clean group site for 3rd Fife (Royal British Legion) Scouts — programmes, volunteering and joining at a glance.

Visit live siteBook a similar project

Web Design · Web Development

3rd Fife Scouts logo — web design case study by Euan Livingstone

Overview

3rd Fife (Royal British Legion) Scout Group is a registered Scottish charity in Dunfermline. The website introduces Beavers through Network, plus routes for leaders and new joiners, within the wider Dunfermline District and Scouts Scotland network — aimed at busy parents who will only give the homepage a few seconds.

Challenge

The group needed a welcoming, easy-to-scan site that felt energetic for young people while remaining clear for parents and adult volunteers. Legion heritage and Scout branding both matter; neither should dominate the other.

Solution

UI designed in Figma; logo treatments and graphics refined in Illustrator and Photoshop. A warm gold/yellow accent gives the group a bright, optimistic identity across section and volunteering pages, with joining and volunteering CTAs kept obvious on mobile.

Outcome

Families in Dunfermline can quickly understand what’s on offer and how to get involved, with a consistent local Scout identity that still feels specific to 3rd Fife.

Design tools

Designed in Figma with brand and visual assets crafted in Adobe Illustrator and Adobe Photoshop.

  • Figma
  • Adobe Illustrator
  • Adobe Photoshop

Built with

Languages and technologies used to deliver the live experience.

  • HTML
  • CSS
  • JavaScript
  • PHP
  • jQuery
  • Bootstrap

Colour palette

Brand swatches below. UI accents on this page are nudged where needed so they stay readable on the site background.

  • Legion Gold

    #EDC853

  • Warm Gold

    #D4A017

  • White

    #FFFFFF

  • Ink

    #1B1B1B

Next step

Need something in this vein?

Whether you're a Dunfermline or Fife organisation or a remote UK client, I can take a brief from first sketch through to a live site. See more work, send a note, or book a chat.