Dogs on deployment
mobile app prototype
winter 2017
Timeline: 3 Months
My Role: Project Manager, Lead UI/UX/Visual Designer, User Researcher
Tools: Balsamiq Mockups, Adobe Photoshop, InVision
Methods: User Interviews, User Personas, Competitive Analysis, Rapid Prototyping, Wireframing
Imagine that you have a child and you need to go on a business trip. You can't take the child with you and you don't know anyone else who can take care of the child. What do you do?
Military pet owners deal with this issue when they are serving. Luckily, Dogs on Deployment provides a way for military pet owners to find a place to board their pets while they are on leave. The non-profit already has an existing website but our job was to take the services of the site and put it in a mobile app- the most important featuring being signing up and searching to find a match.
As part of the Global TIES program at UCSD, I worked in a team of 8 total students from various studies to create the prototype. The project emphasized human-centered design, therefore our team conducted user interviews and observations to find needs and issues, built prototypes, and iterated to create the best possible version of the app. My role as the team leader (and member who has the most experience with app development and prototyping) required me to lead the team to complete the project with their best effort, organize and assign roles/tasks, and dispel any conflicts within the team.
View our functional InVision prototype here.
Design process
Information architecture
​
Our client, Alisa Johnson (the co-founder of Dogs on Deployment), specified that she wanted the app to focus on three main functionalities: account creation, searching/matching, and chat/messaging. The app is more of a supplement to the main website so we made sure to adapt the site to mobile while reflecting what was already implemented.
Thus, our information architecture (pictured on the right) was created to link all these functionalities together.
Paper Prototypes
​
To practice ideating, I split the team into three groups to focus on the three functionalities our client emphasized. Each group was to come up with three different design concepts to address the functionalities. Beyond contributing to the account creation processes, I also sketched the "Login", "Home", and "Profile" pages. I found inspiration and ideas from comparing other applications' screens (such as Instagram) and researching which layouts are the most successful for account creation and conversion. Examples of the paper prototypes are below:
Lo-fidelity Balsamiq Prototype
​
We then evaluated the different concepts as a team and utilized feedback from our client and peers to build our lo-fidelity prototype on Balsamiq. Here, we were able to combine all the functionalities together by linking the screens. We ran preliminary user testing with the interactive prototype to test the user flow. Examples of the screens are below:
Before creating all the screens for our hi-fidelity prototype, I updated the user flow with the different screens of the app:
Hi-fidelity InVision Prototype
Utilizing feedback gained from testing done on our lo-fidelity prototype, another teammate and I then implemented the hi-fidelity prototype on InVision. I created the templates and overall theme of the application in Photoshop so that my partner could create the screens for the chat functionality and some other screens. We did more testing on this prorotype and gathered suggestions for our client to possibly implement in the future. As a group, we also created a developer's guide which documents all the screens and the different features present.
Our InVision prototype can be explored here.
Conclusion
From this experience, I realized creating a prototype utilizing user-centered design wasn't difficult as managing a team of 8 diverse people with little experience in design. I learned a lot more about being a leader and working in a big team (mostly adequately dealing tasks as well as finding the balance between encouraging members to complete their work on time and with quality without being too bossy or controlling). As for the design process, I was glad for an opportunity to practice creating more prototypes and pleasing our client. With more time, I would love to implement possible additional features for the app such as a fund transferring or rating system.
