PROJECT BRIEF: For the first week of the UXDI program at GA, my class was tasked with creating a mobile app solution for a partner’s problem through paper prototyping and user research.
DURATION: 3 working days + 1 presentation day
TOOLS: paper, pencils, scissors, camera, computer
THE PROCESS:
Day 1: Research and Analysis
I began by choosing my partner, Wonjin Kim, who was sitting next to me in class for the day. In interviewed her for 45 minutes to learn about her background, her behaviors, her likes/dislikes, and challenges that she runs into throughout her life. My goal for this interview was to gain insight on how to create the best possible solution to her problem. It was important to understand my target audience to the fullest extent because the instructors told us that even if our mobile application solution wasn’t solve many users problems, it should at least solve our partner’s. Through this interview, I was able to learn a lot about her background.
She is currently 28 years old, from South Korea, and resides in Albany, CA. She majored in English at Sonoma State University and then went on to take classes on child development at UCLA. She used to work at the Oakland YMCA, but she is now a full-time UX design student at General Assembly. Some of her favorite hobbies are going to try new foods, socialize with her friends, go hiking, and spend time at the beach. With all these hobbies and interests, living in the Bay Area means that she needs to rely on public transportation to get to places daily. We then talked about problems she runs into that she feels a mobile app can solve. She talked about never being able to find matching socks, inconveniences with bill splitting, and the inefficiencies of the clipper card system.
After completing the interview with her and doing some quick research on current solutions for her problems, I decided to focus my energy on the problem that I concluded was most exasperating for her. Then I was able to formulate a problem statement:
Wonjin is a BART user who often runs into delays during her commute when she has to unexpectedly reload her Clipper card with money because there’s no easy way to track her balance. Then, she has to find one of the few clipper card pay stations that take credit/debit card in order to load more money to pay for her fare. These transactional delays will result in her missing her trains are highly inconvenient and frustrating to deal with.
PROPOSED SOLUTION:
Create a mobile app, essentially the Clipper card app, for her to track her card balance and reload money through the app to reduce unexpected delays in her commute.
I briefed Wonjin, some peers, and one of my instructors with my proposed solution and got positive feedback on my concept. Then, I moved onto the next phase of my design process which was competitive and comparative research.
For my competitive research, I looked into two existing public transportation mobile apps. I focused on the two that I felt were most relevant and had solutions to my partner’s problems. In San Francisco, muni is the other main form of public transportation and they have the app MuniMobile for purchasing mobile bus/tram tickets. I deduced that when BART updates their technology and creates a Clipper card app, that they might base their app off MuniMobile or even incorporate the clipper card into the app. Then, per recommendation of one of my instructors, I explored the Opal Transportation app, which aids Australia’s public transit system. She explained that this app was very accessible and makes commuting easy for Australians.
After inquiring into the MuniMobile app, I found a couple of main likes and dislikes about it. I liked the feature of having a QR code as your mobile ticket, which eliminated the need for a physical card. This is convenient for people who forget their Clipper card or lose their ticket/card. I didn’t like that MuniMobile only allows the user to buy individual tickets rather than using a subtracting balance system like the Clipper Card.
Next, I investigated the Opal Transportation app and found the app to be very useful and loaded with solutions to my problem. I knew that I could pull a lot of inspiration from this app because they had the current balance reflection, the card reload features, and mobile tickets. Researching the Opal app was the most beneficial because it was an existing approved mobile app, so I knew which features users found most useful.
Through this comparative research, I was able to solidify the direction of my mobile app and which features I wanted to incorporate. This allowed me to move onto the next steps of storyboarding and sketching in my design process.
Day 2: Storyboarding and Sketching
This phase is all about ideation and being able to translate my research and design decisions to my users clearly. So, I began by drawing out a storyboard that makes my target user’s problem and my concepts easy to understand.
I presented my storyboard to Wonjin to review and ensure I was communicating her problem correctly. With her approval, I moved onto sketching the app’s interface. I knew features my app needed to have, but these initial sketches were important for me to brain dump and test all different kinds of features I wanted to include on top of my solution features.
I checked in with my end-user and some peers to allow for a visual understanding of my solution and to preview the direction I was heading. I received positive feedback and moved on to more detailed interface sketching.
At this point of my sketching, my solution was coming to life. I was able to test out a lot of different features to take my app beyond solving my user’s main problems. It also allowed me to lock down the layout of my app and sort out design decisions for my paper prototype.
Day 3: Paper Prototyping
The final phase of my design process entailed paper prototyping and feedback through user testing.
To create my paper prototype, I used paper iPhone templates, index cards, pens and scissors. I tested my prototype and solicited feedback from my peers by asking them to complete the simple task of logging in and reloading the clipper card with $20.
Through the user testing, I was able gather valuable feedback to use in my next refinement of my sketches. The results are as follows:
- Log-in screen confusion — log in screen was repetitive and not drawn out very well, users didn’t know if they should click on the “phone number” line or click the log in button.
- Swipe vs. button — at the end of the transaction, the arrow button that was meant to take the user to the Clipper card QR code was interpreted as a swipe because it was drawn as a long arrow.
- Users suggested I remove the log-in screen in the final presentation of the prototype to keep it simple.
- Users brought up the issue of how clipper cards don’t have an identification number, so there might be a problem for implementation for my app.
The testing and suggestions were really helpful in better focusing the design of my app for the next iteration of my prototype. Overall, I was received positive reassurance on my concept and people appreciated the simplicity of my design. I removed the log in screen and presented the functions of my app as a registered user. In the final prototype, I made sure to keep my illustrations clear and shortened the arrow button to ensure it wouldn’t be interpreted as a swipe gesture. Finally, I made sure to state the disclaimer that my app assumes that Clipper technology will upgrade with identification numbers and the fare scanners will be able to read QR codes.
FINAL RESULTS:
This project was a great introduction to UX designing. Coming from a graphic background design, I thoroughly enjoyed the challenge that the UX design process is along with the time constraint pressure. I’m proud of the design decisions I made and glad I accomplished what I did in 3 days. I received amazing support for my application from my peers and most importantly, Wonjin! I hope that BART/Clipper card technology updates soon because I know my app has the potential to solve so many of Bay Area commuters’ problems.
If I had more time to refine my app and design process I would:
- Explore more features such as route/fare price preview and route planning
- Refine my design to make the app easy and accessible to commuters of all ages
- Interview Wonjin to delve deeper so that I can do comparative analyses and design the app the serve her best
Main Takeaways:
- Know when to let go of some graphic design principles — this is important during the prototyping and sketching phase because I spent more time than I should have perfecting sketches. It’s okay to be messy and spend more time in lo-fidelity sketching.
- User research is very important — unfortunately I missed out on comparative analyses and learning from my peers’ design processes, they solicited feedback on what apps their users enjoyed using and modeled their apps based on how their users prefer a mobile application experience.
- Be prepared for user testing and user interviews — these are such valuable phases of the research/prototyping process and they should be done well. I could have been more prepared to get better feedback and should have gotten to know my user better. I believe that this will be really important for bigger projects and bigger audiences.
- Make an effort to be a well-rounded UX designer — I know that I will enjoy the UI design and prefer it over the research part of the process, but it is important to understand and develop skills in new areas so that I can be a better & more valuable UX designer overall.
- Be open to all solutions — I finalized my solution in my head almost immediately after I understood the problem. It’s important to remember that there are many solutions to one problem and to explore ALL of them to make sure you find the BEST solution.
That concludes my project 1 retrospective! I am excited for what will come in the next 9 weeks and I can’t wait to see the UX designer I become!!
