WGSR Hero

Digital Dog Adoption Solution

A complete redesign and improved user experience for West Side German Shepherd Rescue.

Client

West Side German Shepherd Rescue - sheprescue.org

Year

2021

Role

  • Information Architect

What I Did

My principal role was Information Architect and I collaborated on research and visual design. I drew low fidelity sketches with pencil and paper, designed site maps, user flows and conducted usability testing.

Overview

About This Project

Our team was tasked with designing a new feature(s) and/or improve an existing feature(s) for our assigned client(West Side German Shepherd Rescue -shepresue.org), to create a delightful experience for the persona(s) we defined through research.

The Problem

German shepherd lovers need a more personable and updated way to select an animal rescue in order to find a german shepherd to add to her family. One look at sheprescue.org and you can see that this site design is 20 years old.

How Might We...?

How might we design an updated experience of sheprescue.org for that delivers a more personable experience for their customers? The challenge was to design and build a user-centered website for West Side German Shepherd Rescue that organized the wines in proper categories and provided navigation and search for the user to be able to easily find and purchase wines and have them delivered.

Discover

Our research process consisted of user surveys, interviews heuristic analyst, competitive analysis, and comparative analysis.

1.Heuristic Analysis

CriteriaTest Evaluation 
Visibility of system status Always keep users informed about what is going on.Provide appropriate feedback within reasonable time.Pass. Site is up and running as expected and loads quickly.
Match between system and the real world Speak the users' language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.Fails. The website speaks the user’s language, but some information is out of order or not as well organized as it could be for users to find what they are searching for.
User control and freedom Users often choose system functions by mistake.Provide a clearly marked out to leave an unwanted state without having to go through an extended dialogue. Support undo and redoFails. Hard to find and get to where you want to be.
Consistency and standards Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions.Fails. The site is totally inconsistent in the design across pages and navigation.
Error prevention Even better than good error messages is a careful design which prevents a problem from occurring in the first place.Fails. A user could easily get lost in the site and not be sure of where they are.
Recognition rather than recall Make objects, actions, and options visible. User should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.Fails.
Flexibility and efficiency of use Accelerators -- unseen by the novice user -- may often speed up the interaction for the expert user so that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.Fails.
Aesthetic and minimalist design Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.Fails. Too much information on the home page laid out and formatted inconsistently. Your attention is drawn all over the page. No visual hierarchy established.
Help users recognize, diagnose, and recover from errors Expressed in plain language (no codes) Precisely indicate the problem Constructively suggest a solution. Fails.
Help and documentationEven though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Help information should be easy to search, focused on the user's task, list concrete steps to be carried out, and not be too large.Fails. They provide an FAQ page, but the formatting makes it confusing to read and absorb the information.

2. User Interview Questions

1.Tell me about your experience of finding and adopting your dog online.

  • Website used
  • Timeline (from first search to adoption)
  • Adoption application process
  • Retrieving dog

2. What drew you to your dog specifically?

  • Did you have any special considerations when searching for your dog? (e.g. good with cats/other dogs/kids, male/female, age, housebroken)

3. Why did you use (website they answered in survey) over other websites?

  • Was there anything that stood out to you as something the site did well?
  • Was there anything that stood out to you as something the site did not do well?
  • If you were to looking to adopt another dog, would you use this website again? Why?

4. Have you ever volunteered with or donated to a shelter or rescue? How was that experience?

  • Have you ever/would you ever consider hosting a foster dog? Elaborate.

3.User Survey

We created a survey and solicited parcipants to participate via social media platforms.

We are students in a User Experience design course looking to evaluate the effectiveness of a local dog rescue’s website. Through this survey, we hope to gather information about what steps of the dog adoption process are most important to the adopters.

For this survey we are asking specifically about dog adoption. In this case, the word adoption is defined as obtaining a dog through an animal shelter or animal rescue.

The survey is 11 questions long and should take less than 10 minutes. For questions or comments, you can contact us at madeline.lipkin@gmail.com.

Thank you for your time!

4. Competitive Analysis

We searched for dog rescue sites and one can see the stark differences between sheprescue.org and the other dog rescue or pet sites sites. We looked at a few but for the study I have only included two.

West Side Competitive Analysis 1
West Side User Flow
West Side User Flow
West Side User Flow

5. Comparative Analysis

We also looked at sites that are not competitor and gatehred a few insights on the visuals and layout of those sites. We focused onthe mobile versions of those sites for our analysis.

A few takeaways:

  • Don't include entire global navigation, but do include some dropdowns
  • Lots of small text links, looks very similar to desktop footer -social media links are branded and easy to understand -dropdowns easy to spot
West Side User Flow

6. Affinity Mapping

We synthesized our research data gathered by affinity mapping which revealed the consistent things our users wanted and expected.

Define

Persona:Carol Olsen

West Side Persona

User Need

Carol Olsen, a teacher, and tech savvy dog lover needs a process that makes it very easy to adopt a german-shepherd.

Design

Design for Search, Dog Bio and Adoption Application

Here is the new information architecture that we came up with based on the insights gathered. We eliminated a few pages that made no sense and consolidated that information into other pages.

User Flow

West Side User Flow

Site Map

West Side Sitemap

Sketches

West Side Sitemap
West Side Sitemap
West Side Sitemap
West Side Sitemap
Visual Design

Mid-fidelity Wireframes

Next in our processs be moved to mid-fidelity wireframes. Here are a few of the mobile and desktop wireframes that we came up with through some iterations.

West Side Mid-Fi Wireframe
West Side Mid-Fi Wireframe

Hi-Fidelity Wireframes

We next moved to our hi-fidelity wireframes and final designs.

West Side Mid-Fi Wireframe
West Side Mid-Fi Wireframe
Results & Reflections

Fantastic Redesign with Future Improvements to Come

With a complete redesign of sheprescue.org we believe that we have improved the user experience for their customers. The site is no longer outdated and is better organized. The look and feel is clean and with consisten colors and typography.

We will continue working on the design by conducting usability testing.