About Inbound is led by Vourneen Taylor, who worked at HubSpot for almost four years as one of their top Principal Inbound Marketing Consultants in charge in Classroom Training in EMEA and APAC.
She provides Inbound Marketing training and consulting for B2B companies by delivering personalised experiences that have the power to transform in an impactful way. If you are looking for help with your Inbound Marketing, I would highly recommend reaching out to her!
About Inbound HubSpot Website Re-Design
Recently I helped Vourneen freshen up her website by creating a new set of templates for her to use throughout her website.
Screenshot of the About Inbound Homepage
Compare it to the original homepage which used HubSpot's default Vast theme with less vibrant colouring:
Screenshot of the original About Inbound Homepage
The About Page
Screenshot of the About Inbound About Page
The Contact Page
Screenshot of the About Inbound Contact Page
The Blog Listings Page
Screenshot of the About Inbound Blog Listings Page
A Landing Page
Screenshot of an About Inbound Landing Page
The Design Process
The design process started with a conversation on the requirements for the website. In this case, the goal was to "freshen up" the design while keeping the same elements throughout the website.
Prior to jumping into development, I created a mockup of the UI elements and several layouts on Adobe XD to ensure everyone was on the same page with the design.
Original Mockups of the website on Adobe XD
After discussing any feedback on the design, I jumped into the HubSpot CMS and began building the templates. This particular re-design consisted in a number of specific templates, general templates and custom modules.
And in true growth-driven design fashion, we've launched the site quickly and will continue to optimise based on results.
Full Set of Templates
The website re-design consists of a full set of templates includes:
- Page-Specific Templates
- Homepage Templage
- About Template
- Contact Template
- Website Templates (Full Width Template, Three Column Template, Two Column Equal Template, Two Column Left Template, Two Column Right Template)
- Blog Templates (Blog Listings and Blog Posts)
- Landing Page Templates (Full Width Template, Three Column Template, Two Column Equal Template, Two Column Left Template, Two Column Right Template)
- System Page Templates
- 404 Error Template
- 500 Error Template
- Password Template
- Search Results Template
- Email Subscription Templates (Unsubscribe, Subscription Preferences, Confirmation)
- Numerous Custom Modules
- Email Template
Customisable Background Image Headers
Throughout the site, all hero images can be set directly from the Website and Landing Page tools using the Hero Image Chooser custom module I built.
The templates allow you to set the hero image for the page
Dynamic Blog Design
Similarly, all blog posts automatically pull the blog post featured image and automatically sets it as the background image in the header.
The blog hero image uses the post's featured image
Testimonial Slider Module
The website uses a testimonial slider module to show testimonials. You can learn how to build your own step-by-step here!
Testimonial slider custom module
Blog RSS Listings Modules
This highly customisable module allows you to add blog posts to any page on your site that updates automatically. It will soon be available on the HubSpot Marketplace and you can learn more about it here.
The RSS Blog Feed module allows you to quickly customise the blog feed on your site, no coding required!
You can take a look at her website here.
If you're interested in discussing a re-design of your own, why not get in touch?