Practise App
When the pandemic began, I started working on a side project to help build better habits and practice new skills
During the pandemic, I designed and developed a mobile app that aims to help people in visually tracking their habit and pick up a new skill. I was lucky enough to be able to stay employed and adapted quickly to the dramatic changes in environment and everyday rituals. However, I was also falling to a mild identity crisis after having the lockdown time to pause and think more deeply about my growth. As a designer, I've always wanted to get my hands on in app development to be able to bring my vision towards execution more holistically. Yet, in the business of everyday life, there is never enough time to climb the steep learning curve after a day at work. Together with my flat mate at the time, I decided to take the crisis as an opportunity and learn how to develop a mobile application using React Native frameworks during the lockdown. The result was a working beta app that enables everyone to track their habits more emotionally with pictures and emojis rather than checkboxes and reports.
My role
For this passion project, I wanted to push myself beyond the traditional designer role and venture into the development, product, and business side of software development. Pairing together with my flat mate who specialises in back-end development, my responsibilities include:
Planning & envisioning. I created a business strategy that includes the business problems, potential monetisation strategy, and different phases of the app launches.
User research & literature study. I conducted user research and usability studies with prototypes while also diving deep into the vast literature of human behaviour and motivation.
Design and execution. I executed designs on the go towards my vision and created wireframes, components, illustrations, and an entire design system for the mobile app.
Mobile front end development. I learnt how to utilise React native and create user-facing components that works in both iOS and Android. I also learnt how to use Git, pass data between screens, and utilise different libraries to enhance the capabilities of the app.
Key concepts
I wanted to keep the key concepts easy to explain and reduce the scope as the main objective is to learn as much as possible and publish a working app.
Make habit tracking visual and emotional. Tracking habits and routines are boring. Most of the time it is a mundane cycle of ticking checkboxes and checking notifications. The hypothesis here is ticking of boxes with pictures, emojis, or notes could make the experience more delightful. Plus, it is a track record that you can replay in the future to celebrate your achievements.
Goal setting made easy. While there are plenty of research around the importance of goal setting, not many people are able to set realistic and achievable goals. The result is people often bite more than they can chew and lose motivation in the early stage.
Constructive accountability. I also believe that the app should have an accountability system that is constructive as opposed to being competitive. The ideas is the primary user should be able to pick up a skill / develop a habit together with someone to keep their goal in focus and increase their success rate.
The process
Sketching the high level flow.Living in a small space meant that I had to use the limited space available for brainstorming ideas. I missed the tactile feel of the open space whiteboard, but modern problems required modern solutions. Pictured below are my rather messy sketches on the dining table with post-it notes and sharpies.
Deep literature review. Throughout the side project, I also read through some of the best known books around habit-forming, including Nir Eyal's Hooked, James Clear's Atomic Habit, and also classics like The Lean Startup. The key points and insights from each chapter are sketched and noted, making the concepts easier to understand and retrieve later on.
From prototyping to code
Armed with a cursory knowledge around habit-forming, I started developing an initial concept of the app using Figma. It was a great experience as I learnt a lot about the iOS Human Interface Guideline and Google's Material design patterns. I then posted the video on Instagram story and to my surprise, there were a couple of friends and colleagues who reached out giving feedback and comments.
This then prompted me to start making the app for real. I started by reading the documentation on the React Native website, only to find myself immersed in the hours and hours of tutorial on Youtube. The journey was incredibly challenging in the beginning as I was only familiar with HTML, CSS, and basic Javascript. Learning React was its own beast and understanding how to pass Props and State management really took a while to grasp.
All the after work hours working on this app was finally worth it when I managed to run my code locally in my machine! This was the eureka that kicked off the snow ball towards many more iterations to come. In a very meta way, I took a couple of demo GIFs to track the progress of my app development journey to revisit in the future. Here are a couple of the screenshots of me fiddling around with a bare bones version of the app.
Guerilla testing the prototype
As I was developing the app, I constantly shared my progress in social media to showcase the latest updates and thinking. Sensing some interest from a particular group of colleagues and friends who commented in the story, I reached out to them to get real user feedback.
Positive validation on the visual way of tracking. Photos and note taking feature worked surprisingly well as a milestone indicator of picking up a new skill. One of my engineer friend who is using the app said that even though he's an engineer, he doesn't really like just using numbers to track. "I care more about how I feel after each session, and I think taking snapshots are a great way to capture this". However, the weakness of this visual tracking system is not every habit can be captured just by photos.
Need to understand the motivation and environment. Across all testers, the problem of forming a habit goes deeply towards personal motivation and self-actualisation. The idea of personal journal came across multiple times while some really committed to signing up for classes to change the environment around them. This wasn't really integrated into the app, and since the value to reward journey was significant it might pose the same boredom / routine challenge.
Lack of onboarding and hand holding. Many of the testers were looking for ways to best get the value out of the app. Some also commented that the login / sign up screen presented a barrier for them as they are not sure yet about what the app is about and were hesitant in creating an account.
The Practise App
An overview of this passion project can be accessed here:http://practiseapp.com/. As I am not actively working on this at the time being due to multiple life events, there are a couple of things that might not work as expected or updated. When the time is ripe again, I'm planning to continue bringing the app to the next stage. Meanwhile, I am glad that I was able to get a taste of front end development first hand and had a chance to learn React Native as a side project.
