If You Build It: Learning UX/UI Design From Scratch
When I was in middle school, I regrettably had little appreciation for my mom’s cooking efforts. I would come home from school every day anticipating to see Mrs. Fields in the kitchen baking me cookies. This unrealistic expectation led to a series of disappointments and a decade’s worth of scoldings. I would often ask myself, sometimes out loud, “How hard can it be to actually make a good meal? It looks so easy.”
I realized years later that, in fact, it’s very hard to cook well, especially under the time constraints my mom regularly faced. My mom had the responsibility of feeding me and my four siblings: five equally obnoxious children who each had unique nutritional needs and taste preferences — and this was just one of her many responsibilities. When we offered unsolicited feedback on her food, although obviously frustrated, my mom listened, researched other recipes, and continuously improved her cooking until my house became known for its food.
Learning to design user-friendly software is similar to learning how to cook- it takes time. In fact, unlike in the movie Field of Dreams, “if you build it, they will most likely not come.” Just like someone learning to cook for the first time, beginner UX/UI designers often have little idea “where to start” when designing an interface, so they just use whatever design feels most intuitive, without doing much research. This often leads to blunt negative feedback, the kind that bratty kids give their parents who are trying to hone their cooking skills on top of a seemingly endless amount of other tasks.
We had a similar experience at nOCD two years ago when I started building our first UI. Because I didn’t know much about UX/UI design at the time, I created a design that I felt was intuitive, paid a firm to make it look more professional, and shipped it to our users. They hated it with a burning passion, as they expected the app to flow as well as other popular mental health apps like Headspace and Pacifica. I quickly felt a level of frustration similar to what my mom must have felt when my siblings and I gave her grief for her cooking ability. I put all my effort into making a product that I thought people would like, and they spat it back in my face with distaste. It was YEARS worth of work, verbally ripped to shreds in a matter of seconds.
I quickly realized I had to do something to avoid losing the company, so I decided to learn UX/UI design myself. I came to the decision while I was at my parents house eating a delicious bowl of chili that my mom made. I thought, “If my mom can learn to cook, then I can learn UX development from trial and error.” In retrospect, the challenge forced me to think through the problem intuitively. Here’s what I did:
1. I created a clean system for collecting “event” data and went through each of the app’s “event funnels”, to objectively understand how users navigated nOCD.
When building any kind of software, it’s crucial to have a clear system in place for collecting event data, since it will allow you to understand which screens get the most traffic and which ones don’t. For example, if you have an app and it logs 10,000 events on your first onboarding scene and 7,000 events on your last, then you can deduce about 30% of your users “bounced” in the onboarding flow.
Taking the time to establish a clean system for tracking event data enabled me and my team to learn about our users quickly- they simply weren’t coming back to the app. This data forced us to ask questions like, “Do we really need this one feature, if it’s not gaining traction? Is the current app providing enough value for our users? Is the app’s user interface too complicated?” From a high level, we noticed a deep UX problem, which required us to take a deep dive into our product.
2. I reached out to people with OCD in our social media community to better understand the problems they faced, in hopes of figuring out how to solve them and improve nOCD.
Finding “Product Market Fit,” the answer to premier UX, is not just about asking questions, it’s about asking the right questions in a manner that will engage your audience enough to reveal deeper levels of meaning. We came to this epiphany when we asked our users via Instagram, “If you could wave a magic wand and fix three things related to OCD treatment, what would you fix?” This question sparked a dialogue that encouraged people from all over the world to not only answer, but also support others who shared their story. From this dialogue, we realized the power of the question, as it revealed a need for people to talk and share their story, the real value proposition.
3. I used Sketch to create multiple UI prototypes of a 24/7, in-app community support feature. Then, I created an Invision prototype to get market validation.
No matter how confident you are in an idea or a new direction, it’s essential to get market validation first using UI mockups. An idea is only an assumption, and making UI mockups is significantly cheaper and more efficient than coding it and releasing it to a user base. There are some phenomenal tools that you can use to build and test UI mockups, such as Sketch and Invision. In Sketch, you can design your UI mockups and easily export them into Invision, a free prototyping service that enables you to turn your mockups into a clickable prototype. After making a clickable Invision prototype, you can then show it to users or videotape yourself going through the flow in QuickTime.
For the nOCD community feature, I created the mockups in Sketch, dropped them into Invision where I made a clickable wireframe, and videotaped myself navigating the feature’s flow in QuickTime to show our user base the feature from a high level. Then we dropped this video into a Google Form, and got over 150 people with OCD to analyze the video and give pointed feedback. Over 90% of the respondents rated the feature a 9/10 or higher, and left incredible feedback. We then had data to support our assumption- proving that a community feature would enhance nOCD’s usability, allowing us to hand off the problem to our brilliant engineers. Our dev team implemented the UX enhancements, and now the app’s two-month retention rate is 25% higher than what it was prior to testing.
The UX mods helped nOCD become the largest online platform for OCD treatment in the world and the highest-rated platform for social cause by UX/UI Awards 2017. We still have a lot of work to do, but if I could thank one person for nOCD’s success outside of my brilliant team, it would be my mom, who taught me to summon the gusto needed to compartmentalize my frustration and improve. Might I add, she is now one of the best cooks around.
