Fireplace Saver

When it comes to E-commerce websites, at Bronco, we like to build them bespoke. Sure, there are a number of big extensible platforms that perform well for a number of online business. But for us and our clients we find delivering a tailored experience through a bespoke platform allows greater us control to deliver a better experience to users.

Our latest (at time of writing) example of our bespoke E-commerce solution in action is Fireplace Saver (FPS), a Yorkshire based business who came to us looking to re-enter the world of selling online some years after closing down their previous site.

Some backstory

Closing down their previous website, live from 2007 to 2012, doesn’t sound like the best endorsement for the success of a company, but in 6 years things have changed rapidly.

The issue Fireplace Saver found in 2012 was that delivering easily damaged items, at a time where delivery companies were still adjusting to the growth of Internet selling, led to a high number of returns leading to the website struggling to make a profit.

Fast forward a few years and many manufacturers now deliver direct to the customer to ensure safe delivery whilst the big delivery companies, through greater competition, are offering a far better service, leading to far less damages during in transit.

The time was right for Fireplace Saver to re-enter the market.

A simple brief

With their previous website performing well, if not for delivery issues, the brief for the new website was fairly simple; recreate the old one.

Of course we couldn’t just build the website exactly as it was. Web design has progressed so much since the site was first designed more than a decade ago. Out goes the fixed width layout, dated design and 11px text and in comes a brand new responsive design utilising modern best practices and technologies that have emerged over the past decade.

The functionality hasn’t gone unchanged either. We’ve added complex product options and filters as well as price on application and local delivery, not to mention far too many small enhancements to mention.

Designing with a tricky logo

Web designers like logos that are more landscape rather than portrait; short and wide rather than tall and slim. Think Danny DeVito rather than Arnold Schwarzenegger.

The reason for this is that tall logos often lead to a lot of whitespace in the header on a website and push the main body further down the page, and it’s this area that contains the stuff users are often wanting to find, read and interact with.

So in the case of Fireplace Saver, who engaged with another agency to create their logo; we had to solve the issue of integrating a portrait logo in a way that was sympathetic to the rest of the design.

The quick fix is to shrink the logo to fit the height of the header, but the less recognisable the brand the more difficult this is to justify. Yet this is what we’ve done on all but one page.

Ensuring the company name within the logo is still legible, we’ve scaled the logo down to a size where the header can then be populated with the navigation, contact information and trust indicators. This is done without leaving a lot of whitespace, taking up too much of the screen on first load or becoming too overpopulated with elements attempting to fill the space.

We’ve done this on internal pages because on the homepage we’ve retained a larger version of the logo. With a large image banner on the homepage we have the opportunity for the logo to escape the bounds of the header and overlay part of this image without adversely impacting other elements on the page.

I ♡ filters

I have something of a love for working on filter systems. It’s one of the more complex bits of functionality I get to work with integrating JavaScript and AJAX. And on this occasion we built the entire system from scratch (rather than start with a previous implementation) in order to optimise the entire system.

For the client adding filters has been integrated with product options to reduce the overheads in adding both of these for individual products. The client can then also decide which filters appear on the category pages.

On the front-end the rebuilding of the JavaScript and AJAX has led to a reduction in the amount of code transforming code from 28.3kb to 4.7kb. Partially this is down to removing polyfills for the history API, but also there’s just better written, more streamlined code.

Not only does this code drive the filters, but sort, view and pagination options all invoke AJAX functionality to ensure the entire view works seamlessly. But even if you remove the JavaScript, the page works perfectly well using traditional links and form submission.

Price on Application

One of the most interesting things about working with different clients is that they bring specific requirements that you’ve maybe never implemented before. For Fireplace Saver this was the need to implement an automated price on application system for a number of products.

This required us to either send an email with the price and a URL to buy the product or the same via SMS through the Textmagic service. As it turns out, it’s a fairly simple piece of functionality to implement.

Launching in the hottest of summers

When we started the project the clients’ goal was to launch in the Winter of 2017/2018, instead the site launched in July 2018 in the middle of one of the hottest summers on record… probably.

While we did our best to meet this goal, and completed the bulk of the development in this time, the development of a website doesn’t just stop with us. Especially on an E-commerce website, there can be a period of testing and loading products that can take longer than most expect, especially when continuing to run a business too.

But while these kinds of delays can appear like a negative, or missed months of generating sales, we believe that sometimes it’s necessary to slow things down, take the time to do things right and launch when the website is ready. In the case of Fireplace Saver it was unlikely they would have the visibility soon enough after launch to capitalise on the seasonal rush of last winter, and instead now have a site live that they can build in preparation for the coming Autumn/Winter.

From the client

We were highly recommended to Bronco by Mayfair Granite. From our initial meeting with Becky and her team through to the design and completion of the website we have been amazed and pleased with the level of service.

Extremely professional, our main points of contact for this project were Kean and Chris who were absolutely amazing to work with.

Anyone looking for a new website, these are the guys to contact, you will not be disappointed.