checkout-cover-image

Checkout redesign – hungryhouse

Hungryhouse is an UK based online food ordering platform which provides customers a great takeaway experience and a valuable partnership for restaurants.

Year 

2016 – Present

2016 – 2017

Products

Web, Iphone, Ipad, Android

Web, Iphone, Ipad, Android

Visit / Download apps

The Problems
  • Low micro conversion and overall conversion rate.
  • Too many steps to place an order.
  • Low app ratings.
  • Conversion rate is lower than industry standard
  • Poor customer satisfactions especially on mobile apps
  • Low app growth rate
Goals
  • Increase mCVR and CVR.
  • Reduce at least 3 steps to place an order.
  • Give logged in users the ability to change their delivery address, collection/delivery time and payment method on the basket.
Finding out the problems

Using google analytics can give us a good starting point to improve user experience. We first look through the user funnels (user journey) to identify which sections have high drop off rate, we then contact some of the users who drop off during the user journey. It has been a very effective way to find out why they have abandoned the section. We also listen to our user feedback from app store, beta user group, In-app feedback form and user tests in the UK.

Mobile workflow
Mobile development cycle
Hypothesis
Designs Process
  • Try to get users to checkout step 1 (with the 'Continue as a guest' copy), since we were seeing around a 60% drop off on the initial 'Sign in' screen.
  • Make the password field optional, but not completely standalone, since account creations are more valuable. As we've seen in the test results and in our user testing, many users didn't read the (optional) copy and figured that it was only one more field to fill out.
  • Give them the ability to easily become a member after placing an order once they've seen the value.
Prototyping and testing

Firstly, I would do some sketches with pen and papers, then move on to the computer to create some low-fi prototypes in invision. I would like to get some general feedback about the flow. Second iteration, I would then build hi-fi prototypes for more in depth testing. After gathering feedback from our tests. We began to develop a version which we can do A/B tests. We use Apptimize and google analytics to monitor our tests. If the desired results has been achieved, we would do a stage roll out (for Android) and carefully monitor the results. 

01 New user flow – 2 steps – small
02 Existing user flow
loggedin-checkout-boxes
loggedin-checkout-boxes2

Prototyping is a great way to figure out how to use animation to bring attention of those 3 boxes/buttons in the top of the screen to users. These boxes/buttons have important informations about delivery address, delivery time and payment method for logged in users.

Prototyping is a great way to figure out how to use animation to bring attention of those 3 boxes/buttons in the top of the screen to users. These boxes/buttons have important informations about delivery address, delivery time and payment method for logged in users.

loggedin-checkout-boxes3

In order to speed up this last important step of checkout process, we offer users a way to easily confirm their imporant personal details such as delivery address, delivery time and payment method. The idea here is collapse those 3 boxes and still show the delivery and payment details so that users can view these info even if they scroll down to the list and still be able to confirm their details. 

Less friction for new users
Less friction for new users

We introduced the guest checkout flow for new users, we also included an optional password. If user fill out the optional password field then they are signup as a member. If optional password field is unfilled, then a sign up card will display after users place an order. We find it works well for us by not forcing users to sign up as a member up front creates a smoother ordering experience and they are more likely to sign up after they placed an order.

11 Guest checkout – user upsell to member


The sign up card flow here provies another easy opportunity for users to sign up with a passowrd creation. User can also read more about the benifits of being a memeber in the order confirmation screen.

Prototyping is a great way to figure out how to use animation to bring attention of those 3 boxes/buttons in the top of the screen to users. These boxes/buttons have important informations about delivery address, delivery time and payment method for logged in users.

signup flow

New user signup flow prototype

Results
Results

We had great results for guest checkout in Android, we had a 23% of sign up rate increase and for overall CVR for guest users increased by 19%.


Selected Works

hungryhouse redesignWeb, Iphone, Android, E-commerce

Checkout redesign - hungryhouseWeb, Iphone, Android, E-commerce

Personalisation - hungryhouseWeb, Iphone, Android, E-commerce

© 2018 - eddiechungdesign.com