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

Viatu’s current identity didn’t truly reflect who the brand was, what it did, and – more importantly – where it was headed. We ran workshops with the entire Viatu team, covering everything from audience personas to user flows. We took a deep dive into values, vision, purpose and personality. And all of this together helped us develop a stronger, more defined brand identity that would be communicated internally and externally. 

Understanding people, positioning and purpose 

With new trip locations on the horizon, the new brand needed to easily grow with the business. We built a palette inspired by Africa’s wild, untouched landscapes, using colour psychology to make sure our choices aligned with Viatu’s modern and confident character, but still gave a nod to its sustainable roots. We explored traditional hand-drawn tribal patterns and texture, delved deep into photography and iconography styles, and chose typography that reflected Viatu’s bold and playful nature. Then, we rigorously tested everything for legibility and clarity. The result? A brand that translates across all languages and currencies – and can be adapted in line with new product features and Viatu’s future outside of Africa.

Giving the new visual identity room to grow

Storytelling is vital to the Viatu brand. Behind the hundreds of experiences, accommodation listings and blog articles was an entire team of writers. But with this collaboration came inconsistencies. As well as defining a stronger verbal identity through a series of brand personality workshops, we developed a TOV guide featuring sample content, detailed dos and don’ts, and rewrites of existing examples from across multiple touchpoints to help the Viatu team roll out the new voice effectively. 

Finding Viatu's voice - and futureproofing it

While we took care of branding and web design on the front end, Viatu’s product development team would always be responsible for the trip booking system. To ensure consistency across the entire user journey, we built a comprehensive design style guide that featured everything from brand placement rules to UX styling. We even outlined photography aspect ratios, so all imagery translated perfectly across desktop, mobile and social media. 

Creativity meets consistency

Armed with Viatu’s new identity, we designed and developed a site that’s user first – and future first. Working in conjunction with Viatu’s development team, we simplified and streamlined the trip booking process, allowing the user to clearly map out details of their trip, personalise accommodation options. Plus, we paved the way for an entire pipeline of new functionality, including the introduction of car hire, activities, and more.

A site that's no longer product first, but user first

Viatu

With heaps of product-related info, plus an entire area of the site dedicated to sex ed, we already had plenty of content to work with. But after a series of persona and TOV workshops, we defined a new visual identity – one that better represents the brand’s empowering, pleasure-first narrative and celebrates the joy of sex. 

Changing the narrative around sex talk

We collaborated with Smile Makers’ SEO agency throughout the project, from initial conversations around wireframes to ensuring all metadata was migrated to the new site. We also wove high-ranking search terms into the website copy and made sure the new site structure changed as little as possible. 

Ticking all the SEO-shaped boxes

We pushed the boundaries of standard e-commerce page layouts to create a premium site that’s playful, functional and puts accessibility first. We also found different ways to educate users about pleasure-first sex, from fun facts and vibrator comparison charts to more in depth how-to tips. 

Taking the stigma out of sex toy shopping

We overhauled the matchmaker quiz, creating a multi-step user flow that encourages users to talk about their pleasure preferences in order to find their perfect vibe. We added an Omnisend integration that allows users to receive a copy of results by email. Plus, with a custom Google Analytics/GTM setup that captures data at every step of the user flow, Smile Makers can gain a better understanding of their audience, perspectives on pleasure, and the most popular sex toys chosen. 

Translating a Typeform quiz into a bespoke digital experience

We added subtle, playful animations that align with Smile Makers’ joyful brand image. Think confetti cannon explosions, bouncing product imagery, and gentle, floating movements on scroll. Plus, we couldn’t resist having a little fun with some flying vibes on the 404.

Creating a site that moves and shakes

Ahead of go-live, we migrated Smile Makers’ entire library of blogs and sex ed content across to the new Shopify site. We used a custom script to ensure the content aligned with the brand-new design and Shopify article structure. Plus, we transferred all customer and order information and Yotpo reviews ahead of launch. 

Migrating from WooCommerce to Shopify

Smile Makers

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 design system 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

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

Show me more

L&D is a big deal round here. Every other week, each S8 teamie gets a full day to focus on personal growth. Here’s why we think dedicated L&D days are the way to go.

It’s easy to talk the talk when we say we’re creating a culture of continuous learning. But L&D days really do help us do just that. Personal development isn’t put on the back burner or forgotten about until annual reviews roll around – it’s front of mind for all of us. We’re building better habits when it comes to learning new things, challenging ourselves and expanding our skill sets. And that can only be a great thing, right?

Because L&D shouldn’t be an afterthought

L&D shouldn’t be left for ad-hoc downtime. By putting two full days in the diary every month, we give ourselves a realistic amount of time needed to study, practice and learn. But most of all – we make our L&D more purposeful. Having that dedicated time makes setting (and smashing) SMART objectives way easier than if we were picking up the odd hour here and there. And seeing progress only spurs us on.

Back in the day, we’d spend the last four hours of the week on L&D (RIP 50/50 Fridays). But nowadays, each of us gets a whole day set aside in our schedule instead. We switch our Slack statuses to ‘Do not disturb’ for the day, say no to things that aren’t urgent, and generally just get our heads down. Try it – you’ll be amazed at what you can get done with a whole day of focus time.

L&D isn’t just reserved for junior teamies, or those who have the luxury of a little more time on their hands. Project managers, designers, copywriters, developers – we should all be allowed to learn new stuff. No matter how busy you are or whatever your personal goals may be, we all get the time we need to develop in our way. And the more we can learn from each other in the long run, the better our work will be.

Why we dedicate two days a month to L&D

More from the journal

In the design world, it feels like UX gets talked about a lot in terms of rules and best practices. But UI, not so much. So when we recently got to talking about our top UI design tips, we couldn’t not share.

It all started with one simple question:

What are your favourite UI design tips? Answers on a Slack thread, please.

First one that comes to mind for me is that a slightly off-white/pale grey page background feels more refined – and much easier on the eyes than a pure white. The same goes for using a slightly off-black instead of pure black.

That's a good one! Also true for choosing colours for fonts too, a dark grey is much softer than a pure black.

Never use full black #000000 – especially for dark mode. It should always be slightly grey. Similarly to Ellie, I prefer a slightly off-white colour, too. White just feels too bright and empty in most cases

Something I really like to do with UI is use less borders and play more with different shades of grey to create differentiation between elements.

Another one I recently learned was having transparent product backgrounds on a plain fill looks really minimal and clean 🙌

Oh shadows is a good one too. People using mad dark/heavy shadows is a proper gripe of mine. SUBTLE shadows are the way to go 😮‍💨

I’ll always reduce shadow spread where possible and increase blur and positioning. It leads to better, more subtle shadows.

Use consistent spacing/padding/margin using 4px or 8px grid systems (Variables in Figma are incredible for it)

In terms of UI elements, I always design things slightly smaller than I like. On the design file, the canvas is infinite and whitespace looks cool, but often the screen is crowded with navbars, URL fields, bookmarks etc, which can end up with a really long scroll, or layouts not being fully visible on the screen.

That’s the main reason why I always consider 810px height on an artboard instead of 1024 when doing 1440px width.

Agree. I like to design components based on a viewport size. I usually drag them off and test once I design to see how they fit on browsers. Chrome, for example, has 3 tiers of navigation rows and really shrinks the viewport height.

Also to add to this, when designing any form of input on mobile, always demonstrate what it looks like with the keyboard overlayed, like a real mobile experience.

I always go for 1440 x 960px because it's 3:2 ratio which is a majority of screens, but again hard to design when every browser presents different viewport heights 🫠

Always checking your design in Figma mirror on mobile is a great one too for testing font sizes and padding on mobile.

UI design tips: a thread

Back to the journal

Shopify’s latest seasonal updates have dropped. Worth the wait? We certainly think so. Here’s our round-up of the best feature updates from 

Simplify even the most complex catalogues

 feature will rescue us all from hours of admin. By mapping predefined variants to specific categories, managing and creating products in even the most complex catalogues just became super simple.

For example, name a new product "Wool sweater" and Shopify will automatically suggest the category of "Clothing" > “Shirts & Tops”. And once you’ve got the category down, all you need to do is fill in the recommended attributes. You can even upload photos of the same product in two different colours. Shopify will identify both and list them separately under the "Colour" attribute. Because it’s smart like that.

. You’ll only be able to use it if you’re on Shopify Plus – but, it makes the shopping experience even more seamless. Instead of hopping between separate PDPs to browse different colours, materials and dimensions of the same product, your users can see it all in one place.

But that’s not all. You can now give each variant its own unique URL, title, description and media gallery. A big tick in the SEO strategy box.

. Not only does it give you built-in product search functionality, it enables you to filter and sort collections of any size. Plus – you get a powerful recommendation engine, too.

But Shopify is now making its search feature even more versatile. By combining the classic keyword matching with semantic search, your customers can now search for products using natural language, like: "Red dress for a wedding" or "Something warm to wear in the winter". Told you it was clever.

Shopify is always finding new ways to customise the checkout experience. This latest update has meant us developers can now tinker with the 

 feature is continuously gaining new APIs, updated cart validation functions and more customisable UI elements, which means even more personalised checkout experiences aren’t far off.

For us, performance is always a biggie. We’re continuously testing and analysing everything from site speed to user journeys, so we were stoked to see that Shopify is making it even easier to keep an eye on performance.

, you can now monitor the performance of your storefront with real users' data and get insights on how to improve things. A great tool to make sure that your customers are always getting the best experience possible.

Picture this: you hired a professional photographer, rented a location and shot all your products from every angle. Weeks later, you realise you need to tweak an image or remove the background.

Well, the days of digging out the photographer’s details or finding a new date for a reshoot are over. With Shopify’s new 

, you’ll be able to make minor image edits on the fly. We can’t say for sure how great the results will be, but we’re keen to see how well it tackles simple tweaks.

We know the internet and people in equal measure

Mixing up work and play, every day
View Work

Take it from our people people

Why we dedicate two days a month to L&D

UI design tips: a thread

Shopify Winter Editions 2024: our top picks

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

Why we dedicate two days a month to L&D

UI design tips: a thread

Shopify Winter Editions 2024: our top picks

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