Oak App Redesign Sprint
Overview
This app project was a rebuild of the meditation app ‘Oak’. Oak is a meditation and breathing app designed for mind-hackers and includes guided meditation sessions, where users can track their progress and goals. It takes difficult-to-quantify practices like meditation that makes the results tangible. An original version was released by the Oak team in 2017.
Total project time: 4 weeks (until passing over to a developer)
Original Scope: Redesign the Meditation Select screen of the Oak app (this actually turned into a total redesign)
Interesting info: The entire Sprint was run remotely. My role was a freelance product designer and creative director. I worked closely with a product manager at AJ&Smart, a developer from Oak, and the CEO of Oak, Kevin Rose.
The original version of the Oak app
Step 1: Initial kickoff call & remote expert interview
We kicked off by jumping on a conference call with Oak, with the aim of getting the team up-to-speed with what Oak was thinking about the project, getting as much information from them as possible, and for us to really scope out the project. While Oak CEO, Kevin Rose was talking I was writing down ‘How Might We notes’ on post-its. I made extra effort here to note these as clearly as possible, since we were working remotely with the client and there was less opportunity for explaining the rationale behind things.
Step 2: Creating the goal & Sprint questions
I then created a goal and Sprint questions. I suggested what this should be based on everything we had discussed with the Oak team.
Step 3: Create the map
I then created a map, which really helped us understand the flow of the product. The original scope here was to focus on the on-boarding, as you’ll see highlighted, but we actually expanded past this and did a total redesign.
Step 4: Lightning Demos
The lightning demos in the Design Sprint is the exercise to gather inspiration before moving on into the 4-step Solution Sketch! This happens during the Monday of the Design Sprint and it's used to gather inspiration. The task is that everyone on the Design Sprint team comes up with 3 real-life examples of products or services that could be used to inspire the solutions. Everyone will present their findings and hopefully the team will have get some inspiration.
During a normal Sprint we’d actually physically find examples and then present them to each other, but to optimize this part of the Design Sprint for it being remote, we did a few things differently:
Pinterest: I used Pinterest to find inspiration for the Design. We knew from speaking with Kevin that he was super inspired by all-things Japanese design so I did some Pinteresting and found things like Japanese stationary, interiors, and products to show to Kevin. These things actually inspired a lot of the colors and visuals that would later end up in the app.
Kevin’s inspiration: We asked Kevin before our initial call to find some products that inspired him, and to present these to us on the call, so we can have an understanding of subjectivity when it comes to design and to push us in the right direction. In the usual Design Sprint Lightning Demo-way, we told him it of course didn’t need to be other meditation apps and that he should look for inspiration in other products and industries.
Step 5: Creating the first concepts
I usually always do hand drawn concepts first and then like to have my team come together and vote on the concepts. I even put together some mood screens. We wanted to send him these hand-drawn concepts so he could then leave feedback in-line exactly where he was and tell us what he liked what he didn’t like.
Step 6: Voting on the concepts
We then asked Kevin to vote on the things that he liked in these concepts, so that we had an idea of the direction he liked before I started on the design. We also had him send us videos of him talking about the sketches so that we had an idea of what he was liking and not liking.
One piece of feedback we got from Kevin at this stage was that he loved the illustrations we had included, but he was concerned that we wouldn’t be able to find a good illustrator to work with on the project, but luckily I knew someone who could do this really well. I sent the illustrator the different directions that we were thinking of going in. I showed her the Pinterest board, the screens, and the general concepts. She then started working on some beautiful hand-painted work.
Step 7: Prototyping
Based on all of this insight and feedback from Kevin, we then moved forward to creating the first prototype. We also decided at this stage that instead of using vector graphics like in the current app, we would replace those vectors with watercolors, and that’s the direction that Kevin wanted to push in as well.
I went from the hand-drawn storyboard step-by-step and started creating it in Figma, then exported the screens to Marvel for prototyping.
Step 8: First feedback from Kevin
At this stage we wanted some initial feedback from Kevin, so we sent over our first-draft prototype. We wanted the app at this stage to feel as realistic as possible, so that we get rich feedback from him, so we were sure that the prototype had things like animations. We sent over a few variations of the prototype, each with a slightly different design, which allowed Kevin to pick his favorite before I went all-in with design.
Time update: At this stage we’re at day 3 in week 1.
Step 9: Alignment
By this stage, the end of week 1, we all had alignment on what the new version of the app would be, and we had full buy-in from Kevin, so I could confidently move forward to create all the screens.
Step 10: Creating the screens
I spent about 2 weeks working away at creating the screens.
I used Figma to lay out all the screens
I found the color scheme early on but changed the structure of the screens constantly
I did go a little too crazy with the onboarding screens in the beginning but Kevin pulled us back to something more elegant.
Step 11: Handover to developer
At this stage we passed everything over to the developer Kevin was working with. With a few check-ins here and there, 3–4 months passed and before we knew it, the new Oak app is on the app store and getting loads of love from around the internet!