They welcome you home. They purr, they bark, they chirp. Some of them get you up for a brisk walk on a crisp Winter morning when all you want to do is stay under the duvet. They’re dependent on you when they’re sick and hungry.
All across the globe, pets are cherished companions and owners do what they can to Love Them Well. This is the insight that helped us make the online pet medicine retailer, Pet Drugs Online the best performing Magento eCommerce site in the world.
Although the business was performing well as an eCommerce platform, the real challenge was to stand out in the market and build trust with new consumers. We partnered with the client team to define their digital brand & user experience design in order to build trust, make the purchase of pet medicine easier with overall goal of increasing the online revenue.
For WONDR, delivering results for eCommerce clients is all that matters.
Just a year and a half later Pet Drugs Online have seen significant revenue uplift from investment in the UK, ahead of a European roll out plan.
YoY growth in 2019
Estimated YOY growth 2020
UK Pet Healthcare brand
Neil Fitzpatrick Pet Drugs OnlineWe went from 3rd biggest Pet Health Care brand in the UK to number 1 in 18 months. The work we did with WONDR rolled out across every channel. The brand message is clear. We are the brand that allows you to love your pet better.
Managing Director
Defining business goals
For WONDR it started with in depth discovery sessions to understand the business, its systems & people, listening to all staff members and compiling a coherent plan to set the project in motion.
Just simply having functional digital transactions is not enough anymore, building brand trust and an emotional experience is critical as it has always been for brands, just the technology has changed.
Working with a progressive minded culture that Neil has built in PetDrugsOnline gave us the opportunity to demonstrate that setting your digital brand right is just as important as getting your UX journeys nailed. We know how to help brands deliver great customer experiences that make significant uplift to brands online revenue.
Setting the brand
As part of the process we helped define the brand positioning of ‘Love Them Well’ and created the brand system for all digital channels. This included brand mark refinement, typography, UI styling, photography guidance, patterns, eCommerce component styling, as well as a complete set of social and video templates. This set in place a simple set of guidelines for the in house creative team to implement.
Dermot O’Shea WONDRBuilding brand trust and an emotional experience is critical as it has always been for brands, just the technology has changed.
Digital Architect
Building a richer user experience
We researched this brand and user experience extensively to get a solid understanding of what the opportunities were there to deliver better customer experiences and increase revenue.
Dermot explains, “The brand had a reasonably good conversion rate, however it was clear from research that the PDP and checkout pages needed particular attention. We had to make the process of uploading prescriptions easier and remind people that this is all for the love of their pet, so finish the journey.
We carried out extensive user research which included GA analysis, user video analysis, stakeholder interviews as well as one to one sessions with customers to establish what works best for the them.
We prototyped fast, tested with the call centre staff & real customers as we went to refine and adapt the user experience. This was invaluable as it allowed us to make modifications to help us refine the checkout in particular. The financial success today as a result of this, speak for themselves.
Oisin Hurst WONDRDon’t be frightened. Don’t skimp on the user research as part of your budget. Listen to your customers, it will pay to do so!
Digital Architect
Putting design into motion
Oisin Hurst, WONDR Creative Director says, ‘After we set the brand we created a cloud based tool kit which allowed all of the integration team and 3rd party tools to access one central library to get all the brand assets and styles. This made iterating new features and rollout of front end much faster than traditional methods.’
Setting emotion on the website was important and we did this through video, imagery, typography, copywriting and colour palette to communicate the brand proposition.
The prescriptions journey was designed to be effortless, leading with in site search to help customers find what they needed faster. To create a richer, topical and genuinely useful experience we created an advice centre for users to discover pet-care tips and related, relevant products.
Video content is critical for mobile and we build a system to allow the brand to launch the platform and refine core propositions, guided by three pillars, Trust, Convenience and Value.
Neil Fitzpatrick Pet Drugs OnlineIn an already crowded market, we are the only brand in the UK growing at that rate and that shows just how on the money the overall brand revision was.
Managing Director
A partnership for success
Partnering with clients for product management can’t be underestimated. We helped the team to brief, document and liaise with the chosen integration partner.
Understanding the development process, we assisted the Product Owner in Pet Drugs Online, pushing as much functionality into the first release as possible and worked closely with the team using Confluence to set the project and manage its delivery.
Creating a lasting bond
The brand invests heavily in PPC and SEO but to complete the journey we needed to build audience engagement and real connection. In a move away from generic posting we devised a campaign that would build trust and emotional connection. Brought to life through some simple social video advertising that struck a cord with pet owners.
Here at WONDR, we’re excited to reveal that we had the exciting job of setting the brand narrative for the CSS Design Award’s Website of the Year 2018 showcase website.
We’re so proud to be flying the flag for Irish design 🇮🇪 at on a global stage. The site is an immersive underwater world titled “Coral” — a metaphor for the sea of creativity and design unearthed by CSS Design Awards.
We caught up with two of the WONDR team responsible for bringing this landscape to life. Meet Creative Director, Oisín Hurst and Creative Front End Developer, Clément Grellier. They chatted about the highs, the lows and all the jellyfish in between.
What was it like to be involved in creating Website of the Year Awards site?
Oisín Hurst: Exciting and intimidating.
Clément Grellier: Yes, it was great to work on something focussed on collaboration with freedom of creativity. Of course there’s a big responsibility and expectations at are an all time high — it’s being seen by the entire design community! But that’s an incentive to make sure the work was unique and interesting.
What makes the CSS Design Awards so special?
OH: For me, their mantra of ‘Inspire and be inspired’. The highest thing you can do as a creative is inspire others. If you have work commended on CSS Design Awards you have a platform to potentially inspire someone else. That cycle of creativity can start again. It’s a great social goal.
Why, in your opinion, are the CSS Design Awards important to creatives in the industry?
OH: To me it’s the peer review that adds value. With the CSS Design Awards you genuinely rate the judges — it gives huge weight to the awards. It’s not someone from outside of your field judging design.
I also have a huge admiration for the effort that goes into judging and maintaining the site, and the depth of the view, you can really lose yourself in it. There’s lots of great work to discover.
CG: Yes, for me the wider community aspect as well as the peer review of the rewards.
What inspired the brand narrative “Coral”, our world under the sea?
OH: We wanted to create a narrative that tied in with the proposition and positioning of the CSS Design Awards brand and translate that into a visual concept and a wider digital experience.
Oisín Hurst WONDRTwo aspects stood out to us; firstly the sense of community at the heart of CSS Design Awards, and two, the cyclical journey of inspiration.
Creative Director
It was a metaphor that encompassed thriving creativity and crucially, the idea of community. The notion that we are floating through a vast sea of noise and debris on the internet but when you discover CSS Design Awards you land on a vibrant creative community. It’s our own creative island to be inhabited, much like a thriving coral beneath the sea.
Can you tell us how “Coral” was brought to life?
OH: The coral is a neon island of creativity, floating in a vast digital environment. We created the 3D hero coral by dressing it with neon plant life and lighting it with hues of pink and cyan. We also created a range of secondary corals that included the trophy, crystals and our jellyfish (named Squee).
There’s also a little surprise when you reach the footer. When a visitor scrolls down to the base of each page, they break the water’s surface and discover that the entire experience is actually upside-down.
You explored a few themes before you got to “Under The Sea”, what ideas were killed during the process?
OH: We explored a few different avenues.We wanted a world that had enough variety to create a convincing environment. Our initial idea was a typographic route that encompassed a complete alphabet with seven versions of each letter. But in the end, we decided the typographic route was a little too cold and clinical. It felt natural to come back to the coral which was a richer interpretation of community. That notion was core of the brief.
Oisin, typography still features heavily, how did that evolve?
OH: We took some of the typographic learnings from our initial creative research into the final typography for the site. We agonised over getting movement lifelike and in the end we decided it didn’t have to be literal, as long as the underwater feeling was achieved.
That movement is integral to the theme, can you talk us through that, Clément?
CG: I tried to recreate some of the ideas Oisín had around typography by taking 2D assets and making them look 3D to give them depth. We were keen that the letters would move with the mouse to mimic the underwater feeling of floating, in order to match the coral world.
Clément WONDRHarmonising the movements with the under the sea concept so it was believable was important to the concept. It also kept it natural looking, interesting and interactive.
Front End Developer
The 3D coral is a hero element, can you tell us about the making of it?
CG: An element of play was really important which is why the 3D effect is key. Again we wanted to mimic the underwater feel and make it look more dynamic and interesting for the user.
OH: Yes it was key to bring that habitat to live with 3D. At first we made rotating 3D animations for every asset. We had a master coral with about 5 different coral “children” not forgetting, Squee, our jellyfish. We even created a coral version of the Website of the Year trophy, the CSS Design Awards logo and our own WONDR brandmark that blended nature and technology together.
How was the collaborative process between design and front end development for this project?
OH: It was really open. We didn’t do detailed page designs. It was always more of a conversation on how things could work rather than a prescriptive process. Clément instinctively knew how to elevate the designs I brought to him, creating an immersive experience that surprises the user — giving it the ‘wow factor’ I suppose.
CG: Yes, it was always a work in progress — we just kept bouncing ideas off each other. I think this is the best way to work. It’s how we were able to make the experience a bit more interesting. Open communication meant we stayed on schedule, which is important!
It’s sounds like that dialogue was key to this project?
OH: For me, when I finish something there’s always the temptation to go back and over-work it. It was really important to have the input from the team to know when to stop!
Any challenges you had to overcome once you got into the project?
CG: One of the main challenges was performance because of the amount of data. The weight of data for this project is quite high as we have to parse all the votes, nominees, judges, winners and display them in a dynamic way. It was quite challenging to handle all that data and re-organize it, sort it and filter it.
The other challenge was the assets. As we wanted to make the assets interactive and have them move and rotate, we needed to have a sequence of images for each asset ,like the letters and the coral, which increases the weight of the page. We tested and went back and forth before finding the right way to do that and made sure everything is loaded correctly.
We used very specific properties like masking videos, which made the QA more difficult because some of these properties are not available on all browsers. We often had to code a specific alternative to make sure it displays properly on all modern browsers (although the experience is best viewed on Chrome).
OH: Yes, as you work through it, you think you’ve killed all your darlings at concept stage, but then you realise there’s plenty more to kill. We had particle effects and additional movement that sadly, had to be cut. There comes a time you sacrifice things to the ‘gods of performance’. You have to decide what’s bone and what’s flesh. Protect and what you can, sacrifice what you can’t.
Favourite thing about the Website of the Year website, now it’s complete?
CG: The underwater universe. The creativity of the concept and bringing it to life.
OH: The magical realism of the site. The fact it floats and it feels electronic and magical at the same time.
You’re now well into your fifth year, how did you get started?
Yes time does fly. In 2014 it was a busy year for me both professionally and personally. I had just got married, had a kid, bought a house and I thought to myself you know what I need to do next is set up a company, sure what else would I be doing.
I had built a good reputation and bank of work but I knew the model for the work I wanted to do was changing and I had a clear view on what it would evolve too. I had plenty of good offers abroad and in this market to build what would become WONDR within the comfort of a larger agency environment. I felt it was best to stay at home in Ireland, re-programme my skills, stay independently owned and build something from the ground up that I would be proud of.
I had contacts made from years working in branding, one of them being Oisin Hurst (now our Creative Director). We worked on the GAA rebrand together and he was keen to introduce myself to a company called PCH who’s branding he was working on. They needed a strong digital partner to help them transform their digital presence to bring their new positioning to life.
This was a very interesting project and it gave me the confidence to get the business started. This became WONDR’s first client and was a major part of the initial story that helped the company to get started. I’m still very thankful to Philip Dwyer & the PCH leadership team for putting trust in myself to work with them as they were working with Fantasy Interactive at the time and it was a good endorsement to land this project.
Do you think the digital industry has changed since you’ve started?
Yes it has evolved massively, just look at any project you’ve done that is over 2 years old and you can see how fast things can date if they’re not constantly polished and optimised. We’re still in the early days of digital, so if people think digital is fast and complicated now, wait till they see what’s coming next.
I could go on about the role of data and user research, but most people by now know this is the future already but yet struggle to apply it to their day to day. If people just started with this they’d see huge improvement in their digital brand experiences.
One other area I’ve noted is how the relationships we have with client partners is evolving. We’ve helped client teams to structure and build their teams internally so where possible they don’t need us which is kind of against the typical ‘agency’ model.
We’re always keen to keep tasks in house on the client side where possible by building design systems that work across all applications and encourage clients to keep their budget to work with ourselves on hero roadmap projects instead.
Business growth comes out of brave choices.
Dermot O'Shea FounderYour new positioning talks about clarity + bravery, why?
We like to carry out detailed discovery and definition stages that help to remove the perceived complexity from digital projects. I often tell new clients, we do the thinking up front to de-risk their project and investments as quite often digital change projects can evolve significant capital to make them happen. We’re there to make it a success.
When we looked at our positioning, we interviewed all of our key clients to help us shape and inform our approach. A common theme that kept coming back was the idea of a digital journey which they trusted us to guide them through.
Some were keen to highlight we removed the complexity to help bring them goals, experiences and results that mattered. We also took onboard the feedback that we’re very honest, open and not afraid to give people the advice they need. Anyone who’s worked with us will surely back us up on this point 🙂
We refer to this as being brave to make the right choices for the brand, not what’s right for our revenue or portfolio of work. Quite often digital projects involve cultural and organisational change where you have to make the brave choices up front on things such as brand, resourcing, technology & media to be successful. Business growth comes out of brave choices.
You describe yourselves as a Digital Product Practice. Why?
Ireland and in particular Dublin is changing all the time due to the sheer scale of international tech companies that come here, so we felt that the idea of an agency or studio belongs to the legacy of Advertising.
Their model works for them but not for us. We didn’t want clients to assume we worked to the same methodology or process as we have invested significant time in developing our ways of working.
Alot of our client work is on digital products and we operate an agile kanban methodology so we needed a description that reflected more of what we did day for day for our clients.
Which of your projects to date do you think epitomise clarity + bravery?
We recently partnered with UK brand called Pet Drugs Online. If there was ever a project that needed clarity + bravery then this was it. For us there was huge potential for this brand to disrupt the market and become the ‘boots’ of pet healthcare. We spent a great deal of time bringing clarity to their brand, UX & technology choices.
We were brave with our approach to refresh the brand and re-platform at the same time, the end results has seen a 47% year on year increase in revenue and each month they are breaking new sales records they never saw before.
You’re a company of internationalists, with talent from all over the globe. Is hiring from internationally important?
Yes we have a wide selection of languages and countries represented in the practice. It really helps to keep us open to change and the outside world as our team bring their experience to Ireland from France, Japan, Brazil, Canada, US and a far.
We’re constantly going to international events and awards to help keep touch but also to validate we’re on the right path.
Dermot O'Shea FounderWe aim to be a catalyst that sparks the next generation of digital talent in Ireland
We want to further add to Ireland’s growing reputation as world leaders in design, as we firmly believe the best work can be done from Ireland. It’s why recently we collaborated with CSSDA Website of the Year awards where the world’s best work was selected.
To be involved in this greater story is an honour but also validates WONDR’s reputation amongst our peers as being as good as any other market.
Do you have a vision for WONDR for the next 5 years?
We love eCommerce work in particular so in 5 years time it would be an ambition to be known internationally for our work in this field as I believe we’re already good as any other places doing this. Too many brands are still prisoners and passengers on their technology platforms and it’s our ambition to help people unlock this.
Finally I keep coming back to this idea you have to have pride in what you’re doing or else what’s the point. When I look back in 5 years time, I want to feel proud of the work the team has done. It’s my job to foster the culture to enable this to happen.
It’s been a busy year for WONDR. We launched some of our most successful projects. We made it our mission to empower clients to set their digital brand story and helped them realise great success to boot. We achieved some big goals in 2018.
We worked on some challenging and exciting projects. Won global awards, made big moves, got fresh meat by way of new team members (shout out to Tash the dog, our new favourite employee who freelances from time to time). So here’s how it all went down.
Winter
We kicked off the year with a Website of The Day award from CSS Design Awards for our work on New Music Dublin. Making us the most awarded Irish practice across CSS Design Awards, FWA and Awwwards.
We made waves with ESB Energy UK working on a successful digital branding project and full site experience, creating motion design that even managed to work it’s way into the TV ad — proof that collaboration between digital and offline creates better experience for brands.
Spring
We welcomed Pierre to the WONDR team, all the way from France he brought enthusiasm, hipster bikes and the most french moustache we’ve ever seen.
Then we got some amazing news — flying the flag for Ireland, we were named in the Top 10 studios in the World by CSS Design Awards. We’re absolutely convinced the best digital work can come out of Ireland, and this year we’ll be looking even more to set the international benchmark for great work.
Summer
In June we moved into our new office space on Wicklow St, right smack bang in the middle of the city. Four floors of creativity and a rooftop with city views (we’re yet to take full advantage of). We quickly became accustomed to bad buskers on Grafton Street, pints in Mary’s bar and the ‘Big Debate’ — which burger is better, WOW burger or Bunsen (the jury is still out).
Autumn
We welcomed our new Director of Operations Emily Miller — fresh off the plane from Canada, she decided poutine and snow is over-rated and there’s no place like home for the craic. She’s brought knowledge, expertise and invaluable insights from markets across the Atlantic.
We launched Pet Drugs Online’s new platform and turned UK’s most popular pet e-commerce platform into the world’s best performing Magento website by the end of 2018 — proof that partnering with clients and listening to what they need is the way forward.
That was just a little glimpse into the world of WONDR over the last 12 months.
Thank you to everyone who partnered with us, inspired us and liked us in 2018, roll on 2019 as we have some big projects and changes happening.