CommÜn App: A Coursera Interaction Design Capstone Project

BACKGROUND

My journey with the Coursera Interaction Design Specialization started in July of 2015. I was browsing through online learning groups and stumbled upon this feature on Coursera and How it’s connecting its students to tech employers in Wired Magazine. This led me to search for more information online and I landed on UC San Diego’s Press Release on their Interaction Design Specialization in partnership with Coursera. By the time I started with the IxD Specialization, there were 7 courses, all of which you needed to finish and earn a certificate on before you can start with the Capstone Project.

With my years of experience working as a UI Designer / Front-end Web Developer, I told myself, “Why not? Interaction Design (IxD) and User Experience (UX) should be easy.” I assumed that I would just be brushing up on my current skills and weeknights should be enough to work on the assignments. Well, I was wrong. Each module / course is hands-on, and would require a bit of effort (a lot of effort on my part as I work 2 jobs) and would eventually take my weekends away… and I say that as a good thing! I would say that the IxD Specialization overall enhanced my skills and knowledge, and made me a better UX Designer than I was before taking the courses. How do I know? Because Coursera and UCSD helped me land my second job as a UX Designer.

Now onto the Capstone Project!

CAPSTONE PROJECT IDEA WITHIN THE COMMÜNITY

Months before I started my Capstone Project, we have just moved to another state. Knowing that I would be working on a web/mobile app towards the end of the year, I kept my eyes peeled for breakdowns of user’s experiences everywhere I go — what I could do to help improve anything, really. Little did I know it would be right under my nose, within our apartment village. I kept seeing paper flyers for “important” announcements, neighbors rushing to the leasing office to pay their dues before it closes, our “notice” boards that are basically unnoticed and untouched. And right there, I knew I was onto something.

NEEDFINDING

I set up interviews with our property management office and as well as our neighbors to learn more about the community. Being new to the place, it was easy to introduce myself and jump into a conversation about how things were around the apartment village.

Here are some excerpts from my written observations and point of view:

My observation mainly focuses on “Change”, but also crosses onto both “Time” and “Glance” design briefs — they are all interconnected.
…I was interested on how the property management company communicates with tenants and how they influence their habits/behaviors.
…I was surprised how all of them, at this time and age of technology, people still opt for analog systems (word of mouth, paper trails, flyers, check drop box payments, etc.) which takes up a lot of time and effort to do, yet with all the effort, failing in communicating well, and the property management not being able to influence habits and/or behaviors of residents effectively.
POINT OF VIEW (POV)
According to researches, stress, anxiety, and lack of sleep are just some of the causes for memory problems. Examples of these memory problems are confusion, forgetfulness, and even difficulty paying attention to things around us. As adults, we are constantly faced with situations wherein we experience these aforementioned causes — in school, at work, even in our own homes.
As adults and members of a community, we need to be aware of our responsibilities, our
surroundings. We try so hard to keep up with everything that is happening around us, but
sometimes, we slip and forget. While simply forgetting can easily be resolved, sometimes forgetting responsibilities leads to undesirable consequences, which creates even more stress.
This goes both ways — residents and property management alike. Having something that aids the communication and responsibilities of both residents and property management would definitely help, occurrences of added, not to mention unnecessary, stress and anxiety will be greatly reduced leaving residents and property management happy and content.

From there, the entire concept relating to the apartment village is beginning to take its shape, into a concrete app idea.

STORYBOARDING / WIRE FRAMING / INTERACTIVE PROTOTYPING

With ideas generated from needfinding and brainstorming, I moved on with storyboarding some scenarios with which this mobile app idea could help improve/ease the flow of interaction with residents and property management alike.

Coursera IxD Specialization Capstone Project: CommÜn App Storyboards
Coursera IxD Specialization Capstone Project: CommÜn App Storyboards

The next step was drawing wireframes of the app idea as well as making it as paper / interactive prototypes for rapid iterations from peer feedback.

Coursera IxD Specialization Capstone Project: CommÜn App Paper Prototype

Interactive Paper Prototype Link: https://goo.gl/3AITnN

With in-person/user evaluations and detailed heuristic evaluations with the help of my fellow Coursera IxD Specialization peers (Thank you, Monique D. and Prasitha T.!), I was able to fine-tune the app, and make a better experience overall.

Coursera IxD Specialization Capstone Project: CommÜn App Early Prototype

Interactive Prototype Link: https://goo.gl/8v6nWb

USER TESTING AND FINAL PROTOTYPE

After careful consideration of feedback and further iterations on the app wireframes, the prototype was ready for A/B Testing.

For the A/B Test, one design had buttons of the same size, and the other one design had the primary action button take up the full width and the secondary action as a text link below it.

I hypothesized that the bigger button would help sway the user to quickly click on it as opposed to having two buttons of the same size beside each other.

Both Group A and B users were given the exact same instructions to perform tasks for me to be able to evaluate and compare their actions / results, the only difference is in the design and placement of buttons.

Coursera IxD Specialization Capstone Project: CommÜn App Button Comparison for A/B Testing

It was my first time to use UserTesting.com and was excited to know that I would be able to see a recorded interaction of users with my mobile app prototype, and results were sent to my inbox fairly quickly.

To my surprise, I was incorrect with my hypothesis. Based on the results, users were faster to click same-sized action buttons. This is a prime example of why user testing is extremely important. This is User-Centered Design.

THE FINAL PROTOTYPE

Based on the user testing results, I’ve kept the same-sized buttons. I’ve also added more screens for other sections of the mobile app. Now, I present to you, the CommÜn App.

Coursera IxD Specialization Capstone Project: Introducing the CommÜn App

Video Link: https://goo.gl/8IiQ9R


FREEEEDOM!!!!!!

Finally, I can now reclaim my weeknights and weekends. This journey with Coursera’s IxD Specialization is coming to a close, but is definitely not an end. With this intensive hands-on online course, I have learned a lot of valuable knowledge and would surely continue to use all of it with my work as a UX / UI Designer.

To my Coursera IxD Specialization peers, hang in there! We’re almost at the finish line! :)

Thank you Coursera, Professor Elizabeth Gerber, Professor Jacob Wobbrock, and most especially to Professor Scott Klemmer and the UCSD Design Lab for putting this IxD Specialization together and making it accessible to everyone.