Run Things

Outgrowing Wordpress

Like many companies, Run Things had got by with WordPress site for several years. Unfortunately, it was beginning to crack under the weight of Run Things' increasing popularity.

WordPress had been heavily customised to power their virtual running events. It was bursting at the seams with plugins and pages were taking ages to load leaving their customer's frustrated. If there's one thing runners appreciate it has to be speed, and Run Things was literally a "slow running site". 🤣

It was time for Run Things to move away from WordPress and onto a platform that would better support their bespoke needs and give their customer base the kind of performance they crave.

Our solution

We rebuilt the Run Things marketing site, shop and event entry process from the ground up with modern technologies that would allow Run Things to scale and grow in the future without the constraints of WordPress.

Headless Craft CMS & Craft Commerce

To manage their content and power the Run Things store we decided to use Craft CMS and its e-commerce extension Craft Commerce.

Craft CMS allowed us to model the site content intuitively and flexibly making it easy for Run Things to add new pages, create new events, and add items to their store. We use Craft CMS heedlessly. This means Craft CMS isn't being used to render the site pages, instead, we make use of the GraphQL APIs to load the content separately on the frontend.

In layman's terms this means the site much more scalable and performant. On top of that, if Run Thing's were ever to make a mobile app, using Craft heedlessly would make re-using the same content in the mobile app a breeze.

Gridsome, Vue.js and Netlify for speed and scalability

To power the front-end experience we used the static site generator Gridsome. This is what makes the site super fast. Gridsome uses the APIs from Craft CMS to load in all the content and then pre-renders all of the sites pages. This means when a user loads a page its not slowed down by things like slow database connects, or naughty WordPress plugins.

Combine this with hosting on Netlify and you have got a site that's fast enough for Usain Bolt.

This approach is called the JAMstack. You might have noticed we talk about it a lot, and hopefully, by clicking around the Run Things site for yourself you can appreciate its benefits.

Vue.js is our weapon of choice when building interactivity on websites as it allows us to build highly usable sites without stifling our creative flare.

Sparking joy

We believe every site should spark joy. Our slogan is "We make computers dance" after all!

Run Things is no different, and we sprinkled a little bit of signature Pixelhop seasoning in the form of a shower of confetti to make users feel like winners when adding products to their shopping basket.

Not only does this make filling up your shopping basket super fun and satisfying, but it also serves an important UX purpose in indicating the product has been added and to basket successfully and to draw the user's eye to the new basket total.

Happy customers, happy client

What does all of the above amount to? Well on launch day Run Things were happy to receive lots of lovely comments from customers and their first big event post-launch Run Up To Christmas was a huge success.

We were lucky enough to receive an awesome testimonial from Run Things too:

Collaborating to get results

At Pixelhop we are used to collaborating with UI designers, UX designers, and developers to achieve great results. Run Things was no different and we had a great time breaking down the barriers of time and distance working with the awesome New Zealand based designer Alex Slack (Check his instragram here) and Run Things' own in house developer Jack Allen who did an amazing job building the RunThings app and APIs.