Symphony3: Shaping a Website That Supports Service and Strategy

Enhancing user experience, storytelling, and community engagement through thoughtful design and development.

At a glance

assignment
Project
Symphony3 Website Redesign
person_edit
Role
UX/UI Designer and Frontend Developer
calendar_clock
Timeline
2022, 1–2 months
design_services
Tools
Adobe XD, Drupal, StoryBrand framework, HTML, CSS, Twig
group
Users
Corporate clients, local government, non-profit sector
approval_delegation
Responsibilities
UX strategy, UI design, wireframing, prototyping, frontend development (Drupal theme building)

Project highlights

book_4

StoryBrand messaging strategy

Applied the StoryBrand framework to shape clear, engaging homepage messaging and content flow.

mobile_layout

UX/UI page design

Designed and prototyped key page types for the website, including homepage, case studies, services, and articles.

code

Frontend development in Drupal

Took ownership of frontend development, building the site theme and components directly into Drupal using HTML, CSS, and Twig.

format_image_left

Content flexibility for marketing

Improved content flexibility for the marketing team, enabling easier publishing and stronger community engagement.

strategy

Design aligned with business goals

Supported business goals of storytelling, education, and lead generation through intentional UX and UI decisions.

View Symphony3 website

Project Summary

Symphony3 is a digital agency specialising in building technology solutions for corporate and local government clients. The business had outgrown its previous website—built on an outdated Drupal platform—which no longer aligned with the evolving brand or with the modern white-label platform being delivered to their own clients.

I was brought in to lead the redesign and redevelopment of the Symphony3 website, combining UX and UI design with frontend development. A key focus was to improve the overall user experience and align the content strategy with business goals, while also refreshing the design to better reflect the agency’s current offering.

The new site needed to tell the company’s story more clearly, provide flexibility for internal content creators, and encourage stronger community engagement through articles, webinars, and case studies.

The challenge

The previous site had several barriers to both user engagement and internal content management:

Built on an outdated Drupal setup, with limited flexibility for non-technical content updates
Lacked clear storytelling flow for products, services, and case studies
Didn’t reflect the newer white-label design system implemented for Symphony3’s client projects
Missed opportunities to build audience trust and engagement through consistent articles, learning content, and webinars

The business needed a site that could:

Tell their story clearly, using the StoryBrand approach
Support easier content creation by the marketing team
Deliver a modern, accessible user experience with clean, engaging design components

Approach & Process

Working closely with one of the directors, I took ownership of both the UX design and the frontend build, ensuring that the design intent carried through to the final site.

Key steps included:

Using the StoryBrand framework to map the homepage content flow, focusing on audience needs, product clarity, and value propositions
Reviewing competitor websites and industry leaders for inspiration and benchmarking
Designing the sitemap and content structure to support user journeys and business goals
Building a full prototype in Adobe XD, covering key page types including homepage, case studies, services, webinars, blog, and contact pages
Taking lead on frontend development using Drupal, integrating the design directly into the theme with HTML, CSS, and Twig templating
Ensuring the site was responsive, accessible, and easy to update, supporting the long-term content strategy for community-building

By combining design and development within the same role, I was able to maintain design integrity throughout the build and respond quickly to feedback or changes.

Outlook & Impact

The redesigned website provided a much-needed refresh for Symphony3’s online presence—bringing both the design and content strategy up to date with the agency’s service offering and long-term goals.

Key outcomes included:

Directors and team expressed strong positive feedback on the clarity of the design, user experience, and storytelling approach
The marketing team gained the ability to easily create and manage content through the updated Drupal platform, supporting their focus on community-building
The StoryBrand-led homepage provided a clear, audience-centred introduction to Symphony3’s services and approach
The site reflected Symphony3’s credibility and capability, positioning them confidently with their target market

Reflections

This project gave me the opportunity to combine UX strategy with visual design and hands-on frontend development, building a site that not only looked good but worked well for both users and the internal team.

Owning both the design and development allowed me to ensure that design intent translated cleanly into the final build, without compromise. It also deepened my understanding of how content management systems like Drupal can empower non-technical teams to create, manage, and maintain content with ease.

The project reinforced how important it is to balance clarity and simplicity—not just in layouts, but in the way products, services, and stories are communicated. Designing for both usability and storytelling helped the brand reposition itself as knowledgeable, engaged, and approachable.