Desktop + Mobile
UI
User tests
YEAR
2024
SCOPE
Delivery
TOOLS
Figma, Jira, Testapic
🔎 About Cheerz
Created in 2012, Cheerz is now one of the most popular photo printing service in France. Their mission ? Make people smile thanks to fun and innovative products and a fluid user experience online. I had the opportunity to work for Cheerz during a 6 months mission.
✓
+ 4 million users
of the app
✓
+10 products shipped every minute
👩🏻💻 About my role
When I joined Cheerz, the discovery phase was already completed on this project. Therefore, I was involved in the Delivery phase, which included: prototyping on Figma, analyzing user tests, following the implementation of the solution with the developers and testing the new functionality with the QA team before release.
ROADMAP
For this project, I was involved only in the Delivery phase, as the opportunity had been defined beforehand by the Product team as well as the Client Service team : users request a cross-device functionality, to be able to upload photos from their phones while creating a photo album on their computer.
THE PROBLEM
How can we create a cross-device functionality on Cheerz's website and app ?
OBJECTIVES
👍
Easy to use
Make users' experience
fluid and easy
⭐️
Convenience
Make it easier for users to create their product
🥰
User satisfaction
Improve users' experience on Cheerz's website and app
BENCHMARK
MonAlbumPhoto
—> Cross-device from desktop to mobile, using a QR code and a discreet tutorial in 3 steps to guide their users.
Pixum
—> Also a cross-device from desktop to mobile, using a QR code and a more visible tutorial in 3 steps to guide their users.
PROTOTYPING
Create a new experience starting with an MVP to test
Using Cheerz's existing design system, we developed a MVP to conduct user tests and validate the idea before iterating and offering a more developed UI with more advanced features.
FEATURES
Based on our benchmark, we decided that the simplest way to link the computer to the phone is to use a QR Code, that the users can simply scan to open a landing page on their phone to upload their pictures.
A tutorial in 3 steps to onboard users to this new functionnality
The most important thing when implementing a new feature is to guide users. By displaying this simple tutorial, we hope that the user journey will be frictionless.
A QR Code to scan and create a bridge between devices
Easy to implement, the QR Code is also a tool users are familiar with. This is why we decided to use this simple solution to enable users to upload pictures from their phones, to their desktop project.
A simple landing page on mobile to upload pictures
We decided to make the mobile landing page as simple as possible to make the user journey as fluid and easy as possible. They'll only have to clic on the unique CTA to upload their pictures.
USER TESTS
🗓 Methodology
To test our new features and collect feedback, we conducted user tests on profiles belonging to Cheerz's target group. We could access the recording of their session and hear their feedbacks. We also made them complete a questionnaire to test our hypothesis.
Unmoderated tests
5 testers
30 minutes
via Testapic
👤 Profiles
✅ What worked
5/5 understood well the tutorial and found this new functionality very useful
The tutorial in 3 steps was well understood and all of our testers found this new feature intuitive to use. They also spontaneously mentioned it was a very practical feature as they take most of their pictures with their phones but prefer to create their album on desktop.
- Hélène
5/5 scanned the QR-Code and managed to do all the steps on their phone to upload their pictures
All of the users understood the first step was to scan the QR Code and they all found it easy to select their pictures and wait until they are uploaded.
- Virginie
5/5 understood easily they had to click on the CTA "Display my pictures" on Desktop once their pictures were uploaded
Once pictures were uploaded on the phone, users had to come back to desktop and click on a CTA to display their pictures. This test confirmed that this step was clear and that the CTA was visible. All the users understood this step and successfully displayed their picture.
- Caroline
🛠 What we reworked
2/5 had trouble re-uploading new pictures from their phone
The tests revealed that not all users understood they had to scan the QR Code again in order to do a second batch of upload. Some of them spontaneously looked for a solution on their phone instead.
- Caroline
—> What we changed : we changed the final mobile screen to add a CTA "Un autre transfert ?" that could enable users to upload pictures again.
Prototype V2 :
Prototype V2 :
Only 3/5 fully understood the interest of the "Copy link" CTA under the QR Code
Under the QR Code, we added added a link that could be copied and pasted in case of a technical problem with the scanning of the QR Code; but also to encourage users to share the link with their friends and family members, to co-create an album together.
- Virginie
—> What we changed : we designed a tab called "Family and Friends" to make it clearer to users that the link could be shared to gather pictures and co-create the photo album.
FINAL PROTOTYPE
NEXT STEPS
Here are the next steps in the implementation of this new feature on Cheerz's website :
🔄
Iteration
We will improve the MVP thanks to the results of the user tests.
🧑💻
Development
The developer team will work to implement the full solution in Cheerz's ecosystem.
🧪
QA
IMPACT
REACH & USAGE
26%
of the users saw and clicked on the new QR Code tab. Among them, 42% used the QR Code feature.
71%
of the users who used the QR Code finalized their purchase, vs. 57% for the ones who did not !
CONTACT
Héloïse Barrand-Pinto
Product Designer