It was essential that the site resonated with everyday EV owners, tech buffs and the crypto crowd. But it was also important that DIMO get new partners and developers on board, too. As part of our discovery process, we outlined how DIMO should communicate with these audiences — both visually and verbally. The result was an immersive web experience that paired seamless user journeys with subtle movement and animation to create a sense of belonging, all while driving users to download the DIMO app and get connected. 

A project that puts the user at the centre

DIMO is a future-focused project, so we needed to encourage buy-in by showcasing the brand’s vision and the bigger picture. Futuristic, Web 3 projects have a tendency to feel fake and abstract, or heavily feature video game-like imagery. Instead, we used real-world photography to reflect the real-life concept and incorporated 3D visuals of vehicles to make the site more engaging and interactive. And all of this was then balanced with a set of poster illustrations (courtesy of renowned visual designer, Trajan Jia) that blended modern themes with classic car culture to give a nod to DIMO’s vision. 

Balancing real world and digital world, and present and future

DIMO had recently rebranded. But we took the opportunity to evolve and elevate things further. We introduced new assets including gradients, rounded corners, lighter typography, and signature glass phone imagery. This not only built more value in the brand, but created an authentic, high-tech look and feel that would go beyond the bespoke site — from the native driver's app and marketing materials, to DIMO’s very own design system that enabled creators and developers to build new apps on the ecosystem. 

Building a brand across an entire ecosystem

The S8-DIMO team spanned from the UK, Cyprus and Portugal to New York and California, collaborating on initial mood boards and wireframes, right through to the final animations ahead of go-live. And by staying in constant contact through workshops, weekly (and eventually daily) stand-ups, and continuous updates via Figma and Discord, we designed and developed the DIMO site — from scratch — in a matter of months.

Collaborating across time zones, from Cyprus to California

DIMO

Our main goal was to modernise the brand by introducing a new look and feel that’s playful and youthful, but still gives a nod to its core values. We paired a new palette of contrasting colours with distinctive design elements such as badge stamps and image inktraps. Then, we went big and bold with typography.

220 years young: a traditional brand with a bold new energy

British style is all about independence and eclecticism. And when your history is as inspiring as Peregrine’s, it's only right that you write with flair. We outlined a new brand voice that brings together the wit of great British humour, the authenticity of storytelling, and the straight-talking tone of a brand that’s big on sustainability. In other words, charming, honest and rugged. Definitely no wooliness. 

A voice that speaks volumes

Our discovery work revealed that almost 3 in 4 users were returning visitors. And since these users are more likely to make a purchase, it only made sense to incorporate more upsell features in both the cart and the wishlist. Shoppers now see recommended products based on what they’ve purchased in the past. Or, they’re presented with suggestions of products that (based on data from past visitors) are frequently purchased together. 

Personal(ised) shopping, from the wishlist to the checkout

Peregrine’s a British-made brand, but its products are sold all over the world. Using Shopify Markets, we built a bespoke location switcher that groups countries into regions and enables shoppers to see specific pricing based on their location. Plus, the Peregrine team can customise pages depending on the season or campaign. 

We also went the extra mile to create more seamless user journeys. Users can browse clothing by size (and only see items that are in stock), as well as product type and material. The responsive image galleries are tailored to their chosen product colour. And, we also added quick buy functionality to the collections pages and blog, so users can easily add featured products to their basket. 

Making it better to browse and easier than ever to buy

Peregrine

The visual branding was all about refinement. Acupanel’s current logo typography was uncomfortably wide, so we worked on spacing to create a more readable wordmark and clean, modern logo. We paired that with a new colour palette featuring darker shades of green as background colours alongside lighter, complementary shades. The result? A more premium look and feel that lets the product shots do the talking. 

A twist (or two) on a classic typeface

Acupanel is an industry-first, so emphasising the brand’s originality was a must. We went back to basics, running workshops with the team to outline tone, rhythm and personality. We landed on a new brand voice that’s adventurous, inspiring, and real. 

We then turned our attention to copywriting. We used pairs of headings to add a signature characteristic to the content  - plus, give a nod to the fact that Acupanel’s products are all about style and substance. We told stories about the brand’s heritage to inspire readers. And, above all things, we ensured Acupanel’s voice was warm, genuine, and reflected the fact that installing its products was reassuringly simple. Because to 'do it yourself' should mean just that. 

Showing you’re a pioneer — not just saying you are

Behind Acupanel is a team of expert craftsmen with a love of design. Its out-of-the-box panelling is an industry first,  so it only made sense that we shake up the average e-commerce store structure with something out-of-the-ordinary. 

We designed and developed an immersive, interactive website featuring layers of texture, continuous movement and animation, and striking photography. We incorporated audio clips, annotated imagery, and real-life inspiration galleries to elevate the entire user experience. Shoppers can select colours, apply finishes and calculate how many panels they’ll need with the coverage calculator. And traders can sign up for exclusive discounts through Acupanel’s partner program. Everything that shopping with a premium brand should be. 

A design that’s out of the ordinary 

Acupanel

We used continuously revolving 3D animations to reflect Fat Tuesday’s grab-and-go culture, as well as realistic film and photography, flyer-style torn edging, and bright neon signage - a nod to the fact that their Vegas stores are often first-stop vacation spots for those visiting the city. 

A brand that blends in; not tries to fit in

To increase footfall, we created an interactive map to show users where they can grab their first (or their next) drink. Cup QR codes direct users to a location finder, and we integrated with Fat Tuesday’s third-party gift voucher platform to enable users to quickly and easily check their balance online.

A user journey that keeps the party going

Research showed that visiting Fat Tuesday was usually a group activity, and almost always part of a wider experience - be that partying, sightseeing, or hitting the beach. With a selfie-worthy selection of drinks and a ready-made audience of social media users, we added a live social feed that synced with in-store screens across all locations to show the good times never stop rolling.

A space for sharing the good times

After the go-live of the new Fat Tuesday site, we set to work on overhauling the sister brand - New Orleans Original Daiquiri. The premise and concept were the same (frozen cocktails to-go, a dated online presence), but with all outlets in the state of Louisiana, and an older more local audience to appeal to, we gave the brand a small-town, neighbourly feel. Think laid-back Southern vibes, a retro typeface and photography, and a feel-good colour palette and design that says “stop by and kick back with a cold one”.

A local, Louisiana-based little sister

Fat Tuesday

Mixing up work and play, every day 

People creating websites, developing brands and building eCommerce stores for people.

We know the internet and people in equal measure

Take it from our people people

GET IN TOUCH

The busiest shopping season of the year is almost upon us. And with more and more of us choosing to tackle our Christmas shopping from the comfort of the couch, how can you ensure you’re as prepared as possible on the fulfilment front?


We recently caught up with ShipBob to chat about seasonal shipping and how to stay one step ahead.

And by this, we mean delivery times. Offering the fastest, cheapest delivery may be a great way to capture those last-minute Christmas shoppers, but there’s no point in overpromising if you can’t achieve it. Be clear in the way you communicate delivery times and highlight cut-off dates that align with your deadlines. Some people may be more than happy to receive their order later than planned, but with customer retention more important than ever, it’s not worth taking the risk.

It sounds obvious, but all areas of your business need to talk to one another. Predicting sales peaks is going to be essential for keeping up with demand, so ensure everyone’s aligned when it comes to campaigns or PR activity. If you’ve got products that are selling faster than others, slow promotional activity and readjust your ordering. If you know your biggest sellers are being held up (because of bad weather or general shortages) then add messaging around when users can expect a restock and prioritise replenishment ASAP.

Get prepared by looking at sales numbers from previous years and supplier restock times. If you use a 3PL for shipping, ask them to calculate and relocate your inventory. Having the right stock in the right warehouses will help reduce your shipping costs and, more importantly, help ensure you don’t run out of your best sellers. Plus, forecasting busy periods ahead of schedule means your warehouses can bring in seasonal staff and increase their courier networks to keep up with demand.

If you’re looking for a way to ease the pressure on your fulfilment channels, why not push gift vouchers this festive season? Black Friday offers on gifting, as well as last-minute e-delivery messaging during the countdown to Christmas, are both great for driving sales. You can still cash in on buyers, but you won’t incur the same costs or require the manpower needed for packing and posting orders.

High numbers of returns will follow any big sales period. Unwanted gifts, impulse buys – all on top of the regular returns you’ll receive in any given month. Review your returns policy as soon as possible. Think about who pays, offer exchanges instead, and source the most competitive rates on couriers. Even introduce cut-off dates – or consider charity donations instead if it’s more sustainable and cost-effective. And finally, make sure your up-to-date policy is super clear on your website. You’ll then have the chance to crunch the numbers and review the reasons behind returns once the dust settles.

Seasonal shipping: how to be Christmas and Black Friday-ready when it comes to fulfilment

Selling to shoppers outside the UK is a no-brainer for growing your e-commerce business. But expanding overseas is easier said than done – especially when it comes to fulfilment. We caught up with ShipBob to discover why – in today’s marketplace – offering localised shipping is such a big conversion driver.


Fewer delays at customs = more repeat custom

Since Brexit, a big hurdle for businesses selling outside the UK to overcome is the red tape at customs. Not only are additional duties costly, but the entire process of shipping across borders can also be incredibly time-consuming. Being in both locations helps prevent anything from being slowed down. And the more reliable your delivery times, the more likely your customers are to buy – and keep buying again and again.

Staying local keeps your shipping costs down. If you’re already based in your buyer’s region, there’s no need to navigate exchange rates. You’re also avoiding any carrier surcharges and cutting down on the fuel costs associated with getting your goods from A to B. And with your profits taking less of a hit all around, you’re more likely to be able to offer the holy grail of fast, free shipping – something that’s essential at a time when customer expectations are at an all-time high.


Eliminate any uncertainty at the checkout

Don’t underestimate the power of “what you see is what you pay”. Tell a customer that they may have to pay additional fees because they’re based overseas and they’ll definitely think twice about buying. If you’re shipping locally and can offer delivery duty paid, then your sales are guaranteed to soar. In fact, according to ShipBob, conversion rates are four times better when you offer this type of service.

Offering local fulfilment isn’t just great for slashing delivery times and costs. It allows you – and your customers – to personalise the shipping process further. Instead of offering just home delivery, you can make use of pick-up points and collection lockers – the preferred choice for buyers in the Netherlands, France and Germany. And let’s face it, if your customers can choose to collect (and return) their orders in a way that works best for them, they’re more likely to commit in the first place.

How localised shipping can help drive conversions

Whatever your ecommerce business needs, you can bet that Shopify has an app for it. But when it comes to adding wholesale functionality to a site, we found that the third-party apps out there - to put it politely - could be a whole lot better. Here’s why:

We had to wait for the app developer to manually install the app on our store

Random generated discount codes were being generated

So instead of continuing to subscribe to something that simply doesn’t work, we set about figuring out what Shopify's discount code feature had to offer. From here, we utilised this feature with our own custom code to provide a better solution.


Read on to discover how we hacked it and learn how to create a Shopify whole account without a third-party app, too.

The easiest way to assign a discount code to many customers is by creating a customer group. The discount will also automatically apply to any future customers who are later added to the group.

To get started, simply add a tag to your customers, for example: “trade”.

Next, on the customers listing page, perform a search by filtering by the tag you added in the previous step.

Once you add the filter, a custom search will be performed and a list of your tagged customers will be shown. Whilst in this custom search view, click “Save segment” to create a new group.


You’ll be prompted for a name; this can be anything you like and will only be shown in the Admin panel.

You should now see a new, easy to access tab at the top of the customers panel.

To set up a unique discount for our “Trade Customers” group, head over to the Discounts section in Shopify’s Admin and create a new discount code.

You can name this code anything you like, just note that this will be shown to customers at checkout and on their orders.

Next, fill out the discount as per your own needs. You can use any discount type (percentage, fixed amount, etc), add minimum orders — whatever your needs are for this customer group. Do note that this post will be referring to the percentage discount type with no minimum order, therefore certain code snippets might require significant tweaking to meet your discount rules.

The only requirement is that under Customer eligibility, you select “Specific customer segment” and then select your customer group, eg: “Trade Customers”.

You can check the discount summary at the top right of the page. If you’re happy with the discount rules, click save (note: you can come back and change these details at any time!)

You are free to edit your theme’s code via the Shopify Admin, or using a code editor and using a tool like Themekit or the Shopify CLI to push your changes.

Please note that since in our example we’ve been using “Trade Customers”, we’ll continue to do so in the code snippets below, feel free to rename any files and variables as you need — just make sure to stay consistent throughout this section.

Head over to the cart.liquid template/section. Here we’ll need to do a few things, firstly we’ll automatically apply the discount code if a user has a trade account, using the following snippet. Make sure to paste it between the opening and closing <form> tags, since it is a hidden input, the user won’t see it on the page.

Note that if you named your discount code something other than “TRADE_DISCOUNT”, please update the value.

So at this point the discount will automatically be applied if a Trade Account user is logged in and submits the Cart form, they will see the discounted prices on the Checkout page.

Let’s continue with some more code snippets which will calculate the product prices based on a few editable discount rules.

Please note that the following example doesn’t take minimum requirements into consideration (min. quantity of items, or purchase amount). While it is technically still possible to implement this Trade Accounts technique using minimum requirements, it requires much more custom code which is outside of the scope of this post.

Apply the discounted price to the product

The easiest place to start applying the conditional discount is the Product page since we only have one product price to worry about.

We’ll be creating the snippet in charge of calculating product prices; this snippet will likely need some editing to suit your use case, so read the snippet titles carefully and make any changes necessary to follow the rules of your discount code.

Create a new snippet called calc-product-price.liquid and paste the code snippet that most closely resembles your discount code rules:

1) If the discount applies to the entire store and is a percentage type discount:

Edit the first line as needed, the above example is for a 20% discount.

2) If the discount applies only to a particular (or multiple) collections and is a percentage type discount:

Edit the first and second line as needed, the above example is for a 20% discount applied only to the collections within the pipe-delimited list (make sure to use collection handles).

The qty variable will make more sense a litter later.

Now head back to the product.liquid template/section and we can update the product price! In the template/section find where the price is getting output eg {{ product.price }}, and replace this with our new snippet:

Notice we pass in the product as a variable, this will become useful when the product object isn’t available on other pages.

Remember, this variable will automatically fall back to the regular price if the current logged in user isn’t a Trade Account or if the product isn’t in a discounted collection, so no need for an if statement.

If you’d like to conditionally show the original price, perhaps with a strikethrough, to indicate that the discount is being applied, add the following:

Most of the hard work was done in The Product section, so we can reuse the snippet that we created earlier.

Next we’ll need to find where the collection products are getting looped, we need to make sure to include the snippet inside the loop so that the price can be recalculated each time. In most themes the actual product info will be included to keep collection template clean — this will look a little different per theme, so check for something that looks like this:

In the above example, we need to look for a snippet called product-item.liquid. Inside the product item snippet, we can include our calculation snippet to render the trade price.


In the product-item.liquid snippet find where the price is getting output (eg: {{ product.price | money }}), and replace this with our calculation snippet:

Please note that the variable used is still product which allows us to use this shorthand syntax, if the collection products loop used a different variable name like prod, we’d have to update the snippet like so:

Once again, you can include the earlier snippet to show the original price here too.

Apply the updated price to the cart (again)

Now that the Product and Collection pages have been updated, it’s time to come back to the Cart page and apply the discounted prices and totals here.

We’ll need to apply the discount to each line item in the cart, keeping the quantity in mind too. Find the line that starts looping over the items in the cart, it should look something like:

Once you find the price, replace it with our calculation snippet, ensuring that we pass in the line item’s associated product, e.g:

Remember the qty variable I mentioned earlier? Before showing the trade price this time, we need to multiply it by the quantity of the item:

Our last step is to calculate the cart total price:

Next, in the cart.liquid template/section find where the cart total price is getting output (eg: {{ cart.total_price | money }}), and replace this with our new variable:

The Cart page should now reflect all the discounts that are offered to the Trade Account users, while regular users will continue to see the normal prices.

It may be useful for customers to know or be able to double check whether they have been given a Trade account. Using our trade-account-check.liquid snippet, we can output an extra line on the Account page:

And there you have it - wholesale functionality without the bugs, or the cost, of a Shopify app.

We know the internet and people in equal measure

Mixing up work and play, every day
View Work

Take it from our people people

Seasonal shipping: how to be Christmas and Black Friday-ready when it comes to fulfilment

How localised shipping can help drive conversions

How to create Shopify wholesale accounts without an app

Let us take you further than you’ve ever been

We know the internet and people in equal measure

Mixing up work and play, every day View Work

Take it from our people people

Seasonal shipping: how to be Christmas and Black Friday-ready when it comes to fulfilment

How localised shipping can help drive conversions

How to create Shopify wholesale accounts without an app

Let us take you further than you’ve ever been SCHEDULE A CALL

Mixing up work and play, every day
View Work

Let us take you further than you’ve ever been