The Brief: Role and responsibilities

As part of the Dribbble 12-week Product Design Course, the learning process was driven by the the construction of a fictitious dog-walking app. The development sequence was supported by market and user research, a flow analysis to examine the overall process, a visual design phase, and prototyping phase to create a live mockup of the final product. My version of this app was called "Fetch Your Leash!" (seen in mockup, below).

Competitor Analysis and User Research

To begin the research phase, an analysis of major players in the field indicated clear driving forces for a service of this kind to include a need for trust of a dog-walker and ease of use. Two apps in the analysis were diversified to offer services other than dog-walking and added a bit of value, but could be overwhelming initially. The one devoted dog-walking app was pretty and well-supported but the graphics and extras could overwhelm and take extra time to get through.

Overall, the competitor examination indicated that quick signup process followed by rapid access to neighborhood/area dog walkers wrapped in a straightforward system dedicated to dog-walking could potentially thrive.

User Research and Persona Construction

With the competitor analysis in hand, user research was conducted via questionnaire and brief interview with a small pool of dog-owners to better inform the app's construction. The results from these interviews allowed for the construction of a user persona whose main aspects encompassed two basic needs:

1. a need for assurance that the pet would be safe in the walker's hands

2. and the system would be focused and straightforward to use.

User Flow Construction

I used the competitor analysis and the user interview learnings to help guide my construction of a user flow diagram in Figma. The flow needed to address the simplicity needed with and a potential aspect for reassurance of the dog's owner that their friend was in good hands. To aid in streamlining the process, the decision was made to offer only dog-walking through the app, keeping the focus on ease of sign-up and rapid access to booking of a trusted dog-walker.

Wireframing - Fleshing Out the Skeleton

The basic skeleton of the user flow provided a roadmap of the essential components of the app and the wireframe built upon its foundation detailed the beginnings of the overall look and feel of the app. The initial sequence and placing of components is outlined below and included a splash screen, quick sign-up/sign-in, rapid access to local walkers, booking, and confirmation pages.

Initial and First Evolution of the Design

The mascot icon, a "dog-and-leash" image was chosen early on and the themes for the app grew up around it. While a darker palette was initially explored as a skin over the first wireframe, feedback from the work group suggested a soft blue with a pale purple would fit better as the core colors for the app to allow for a friendly, gentle, and trustworthy feel. Process efforts were aided by a small component library that was built organically where needed to ease scalability and future modifications to the app and was iterated upon as the design matured.

The initial layout and design were opened to the group for critique and feedback was integrated into the next iteration. Three major learnings outlined below included:

1. ease of viewing and aesthetics indicated a shift in the color palette to beneficial

2. a better use of negative space allowed for a more open layout that "breathed"

3. consistency in spacing between elements allowed for a natural layout feel

Final Thoughts

Over all, the course enabled me to research, design and prototype a dog-walking app with a clear and consistent aesthetic and good usability. A link to the working prototype can be found here. Any constructive feedback is welcome and thanks for looking!