Be Inspired
How thoughtbot brought Be Inspired’s new brand identity to life with a new website
Challenge
Launch a new website on a short timeline
Outcome
Scalable website aligned with the new brand, in time to launch
Screenshot from Be Inspired's website
Challenge
A quick digital refresh
Be Inspired is a non-profit on a mission to empower young people from diverse backgrounds to make more positive life choices. Through their wrap-around programmes, they work to combat challenges faced by young people in society today, breaking down barriers and building up opportunities.
When the team came to thoughtbot, they had completed a successful rebrand unifying two charities into one. They needed a new website to launch alongside the new brand identity within a 2 week timeline.
What we did
Crafting a new web experience aligned with a fresh brand story
The thoughtbot team started with a discovery session to understand more about Be Inspired’s goals for the new brand, and how a new website could help them achieve their aim of sustaining their programmes long term and expanding their services across London.
Through the discovery process, we also got to learn more about Be Inspired’s mission and the community they serve.
Helping visitors easily find the information they need
Our process started by arranging all the relevant information about Be Inspired, their programmes and digital media in a clear, intuitive way. It was important to ensure we present visitors the most relevant and impactful information as they navigate the website.
thoughtbot designers collaborated with Be Inspired’s stakeholders to come up with a detailed information architecture that fits the organization’s vision.
This also helped us break down the content and identify patterns, meaning we could develop a system of reusable content components.
Creating the building blocks
The thoughtbot team approached the website design by breaking it down and basing the user interface on consistent, scalable, and flexible blocks. We translated Be Inspired's new brand identity into tokens which included visual properties such as colors, typography and spacing. From there we went on to build components and templates.
This approach enabled us to build consistency from the beginning, and ensure the website is easy to scale and maintain in the future.
Bringing it all together
After establishing these building blocks, we set to work on the most high impact pages, designing different sections of the home and contact Us pages. Our goal in this phase was to educate visitors about Be Inspired, their programmes and partners, as well as how to refer or join any of their projects.
thoughtbot prepared several design versions for each section, reviewing and iterating on them with Be Inspired stakeholders, before landing on final versions of each page.
Building it out
We considered several options before deciding to go with Eleventy as our static site generator. It was the ideal choice due to Its simplicity, reusable components, and potential for future CMS integration due to it's ability to ingest data from external sources.
After the groundwork bringing our design tokens and components into the code, we built the individual pages at a faster pace, spending less time reviewing and confident in the consistency.
Outcome
A digital foundation to grow a community
The thoughtbot team enjoyed the challenge of bringing Be Inspired’s brand to life through their website, and in time for them to launch the new identity to their community. Beyond launching this new website, thoughtbot has set the right foundation for Be Inspired’s present and future digital presence.
It was fulfilling for the thoughtbot team to learn that the website was well received upon launch. We are excited to see how it continues to help Be Inspired serve their community.