Front-end & UX Designer
ppw-cover-v2.png

Philly PackWalk

The Pitch:

You lead a busy life and don't always have time to walk your dog. This happens to everyone. But imagine if a way existed for your dog to get walked when you where unable too; while promoting more exercise and facilitating social events with other local dog owners/organizations, all free of charge.

Or scroll down to continue reading


Service Design:

Philly PackWalk was designed in partnership with University of the Arts graduate Xander Karkruff, MFA 14' for the Masters of Industrial Design department, Cognitive Science of Interaction Design class taught by Slavko Milekic, M.D., PhD.

Philly PackWalk's service design is to assist dog owner’s have their pet[s] walked when they are unable too because of work or other busy reasons. This is facilitated by:

  1. You signup for the service, free of charge
  2. Your matched with like minded individual[s] based on an intelligent algorithm using psychological granularities, that are able to walk your dog[s] when you are unable too.
  3. You befriend these user[s] and agree to walk their pet[s] when you are able too, quid pro quo.
  4. Additional groups of user[s] “packs” can be joined to distribute everyones available times and lessen the time impact.

For added piece of mind, PPW would let users pay a nominal annual fee to have a check run on them and receive a "Bark of Approval" added to their profile and an option during user's searches. Naturally the best way to check someone is to simply meet them, but this could facilitate added reassurance.

ppw-steps.png

In addition to this, it helps to promote more exercise by using a timing mechanism built into the website. This is facilitated by:

  1. When you signup for the service, it will ask you to designated a location you are able to have your pack-mate[s] pickup your pet[s] at.
  2. The pack-mate will be asked to visit PPW's website once after their sign-up, on a mobile device of their choice. Upon visiting, it will ask the user if it may do push notifications.
  3. When the pack-mate comes to the GPS location you designated, the website will begin a timer function.
  4. When said the pack-mate returns to the GPS location, the timer function will end.
  5. The website then auto-computes how long it ran for, then multiply in an estimated calories burned based on the steps made e.g. pack-mate walks your dog for 30min = 1.55 miles @ 3000 steps & 54 calories.

This is done by using Adobe's PhoneGap tool. In essence all the sensors mobile phones are able to be used without a separate app built-out for both the iPhone and Android platform.

Lastly, PPW would host social engagements for local members in hopes to strengthen it's user base but also booster animal rights and hopefully facilitate additional adoption rates by working in conjuncture with local animal shelters.


Usability and Cognitive Design:

PPW's front-end uses a combination of Human to Computer Interaction (HCI) and cognitive science techniques to help bring about better system fluidity. This is done by reducing the user's epistemic actions by lessening their pragmatic actions via affordance constrictions to the website. All told this helps to reduce the cognitive load and bring about a better user experience. Additionally the entire website was built using Adobe PhoneGap, HTML 5 and CSS 3. This would mean it could be ran on any device, scale the size accordantly (response design) and not require a separate micro site for mobile users.

Sign-up Page

The sign-up page was designed to be as unbiased as possible, removing commonly used terminology that could denote negativity as well bring about a more intuitive experience.

  • Rather than using a drop-down to select your occupation, it asks what you usually do on the weekdays. You could type in your occupation or something of grater importance such as caring for your ill grandmother that would not fit into an occupation only question, but still has tremendous importance.
  • It barrows from OK-Cupid's list 5 things you could never do without but adds a character count limit to hopefully reduce user abuse seen on other websites. And unlike these websites, it gets used in the pack-mate matching algorithm, thus they are not simply for show.
  • After you input your pet[s] name, it will their fourth update that name for each pet question. So rather than using the generic "your pet" it would change to Max, as seen in the image.
  • At the end of the initial signup process, the website gives the user the ability to download their input data as an XML file. This is done as many websites punish the user by not letting them take their data with them from one website to the next. Hopefully other websites could build-out an aggregating system to let users upload information so often asked, their in reducing time spent in this process.

Selecting Free Times:

During the design of the selecting your free times I struggled with devising a way to remove the negative effects large spreadsheets or calendars incur on users; if their is a mass of free time, you could feel your doing nothing with your life, thus punishing the user. An example of this is a student schedule, you may only attend school 10hrs a week thus have an additional 30hrs free but in actuality you really only have maybe 5hrs free, they just are not static like a 9 to 5 job. By changing the nature of the task, in this case a detailed calendar or spreadsheet into a limited display of information, we bring about better user cognition and remove the bias.

  1. Upon loading the time select screen, a splash overlay would be shown telling the user how to use the page.
  2. By selecting the vertical + (universally denoting add) it adds each day in corresponding other e.g. Monday, Tuesday, Wednesday, Thursday, Friday, Saturday, Sunday. If you are no free that day, a null would let you skip to the next day. This would also let you pick that first day's free time.
  3. After adding said day, a horizontal + appears letting you add additional free times for the day.

Call To Action page:

The users Call to Action page is where they would do the bulk of their user interactions (unless they choose to exchange phone numbers, etc) as well give updates on their walked time/calories burned. During the design of this I wanted to remove as much informational noise as possible while still giving the needed information. Facebook is a great example of how not to run a COA page (user wall) as it bombards the users cognitive load and thus brings about a less desired outcome; you have difficulty making sense of what to do.

  • Upon visiting the COA page, the user can remove the informational feedback about their exercise at any time.
  • By hovering over a pack-mates photo, your other pack-mates friends are moved away and darkened to help retain focus on your intended action.
  • Icons denoting de-friend, calendar (free times, next walking times, etc) and message will appear. Hover text will be shown when you highlight over said icon for additional interface feedback.
  • Upon removing your cursor away from the icons and pack-mate's photo, all your pack-mate's photos will come together again.
  • None of the above actions listed require any clicking except for selecting an icon, thus reducing the users pragmatic actions.