My Interaction Design Capstone Project: Intention
This post outlines the process to complete my Capstone Project, the final exam necessary to complete the Interaction Design Specialization from the University of California.
How it all started — Needfinding
Life can be hard. When I started interviewing people to understand their needs in their day to day life (and eventually find an idea for my app), I was surprised to see that they all shared similar challenges despite their very different lifestyles and demographics (a new mum, a single male in his 30s, a middle aged college professor). Being my main focus on behaviour and self improvement, I found it interesting that all of my interviewees were struggling to control their emotions and behaviours on a daily basis, and felt like they were starting their days with the best intentions, but those got lost as the days went by.
Specifically, observing a new mother trying to juggle work and family life resonated with me, as I shared some of the very same challenges. In this world full of stimuli and pressure to deliver, deliver, deliver (as a professional, a parent, a spouse), it is hard to focus on your intentions, and these can easily get lost in the noise of the everyday life. Many times, we really start our days with the best intentions (“I am not going to snap with my child today after she asks me for something for the seventh million times. I am going to remain calm and centered”), however we do not remain faithful to those as the day goes by, as we are constantly facing stress triggers.
So, as an experiment, on one particularly challenging day (I was snowed in at home, a blizzard was visiting Ireland for the week, and I was alone with my toddler), I decided to set my intention for the day: Stay Calm, no matter what). I lit a lavender candle to remind me of that intention. The candle was burning the full day, its smell and presence quietly reminding me of my intention. That day went by without any drama at all! Every time I was about to snap or to feel overwhelmed, I looked at the candle, and I immediately relaxed. By the end of the day, I felt very proud of myself for being the calm, centered parent that I had always wanted to be.
Ideation
And so I thought, what if the very act of consciously setting our intention for the day (actually writing it down) brought us already halfway through success. Aren’t we transforming an abstract idea into something real? If we also had a gentle way to remind us of our intention, as the day goes by, this could help us stay on track and remain faithful to our scope. At the end of a day in which you’ve managed to stick to your intention you feel great, at peace, and ultimately a better version of yourself! We constantly set physical goals for ourselves (lose weight, go to the gym, run a marathon), why can’t we set behavioural goals?
After a thorough research, I created an inspiration board with some key concepts related to the idea, as well as some snapshots of similar apps already on the market. I was happy to see that there was nothing out there exactly like Intention. All apps already on the market were quite complex apps to manage long term goals and manage more than one goal at the time. Intention had to be simple, straightforward. Set your intention at the beginning of the day, stick to it, be the best version of yourself, one day at the time.
Storyboards
Paper Prototypes
And so the Paper Prototyping began. That was fun.
First Round of User Testing
After having created paper prototypes, it was time to do a first round of testing. I gathered three friends of mine and offered them freshly baked muffins in return for a 15 minutes user testing session. It worked (I make really good muffins).
During the testing I was able to collect feedback on the concept as well as on the flow, content, user expectations, and ideas for new features to add to the pipeline. It was incredible how many changes I was able to inform with just three short sessions with users. For example, what I thought was a great idea (a button called “Get Motivated”), users didn’t really understand their meaning and were reluctant to use. I was also convinced that I had to offer users the chance to browse their old intentions (and see their progress), so I added this to the development plan.
Heuristic Evaluation
Along with the in person user testing of the paper prototypes, we also had to have one of our peers conduct a Heuristic Evaluation of our prototype. That was extremely interesting, as such a detailed critique from a professional can provide so many insights on things that we wouldn’t naturally see as problems ourselves. My colleague Anastasia very kindly evaluated my prototype and shared all the Heuristic Violations she found on Intention. That gave me a lot of work to do, but it was good! This is a snapshot of her evaluation.
Development Plan
And so my first development plan for Intention was born. I decided to organize it based on the tasks the app was supposed to deliver, and to develop page after page, task by task. Now it was time do create the mock ups and the first protoype.
First Digital Prototype
I started drafting a few mock ups for Intention using Sketch. This tool allowed me to work fast and iterate each version literally in matters of minutes. I found it great, especially for its opportunity to connect and sync it directly with inVision, so every time I edited my visuals, the prototype updated itself on inVision. Brilliant!
Ready for testing (again!)
At this stage it was time to conduct some serious A/B testing. as I knew what pages were the trickiest to tackle, I decided to test two versions of the app and to change just that one tricky page in the flow, to understand user’s behaviours related to that specific process. The page I wanted to A/B test was the “Your Old Intentions” screen. Specifically, I wanted to test version A — which presented a list of old intentions along with their ratings (assigned by the user in the past) and a hamburger menu offering the options to copy the intention to today or to see the user’s notes on that day — and version B, which presented less intentions but displayed the options to copy intention or see the notes directly on that page. I uploaded the two versions of the prototype on inVision and then had 4 users go through the flow on usertesting.com
It was so fulfilling to see people actually using my app, and again in just a very quick round of testing I learned so much about what was working and what wasn’t. I was able to spot a bug in the interaction between two screens, as well as to figure out that version B which presented less intentions but had the options directly built in the page, was more effective for the purpose. I also validated my assumption that users did not want to see their ratings directly on that page, as this could have triggered an emotional reaction (shame, failure) in case they had assigned poor ratings to their last intentions. So I hid the ratings behind an icon, who wants to see them can tap, who doesn’t won’t be bothered or feel “judged by the app” (actual user verbatim). Another constraint was that I needed more space fo the intention title, in case that was going to be long. Therefore, the ratings and the hamburger menu had to GO!
Polish and make pretty! Add more features.
It was now time to give Intention a more definite visual identity. I experimented with a few palette options but then I thought it all started with a lavender candle, and so I chose to use variations of purple.
As I was designing, I started to add more pages (such as the “read affirmations” and “listen to podcasts” ones) and I was happy to experiment a few interactions related to the “add to favorite” option. The famous double tap that we all love on Instagram!
I added a landing page that automatically re-directs to the homepage, I aligned all buttons to comply with the iOS Human Interface Guidelines, I removed the app header on most screens and used a standard iPhone navigation bar. This way, I gained some whitespace that I was able to use to make the screen look less crowded, and achieve that minimal look and feel I was hoping to get.
Intention: final prototype
Intention Prototype on inVision
You can take a tour of Intention here: https://invis.io/A5GM2URHVK3 and you can watch a short video about Intention here: https://youtu.be/HnzfuP1fzR4