Rocketbook App Video Tutorials
End-to-end experience design and video production for a reusable notebook app used by a million users
Role: Mobile UI/UX Designer
May 2019 - August 2019
BACKGROUND
What is Rocketbook?
Rocketbook is a tech startup that makes reusable notebooks with a mobile app that scans and send users’ handwritten notes to connected cloud destinations (Google Drive, Evernote, etc.) During my time as a Mobile UI/UX intern, I worked on designing UI improvements to the existing app and ideated a new section comprised of in-app video tutorials.
PROBLEM
"How do I use it?"
New users face many challenges and often have a surplus of questions when it comes to scanning and sending their notebook pages for the first time. Difficulty in understanding the product process flow can discourage users from integrating the Rocketbook notebook and app system into their productivity workflow. My challenge was to identify ways to make this process seem more approachable and create simple, digestible steps that users can easily comprehend and follow.
INSIGHTS
Early insights from the customer experts
During an ideation meeting, members of the product, marketing, and customer support team came together to generate common pain points for users during the onboarding process. We reserved a white board meeting room and rearranged sticky notes of frequent user questions we had seen through our emails, social media comments, and user interviews conducted in the past.
After this meeting, we identified six themes of problems that users frequently asked about. We later adapted them to tutorials we wanted to create for our users.
RESEARCH
Studying existing app structures
The next step was to design the organization and hierarchy of the tutorials within the app. I considered the user experience of accessing these videos. Where would a user expect to find video tutorials? Where would one go to for help? I compiled screenshots from other apps' tutorial sections to see what process and structures users might already be familiar with.
Based off existing patterns from the apps I researched, I brainstormed and sketched out ideas for different ways the home for the FAQs/tutorials might look like.
PROCESS
Storyboarding steps
Something I loved about this internship was having the ability to incorporate my film and video experience into my design role. The team was really excited about the idea of having GIF-like video segments accompanying each of the tutorial steps. I created storyboard sketches of the different steps we wanted to film for each of the six identified processes.
FILMING
Putting everything into action
I brought my camera and tripod into the office and filmed each step of the tutorial processes. I ended up with dozens of takes of every action and spent a good amount of time sorting through all the footage and making trimming edits and color-adjustments before exporting each clip.
I ultimately filmed and edited 20 short videos across the six different tutorial themes and worked with our developers and product team to fully design the user experience and navigation menu.
RESULTS
We're live!
Today, Rocketbook has fully implemented my tutorial videos and screen designs into the app, which has been downloaded by over a million users! Download the Rocketbook app to check it out!
REFLECTIONS
What I learned
From this project, I learned how to integrate tools such as Sketch, Abstract, and JIRA in a product team workflow. I learned the importance of gathering insights from team members, and I learned how much I love working with small but mighty startup teams that allow me to make a real impact on their product!
Rocketbook members interacting with users in our WeWork
