developing a new creation studio 

the proposition

  • KR1. Improve Editor conversion rate by 2%, validated through AB tests (annual revenue impact: +£1million*)

  • KR2. Achieve an Ease of Use score of 4 or higher in the Editor, preferably validated through AB tests (retention and 2in5 impact)

Migration Vs Optimisation

Photobox's legacy platform ran on Abode Flash. In January 2019, Adobe informed us that our legacy studio which ran on Flash, would no longer be supported as of December 2020. Therefore the business put a team together to build a new platform, which included a new rendering platform to let customers, to continue to create the products they love. We went to 100% in September 2019, migrated all calendars and diaries by October 2020. Whilst it was important to get the core products over to the studio, we decided that it was time to focus on improving the studio, to give customers the best experience possible.

Goals

My Role

My role on the team included working closely with my PM, and EM as well as designers on thinking though the best experience for understanding which features would bring the most value to our customers. I also worked with the innovation team to understand their road map of new products, and graphical assets to understand how these would be implemented within the UI.

Screenshot 2021-02-15 at 15.49.29.png

Timeline

6 months ( 2 Quarters)

Phased releases:

December 2020

January 2021

February 2021

Current releases

  • Renaming Creation -100% of traffic

  • Re-position of Editing Toolbars - 50% A/B

  • Saving layouts - 50% A/B

  • Apply layouts to all pages - 50% A/B

  • Hover States - 100%

Tools

  • Figma

  • Usertesting.com

  • Usabilla

Original creation studio

Understand

When I joined Photobox the marketing team was in a period of re-branding as well as finding new ways to keep users engaged, through social media platforms. As well as this they ran a discovery piece on our customer segments to define new archetypes for the business to work towards. To get an understanding of the project I quickly identified the key drivers influencing the success of the program.

  • Users, New Vs Existing

  • Customer Segments & new Archetypes

  • Company brand

  • Business initiatives & concerns

Behaviours for existing customers

  • Visits Photobox 1/2 times a year - makes one large purchase

  • Usually buys a Photobook or Calendars

  • Takes several months to complete purchase

  • Adds pre-made backgrounds and illustrations to their creation

Frustrations

  • Current editor does not offer what the previous platform did

  • New cognitive learnings, takes longer to make

  • Likes to duplicate an existing creation and modify​

Wants

  • Better background and variety in assets

  • Easy way to duplicate a creation

  • Better inspiration to help create the product they imagined

An example of a 6+ Year cohort customer who usually purchases items to remind them of key milestones of their grandchildren's lives

Existing UI in 2019

A4BookZoomButtonBug.PNG

The original designs were using a very cold, very masculine palette that was now not reflective of the new brand.

User research

We decided to review the existing UI and run end to end testing to gain a better understanding of exactly what our customers thought of the new creation studio. 

We set up unmoderated end to end testing on UserTesting.com with 10 participates. The participants were broken down by 4 female PBX users, 1 male PBX user, 4 female Non-PBX users, and 1 male Non-PBX user.

We decided a task based approach would give us the most insight with follow up questions. The research tasks broken down into 3 tasks:

  • Task 1- Please start your creation from scratch and upload 10 photos of your choice to create your Photo Book. Once you have completed this task click next.

  • Task 2 - Please personalise your Photo Book as you wish with your 10 photos. Once you have completed this task click next.

  • Task 3 - You decided you would like to re-name your creation so that you can find it easily for later use. Please re-name your creation. Do not purchase the Photo Book you created. Once you have completed this task click next.

With the follow up questions:

  • How would you describe the overall experience you just had? 

  • On a scale from 1-5 (1 being very poor and 5 being excellent), how would you rate the overall experience?

  • What did you find most frustrating about the experience, if anything? Please describe why.

  • What did you like the most about the experience, if anything? Please describe why.

I'm trying to make more of an effort to put photographs actually into hard copies. Because I think we live in a digital age now where they tend to get overlooked and forgotten. So I really appreciate the simplicity of something like this allows me to do it quickly. A allows me to make some basic personalization and I don't need any prior knowledge or any prior experience."

results

Out of the 10 participants most of the participants said that they found the studio easy to use, and that they liked the simplicity of the design. However they noted that UI was very dark and masculine, they didn't feel inspired and would like to bright colours and more creation tools. They also noticed that the layout of the studio was a bit confusing, and would like to see the editing tools all in one place.

MY discovery process

STRATEDY

  • Stakeholder discussions

  • Project Goals planning with PM & EM

  • Brand Strategy

  • Measure of Success

  • Project Priorities

Discovery

  • User Interviews

  • Surveys

  • User Testing

  • Competitor Research

  • Analytics Review

analysis

  • Use Cases

  • Persona Creation

  • Story Boards

  • Red Routes / Critical Design Paths

  • Experience Maps

  • Workflow Diagram

design & test

  • Mood Boards

  • Flow Diagrams

  • Wireframing

  • Low Fidelity Concepts & Prototypes

  • High Fidelity Concepts & Prototypes

  • Testing / User Testing

production

  • Internal Launch and Testing

  • Beta Launch

  • User Testing

  • Launch

  • Live Testing (A/B Testing) Tweaks and Improvements

  • New Features

2020 studio revamp

Screenshot 2021-01-04 at 08.40.49.png
Screenshot 2021-01-04 at 09.00.16.png

As well as introducing new features, we updated the UI, removing the dark Primary header that made the studio feel oppressive and uninspiring. We also simplified the UX on the main creation space, removing all the CTA's from the canvas area, and introducing the side toolbars. This gave more space for the creation and gave the user more focus on their images. As a team we also improved our refinement to make sure that all the new features were approached mobile first and introduced molecules that could be scaled. This has now ensured a harmonious experience across mobile and desktop.

New features

Toolbar optimisation

ACB GIF longer.gif

We decided to move the toolbars to the left hand side, to prevent the creation size from scaling down. 

Duplicating creations

Duplicate.gif

We also introduced the ability for customers to duplicate their creations. 

EDITOR OUTCOME

We released iteratively over the course of around 12 months until the flash deadline and then optimised beyond - we successfully migrated and protected 100% of revenue exposed to Flash by the depreciation date. Thanks to our rigorous customer insight strategy and A/B testing approach we were able to drive experience and revenue upside throughout the project.

 

This has resulted in +33% AoV, -50% creation time and +5.5pp better conversion at initial launch. Editor achieved an average SUS Score of 87.5 with a standard deviation of 10.8.

 

• Over 225,000 books sold in the first year of real testing, with Editor handling high peak volumes with a 99.99% crash success rate

• A/B testing over Q2 revealed we were operating at around 5.5% better CVR vs Flex studio. Likely due to the creation time being reduced for the majority of customers by vast amounts - customers get to the ‘Wow!’ faster.

• AoV had a 33% upside, roughly £10.44 per creation compared to Flex the year before. This is due to our improved upsell UX.

Screenshot 2021-07-27 at 12.15.01.png
Screenshot 2021-07-27 at 12.15.11.png

Ease of use

Once we released the new features, we wanted to see how customers were finding the studio at different points of the journey. 

I set up two surveys on Usabilla one was prompted after 5 minutes in the studio. The other was at the checkout phase. 

We found that after 5 minutes we were scoring neutral of 3.2 but actually at the end of the journey it increased to 3.9. This is due to the fact that existing customers have to learn how to use the new studio and therefore their initial responses were more negative than when about to purchase.  

This is an amazing base line for the editor. With continued optimisation efforts we aim to get the in editor score to 4 and at checkout to 4.4.

Screenshot 2021-02-17 at 13.24.30.png