Scroll to top
Branding & Website
Brand Identity System
Brand Style Guide
UX Research
Wireframes
Content Maps
Prototypes
Webflow
2021
We worked closely with Astabridge to completely revamp how they present themselves both on and offline. This process started with initial brand discovery where we were really able to understand what sets them apart from competitors, and how they want to move forward, as well as many other aspects of their business, from here we were able to to update their visual brand identity to reflect our findings. Following from the branding, we moved onto web strategy, involving research and planning to ensure the new website would work best for Astabridge’s clients before fully designing and building the site.
We engaged in several research phases in the form of workshops and worksheets to get a full understanding of who Astabridge is, what their USPs are, who their target audience is, their clients, and goals. This allowed us to align their visual identity to best fit their needs.
Since Astabridge is already an established brand that many of their customers have become familiar with over a number of years, we tried to keep key brand aspects from their existing identity moving forward so as not to confuse or alienate returning clients.
Working from what they had being just a single composition logo mark and some basic brand colours we were able to extend their new identity to a fully fleshed out identity system including typography, colours, use cases and graphic devices, along with a comprehensive set of brand guidelines to ensure consistency in the future.
As when working on any web project it is important to gain an understanding of what content needs to be shown and where. To achieve this we worked collaboratively with the Astabridge team to create a site map and content maps. These were used to give an understanding of what content would need to be on the site and where it would live before we started wireframing, this allows everything to be accounted for from the beginning rather than trying to add it in afterwards.
Once the sitemaps and content maps were approved we moved onto wireframes for the site. We created wireframes for Desktop, Tablet and Mobile sizes. These gave the client an understanding of how the hierarchy of content would work on each page and allowed us to understand user journeys without confusion of additional queries from the design/user interface.
Once the wireframes were approved came the job of making it fit the brand. To do this we worked using a visual web style guide reflective of the brand identity, we made decisions based on the already established guidelines to add colour and typography to the design before carefully thinking through the best approach from other elements and layout. Working in Figma allowed us to also consider how interactions and animations would look on the website prior to starting the build.After Astabridge had approved the designs we moved onto the build. The website was built on the Webflow platform allowing us to keep the live site as close to the approved designs as possible. Using this platform also allowed us to build considerably faster than other alternatives as well as offering the client a user-friendly client editor where they can edit, add, and remove content from the site in-house in a matter of clicks.
Following the designs the new site was built to work responsively across all devices. This was ensured using meticulous Web QA.
Finally, we preformed basic SEO on the website ensuring all best practises were followed before deploying the site and redirecting old links and traffic to the new site.