The challenge

Create deeper relationships with customers

Towards the end of 2013, Catch noticed a shift in their customers – they were mobile and constantly shopping on the go. Picking up on this trend, they decided to focus their efforts on accquiring and pushing more customers towards their mobile app.

This meant adopting a mobile and customer first mindset and focusing on delivering the best mobile shopping experiences available to their customers.

Kickoff

Discovery

The discovery phase was a quick, high‐intensity effort that allowed me to audit the existing work, review the competitor landscape, understand the vision, and begin research into user needs, behaviours and pain‐points.

Interviews

I started with in house employees like the buyers, product owners, analysts, customer service personnel, operations personnel and many more key stakeholders.

I then reached out to customers using a survey. The surveys were lacking a human touch, so I convinced each team in customer service to use a rotating group of questions to ask custoemrs at the end of each call.

This provided me with great insight into the pain points that customers were facing. I also learnt what they needed to help them make better purchasing decisions.

Lastly, I also looked at their app store reviews to mine any additional insights and pain points customers were facing.

Competitor analysis

Alongside interviews, I also conducted an extensive competitor analysis to understand the landscape and what we were competing against. I spent time dissecting competitor apps and reading app reviews to understand what issues their customers were experiencing.

Affinity mapping

With the interviews wrapped up, I started to look for common themes to group interview insights. This was an incredibly helpful exercise as it showed the business the issues their customers were experiencing.

It also helped us balance features and customer experience issues. We took all of this and fed it into the product roadmap to figure out a way to start delivering a better experience.

Wireframing

Once we had our key themes and priorities identified, I moved on to wireframing ideas for those key areas identified.

Events
Cart
Orders
Settings

UX Solution #1

Consuming sales events easily

With increased sales events, customers were struggling to consume the sales in an efficient manner. The goal here was to split the events into categories to help customers hone in on specific categories of interest.

Time was of essence, so we decided to push out a quick update that allowed customers to swipe across categories and view sales within those categories.

Version 1
Version 2
Version 3

Adding filters

One of the biggest pieces of customer feedback we received was the difficulty they experienced consuming large sales. Search was great, but filtering would be ideal. Given time constraints, I jumped straight into mockups to quickly push out an update.

Event filters
Variant 1
Variant 2
Brands list

Filters: Part Deux

After a few months in the wild, I referred to our analytics and also did some quick guerilla user testing with a few colleagues at work, observing how they interacted with the filters. I found that many were happy with the filters, but the consumption of large lists was a point of frustration.

Some customers even missed the fact that they could filter products within a sale. Making filters more prominent became my top priority.

Canning the large lists and the movement back and forth between filter screens in favour for an accordion setup was a clear winner.

Updated event filters
Improved filter options
Post filter experience

Improving navigation between sales

Left left left right right right — sounds like a cheat code right? Thats the path customers took browsing between multiple categories, sales and products. It left them with no sense of where they were in relation to where they came from.

The solution was to implement a visual transition between screens so customers had an idea of where they were and where they came from.

We tested this internally and when we pushed it out, customers were over the moon.

Navigation transitions

UX Solution #2

Checkout experience

Getting people to part with money is always an issue. No matter how small or large the sum is. This final part of the purchasing experience was key and making customers feel safe shopping online is extremely important.

Observing how customers shopped via user testing taught us a lot. We found that a honest and straighforward UI was a clear winner.

Holding their hands and clearly providing a cost breakdown was really appreciated. It made customers feel safe and more likely to return and shop with us.

Checkout
Submit order
Order confirmed

Tying it all together with transitions

After pushing out updates to the web and app, I decided to push the envelope a little further. A great experience goes a long way and pays off in the long run.

Not content with the standard push up transitions that we had, I opted for a slighty more custom animation which also allowed us to tie in cues like reviewing previous purchases.

We didn't have to do this, but it showed customers that we care, value their business and feedback.

Cart transitions

UX Solution #3

Order management

The feeling we get waiting for our packages to arrive after a purchase is always going to be there. We want it now!

Customers who shopped on the app primarily had to logon to the website in order to track and manage their orders or use AusPost and tracking numbers. An experience laced with friction.

We decided to bring it all to them instead. Something they absolutely loved. They could use the app to both shop, track and manage their orders.

List of orders
Order details
Order tracking

Simple returns

Sometimes things go awry. Parcels get lost or even worse arrive damaged or torn. In order to alleviate all the negative feelings associated with a bad delivery, we made it easy for customers to initiate returns within the app.

Furthermore we leveraged the device camera to allow customers to take and attach photos, which made initiating a return and the turnaround time of a return faster.

Returning an order
Return filled
Return submitted

UX Solution #4

Onboarding customers

First impressions count. A lot. New customers who'd never heard of us and downloaded our app need to feel welcome and at home.

The solution was simple. A couple of easy pointers that explained how sales events worked and how we make the shopping experience a breeze.

Keeping with the friendly vibe, I decided on simple illustrations paired with clearly worded text to make new customers feel at home and comfortable shopping with us.

Welcome slide
Sales per day
How sales work
Features available
Notifications priming
Signup incentive

UX Solution #5

Retaining and rewarding customers

Customer retention was a key metric that we continously optimised and tried to improve. In addition to that we also wanted to convert existing customers who ordered somewhat frequently with us.

We realised that the best way to do that was to give them more. This came in the form of free shipping, exclusive deals, special access to sales and so much more!

With all of that in mind, the goal was clear. Create a hub that allowed customers to access these benefits and build a steady product offering that would convert existing and new customers. The result was a very successful subscription based membership program called Club Catch.

User flow & experience of memberships

Developer handoff

Part of a designers job is to supply developers with as much information as we can. It not only makes their job easier, it also helps ensure that our designs are implement exactly how we'd designed it.

I created style guides for both the app and web team and specced out components used throughout both platforms.

iOS style guide
Web style guide