Introducing Cut Out
Cut Out is a collection of selection tools to make mask of a image.
There are two main photo editing Apps carrying Photoshop's brand from Adobe - Photoshop Mix and Photoshop Fix. Both Apps are being continually updated with new features since 2015. Mix was branded as a photo compositing App with more complicated functions of layers, cutting, blend etc. Fix is branded as a professional photo retouching tool on the mobile.
Phase 1 Polish the Cut out 2.5
UI Problem: inconsistency with Fix
Mix and Fix have a lot of connectivities of functions and visual language. However, in the early version, the interface of Mix was needs far more polish compare to Fix.
UX problem: disorganized tools and properties
Redesign with minimized engineering work
Prototype to share
Marvel prototype of the iPad design.
Phase 2 Usability test
To have a better estimate of the new design and also directions we should go for, usability testing is a necessary step before shipping the design to our direct customers. A problem is that there was no history of usability testing in Mix team (new product team) and we faced constrains of sources to help. At the end, it's decided to let me conduct a casual test.
Participants of my usability test were screened on Facebook, with several basic information gathering of their familiarity with Mix or other Photo Editing Apps.
The testing included two parts - trying the current build and get to know the features; playing with the new design based on their understanding of tools.
According to the test, nearly half participants like the new design better while the rest prefer the previous version. However, compare the familiarity to photo editing, people who have more experience with photo editing/retouching tend to like the new layout better. Those people are more close to our product goal.
“I’m OK with that because in Photoshop you need to focus on two panels anyway” - Hong, Advanced PS user
After seeing Mix’s prototype, Jeff, who takes photography as hobby, played with the brush panel in Fix
Phase 3 New Design
Interesting coincidence with Desktop Photoshop
An interesting thing about this new design:
While I was finalizing the new design after the user testing, I heard from the Desktop team about a new masking mode in their new updates in May (a few weeks before my user testing). This is the new cutting and masking mode in Photoshop desktop and it shares crazy overlaps of design with what I was putting into the mobile Apps. The desktop designer who designed Selection and Mask mode did some testing two years ago and spent very long time to circle back and forth everything around the whole product team. It was finally shipped in May, 2016, just a few months before we shipped the new updates on mobile. This update on desktop increased the user engagement of cutting by around 70% for the first three months.
Phase 4 In build
After the release of the new update of Cut Out, our monthly active users are increased by 20% in a month. This is a great example to show how the power of design can make the difference.