About the hackathon
The theme of the hackathon was “hacking for humanity” as the projects were dedicated to help charity organizations. Me (UX/UI designer) and my team (2 developers — Android developer and back-end developer) decided to help the Animals in Need Foundation of Gibraltar.
The Animals in Need Foundation have a shelter to take care of abandoned and unwanted animals, mostly dogs. They need a platform to make the dog walking more efficient, for volunteers to register and schedule dog walkings. They should be able to book a particular dog if they want to. Once a dog has been walked the volunteer should mark it as walked. That way, it can be ensured that all dogs get out and some aren’t walked twice a day, and some not at all. A section for uploading pictures of the dogs would be a nice to have.
Some volunteers from The Animals in Need were at the hackathon to answer our questions helping us do our best work and match their needs. To get to know our users, their needs and expectations, we did a survey using typeform, with the following questions:
5. Marital status
6. Do you have a smartphone?
7. If so, which apps do you use on a daily basis?
8. What do you like doing in your spare time? Any hobbies?
9. As a volunteer, what is your main motivation for helping this organization
10. How do you help this organization? Which activities are you involved in? (Dog walking, adoption, donations, organizational…)
11. Do you have any dogs at home? If not, why?
12. We are building a platform to help your organization. What do you think it would be the most relevant feature(s) to suit your current needs?
13. What would make you choose to walk a specific dog? Please order these criteria (1 for the most relevant and 7 to the less important information): picture; size; gender; age; personality; breed; last walked
The questions from 1) to 8) were made to help us draw the user’s profile, the personas.
Questions 6) and 7) particularly helped defining if we should do a website or an app. Results showed that 100% of the volunteers have a smartphone and use several apps on a daily basis. They’re also technologically literate according to their professions.
The questions from 9) to 12) helped us defining priorities regarding the main and the secondary features that the platform should have.
The question 13) was meant to define which were the most relevant informations to display when a user is deciding which dog to take for a walk or thinking about adoption (for example, in the dog’s list and dog tinder). Results:
2. last walked
3. breed (can be guessed from the dog’s picture)
5. size (can be guessed from the dog’s picture)
7. gender (can be guessed from the dog’s name)
. . .
After analyzing the data we decided to do an Android app. So we did some benchmarking on similar and relevant apps to our case. The most relevant we found were UDog, Dog Walk, Time to Pet and Scout for Pets.
Defining app's features
We brainstormed to define possible features and functions, and to decide which ones should be the primary and the secondary. Every element on our team took 15 minutes to think and write in post-its what would be important to have in the app and then we organised our ideas together:
• Dog Tinder (adoption-driven): discover a dog to walk or adopt, filtering by size, gender and age or just get to know the dogs in the shelter by swiping left to see the next one or right to schedule a walk. Several matches will appear based on dogs urgency to be walked, previously favorited dogs and/or filters applied.
• Schedule a walk with a chosen dog
• Gamification (the more miles a volunteer walks with a dog, the higher his status will be. There are 3 levels related to volunteers’ experience: theWalker, the Doggster, the Dog Whisperer. The more miles they walked, the more experienced they are and can take out several dogs at each time or bigger and “more difficult” dogs)
• Filter dog’s list (ordered by dogs in need of a walk, can be filtered by size, gender and age)
• Search dog (by typing its name or a dog breed)
• Favorite a dog (a user can favorite a dog on the home, dog’s profile and dog tinder. The favorite’s list can be seen on volunteer’s profile)
• Call the shelter in case of emergency
• Add picture(s) of the dogs to their profiles
• Share picture(s) on social network (facebook, instagram, whatsapp)
• Dog Profile (users can favorite the dog, schedule a walk, access dog’s pictures and details— size, age, gender, breed and personality)
• Volunteer Profile (it displays the gamification level according to the number of miles walked with dogs, lets them edit personal details, access their favorite dogs list, walk’s history and pictures taken during walks — upload and share).
. . .
After, we did the user stories with all the requirements (As a/an, I want to… so that…) and the main app flows:
Prototyping and testing
Our first version of wireframes was designed on paper and tested using Marvel App for Android, which lets you upload your designs and create links between them, making simple flows. So we quickly did a guerrilla test and found our first problems. We soon realized the swipe gestures (we wanted to use them at our home and on the dog tinder feature) would be difficult to test.
Based on the user stories I carefully designed the wireframes on Sketch with material design’s patterns and uploaded them on Invision (https://invis.io/JVENCNZFM). After linking all the screens we wrote a script with some tasks for the users to test the flows:
1. You found yourself in the app’s home:
1.1. Search for female puppies
1.2. Open a profile of one of these puppies
1.3. Favorite a dog
1.4. Schedule a dog walk
1.5. Call the shelter
2. Go to your profile:
2.1. Edit your personal details
2.2. Upload a picture
2.3. Unfavorite a dog
2.4. Go to this dog’s profile
3. You are now on a dog’s profile:
3.1. What’s the size of this dog?
3.2. And its breed?
3.2. Schedule a walk with this dog
4. Find the Dog Tinder area:
4.1. Dismiss this dog
4.2. You’re only interested on small, male puppies and adult dogs. Filter.
4.3. You found a nice puppy that you’d like to take out. Schedule a walk.
. . .
Conclusions and iterations
The task of scheduling a dog walk starting from the home presented a challenge. Not only the action but also the test itself. So after some fails, we decided to test the prototype with the calendar slightly visible and then closed after a few seconds. The users quickly understood this as a hint and we decided to keep it this way for the development phase as well. The first 3 times the user opens the app, he’ll see this movement on the second dog on the list, as if it was inviting him to swipe left and schedule a walk.
The dog tinder feature seemed easy to understand because the users identified the layout pattern as being similar to Tinder’s. During the tests volunteers suggested that we gave more importance to dog’s breeds, specially in the dog tinder area, that was supposed to stimulate dog’s adoption by matching people’s preferences with dogs, so we added the information about the breed on the dog’s preview.
After the user testing with the high fidelity wireframes I was finally able do some layouts to be tested again, changed according to the user’s review and then developed.
Future steps: more features
• Dog Tracker (for the shelter to track the dogs when they go for a walk)
• Step counter (integrate a step counter app for the gamification system to work properly)
• Dog profile: add notes on dogs (volunteers will be able to post not only pictures but also important notes about the dogs they walked)
• Reviews on dogs and volunteers
• Chat to put volunteers in contact
• Likes on pictures
• With these features we are hoping to transform the shelter into a real community!