GeneratePress: A design case study

Posted on by

The Brief

A website redesign to position GeneratePress as the leading lightweight WordPress theme

In 2017, we were honoured to be amongst 6 international design agencies selected to craft a collection of pre-designed website layouts for the GeneratePress Site Library. After a successful launch, GeneratePress founder Tom Usborne (one of our all-time WordPress heroes), chose us to create a brand new design for the main website.

Our web design brief had one main focus: to establish GeneratePress as the leading choice for any business or agency looking for a lightweight, yet feature-rich, WordPress theme. This was an unmissable opportunity for our WordPress agency, and a design case study we are very excited to share.

Our approach

Establishing and building on the unique value proposition

GeneratePress is already one of the most successful and popular WordPress themes offering both a free and premium feature set.  You’ll find it featured in hundreds of “top 10 WordPress themes” blog posts, YouTube videos and podcasts.  However, in the last 12 months, a number of new and upcoming starter themes have arrived on the scene to challenge for that number 1 position.  Of course, competition is always healthy in this industry and so this prompted founder Tom Usborne to reach out to us based on our prior portfolio of work and our profile within the WordPress community.

Choosing a WordPress theme for your project is not an easy task – there are thousands. Even so, a bit of research will generally give you a shortlist of 4 or 5 contenders that feel like they might be a good fit.  But how do you choose the right theme from the shortlist – it’s not easy, as the top themes all offer a very similar feature set and similar messaging.

Focussing on the strengths of GeneratePress

GeneratePress often finds itself in this shortlist, so our mission became to find a way to give GeneratePress a positioning edge in areas that are hugely important to any website, and specifically the typical GeneratePress customer avatar  – performance, stability & security. Equally important, was ensuring we satisfied the customer’s appetite that likes to see an array of design features, by still communicating that GeneratePress has everything a design focused customer might need. Or to put it in Tom’s words “We want to make sure everyone knows that GeneratePress can do all the fancy stuff too.”

The solution

Our solution was to design a minimal yet stunning website design that from a messaging point of view focussed on the performance, stability, security, accessibility & ease of use, with the website itself speaking for itself as an aspirational design in its own right.

frame- (2)-min

Vector animations

Although, we didn’t stop there.  One of the services we are known for at The Dickiebirds Studio is our vector animations, something we pride ourselves in as a unique and rare skill that we are able to offer over much of our own competitors in a crowded WordPress design agency space.  We wanted to do something really unique that we hadn’t seen any of the core competition to GeneratePress doing on their own websites. So we upgraded our custom vector illustrations with subtle animations created in Adobe AfterEffects, and rendered as SVG animations through leveraging AirBNB’s awesome lottie.js script.

*Animation mode*

Then we hit a snag… Tom Usborne had developed the website to load very fast and to have a tiny footprint – the homepage was only 311KB and loaded in around half a second – fully designed!  Our animations added around 300KB to the page size, which in itself was tiny in footprint still, yet doubled the size of the page.  With us positioning the website as the best lightweight theme, we agreed that this tiny footprint should be maintained…Yet we still wanted to show that GeneratePress could “do all the fancy stuff too.”

. So we came up with “Animation mode” – a user can visit the website now, and may find the *easter egg* toggle in the footer labelled “Animation mode” which when clicked, gives them some visual *eye candy* while browsing around the website.

Screenshot 2018-09-02 at 22.27.11

The result

The new website has had an amazing critical response from new and existing customers. It has established the GeneratePress theme positioning as the best choice for anyone looking for a lightweight WordPress theme that takes care of the important stuff first and foremost while providing all the design features needed to craft awesome websites.

The website has also given great confidence to the GeneratePress team and spearheaded a series of amazing theme updates to features and performance – backing up the messaging the website communicates so clearly and setting the tone for the future development of the product. Oh, and an amazing design case study for us.

Summary of links from this design case study

frame- (3)-min

Sharing is caring!