P.A.W.S (Portal for Animal Waifs and Strays)
Animal Shelter Registration Database
PROJECT TYPE
Responsive SaaS Website
TITLE
UX/UI Designer
DATE OF PROJECT
April 2023 - May 2023 (4 weeks)
TOOLS USED
Adobe XD,
Adobe Creative Suite,
Miro
Overview
The project aimed at investigating the utilization of websites as a SaaS platform for data entry and exporting information.
The objective of the project was to examine the process of new animals coming into an animal shelter, including the necessary steps for registering them into the shelter's systems. This was followed by the process of finding suitable matches and new owners for the animals, ultimately leading to their adoption into new homes.
Deliverables
At the end of the project I was tasked with creating a high fidelity prototype of the systems before creation of a full case study for my personal records.
MY ROLE
I undertook this project from conception to delivery of a high fidelity prototype and full case study.
This was a project where I assumed the following roles:
User Experience (UX) Designer
User Interface (UI) Designer
Project Outputs
Representative user interviews
Empathy Mapping
Persona creations
Journey Mapping
User Flowcharts
Competitive analysis
Wire-frames
Information Architecture
Low-fidelity Prototypes
High-fidelity mock-ups and prototypes
Design System
Usability testing and analysing
THE PROCESS
The project commenced by researching into the area of animal shelters within the UK including the workforce demographic.
I focused on the RSPCA, the largest animal shelter in the UK, for my research. According to their data, the organization has a workforce of 1,749 employees and an additional 7,000 volunteers. Of this group, 66% are under the age of 35, and 71% are female.
My research showed that in 2022, the RSPCA rescued 7,412 dogs, 2,731 rabbits, and 5,900 other pets (not including cats, which they estimate to be over 20,000).
Once I had developed the representative user I interviewed staff from animal shelters, users that use online data entry platforms and people looking at getting a new pet, to ensured that I would meet their requirements including their challenges and concerns.
This approach enabled me to uncover a variety of issues that needed to be addressed and resolved. Armed with this information, I proceeded to create empathy maps, user journeys and personas.
George and Harold Brooks
George and Harold are looking for a new pet, they need information about the animals personality because otherwise they might not find a pet that will fit into their lives.
Nathan Rodriguez
Nathan is a manager and needs to distribute tasks to the correct people because otherwise it might not be correctly completed or work will be doubled up.
Nathan is a data manager who needs data to be consistent because without that data might not make sense in places it gets published
Emily Johnson
Emily is dyslexic and needs the function to double check her work before submitting it because errors in her work might get published in multiple places.
Emily is a new user of the software who needs training and a simple to understand system otherwise she will become overwhelmed and will not complete the tasks needed.
Emily is a animal shelter worker who needs to submit the same form multiple times and needs a solution that can reduce her work load.
THE CHALLENGE
Upon concluding this empathizing process, I drew this up as the main problem that needed addressing.
The Animal Registry system should be user-friendly, providing guidance throughout the input process, with features such as document importing, work distribution to specialists within the organization, and seamless transfer between office desktops and mobile devices for use in the presence of animals.
The system should also enable data output in various formats to meet different requirements, such as the company website, social media posts, and internal documentation, without having to redo the same work multiple times.
Additional areas that posed challenges included:
Maintaining standardized data and consistent "voice" in all staff-generated content.
The users searching for a pet desires a concise biography that describes the animal’s personality and provides crucial insights into its behavior.
The platform needed to addressed additional user needs such as dyslexia, visual impairment etc.
Ability to search and update information on animals already at the shelter
P.A.W.S will enable users to effortlessly input and/or access information, before seamless distribution onto multiple platforms. This will significantly enhance the user experience, allowing the saving of time by elimination of reproduced work.
The Competition Audit
I wanted to explore how competitors displayed information on animals for adaption. The competitors I analysed were the RSPCA, a Facebook social group Cat Rescue UK, a local charity Cats in Distress, and Forever Puppy, which operates as a sales page for people to sell puppies.
Brainstorming
Some of the techniques I used for idea generation where Crazy 8's, How Might We, Sketching and Story-boarding to name just a few.
THE SOLUTION
After reviewing the brainstorming activities, I decided on the solution that I wanted to advance to the prototyping and testing stage.
My proposed solution aimed to simplify the registration process by implementing a seamless system that allows for basic registration of the animal including the animal’s name, type, sex, and issuing a reference number, which can then be distributed to specialists such as vets and behaviourists for assessment.
Users can fill in their required work while the animal is being seen, and the specialist can update the database with their software at the click of a button, reducing the amount of work that needs to be redone. The solution also includes key features such as the ability to save then move from one device to another seamlessly and update information at a later stage, an AI text generator for creating bio’s quickly with the same tone, and multiple users being able to work on the same file simultaneously.
To address the pain point of new users struggling to learn the system, a tutorial version of the system will be available to help guide them through the process.
Additionally, information will be presented in small bite sized chunks in a sequential structure and with contact details for a go-to person who can advise on any issues with the system will also be provided.
During the prototype stage, it is crucial to consider accessibility issues to ensure the solution is accessible to all users.
Information Architecture
To aid in comprehending and organizing the information structure of the website, my first action in the process involved developing a user flow that outlined the anticipated user journey within the application.
Once I established this user flow, I proceeded to construct the information architecture of the site.
Wire Frames
Handdrawn wireframes
Digital wireframes
Low-Fidelity Prototype
Using Adobe XD I converted the digital wireframes into a low-fidelity prototype, when it was complete it was taken to the first usability testing stage. The low-fidelity model can be accessed through this link.
Useability Testing (Lo-Fi)
The low-fidelity prototype, needed adjustments these where based on the research from usability testing that I undertook.
The study took the shape of one-to-one interviews where users where required to complete tasks. Through observations and information suppled by the users I created affinity diagrams to help analyse the findings.
Insights
Based on the theme that: Users were frustrated with the inability to edit information that they knew or needed to change, an insight is: users require the ability to edit generated content.
Based on the theme that: Users didn’t understand what they had to do as they didn’t want to read the screen, an insight is: Keywords and call to actions need to be punchy and picked out without reading blocks of text.
Based on the theme that: Users kept clicking buttons multiple times as they didn’t know they had done it, an insight is: Button needs to give visual feedback that they had been clicked.
Based on the theme that: Users don’t understand the V&B pages and so were not able to complete what they need to on these pages, an insight is: These pages need to be redesigned and taken back to the wireframe stage.
Based on the theme that: Users were confused with what would happen if they clicked buttons, an insight is: Wording on buttons and calls to action need to be .
Based on the theme that: Users got frustrated with the amount of times they had to click to move forward an insight is: Analyse processes that can be simplified for moving through the product.
Based on the theme that: Users missed navigational elements, an insight is: Placement and size of navigational elements need to be adjusted to be more noticed.
Based on the theme that: Users didn’t feel that the search function was represented enough an insight is: To place the search function in a more prominent screen position and expand on its function, to be fit for task.
P0 Issues
- Include names of colours by the colours to support visual impaired users
- Inc. what file types can be uploaded
- Remove iconology that means other things (editable tick boxes in places that are not editable)
- Need somewhere to reset password when passwords are forgotten
-Rework V&B pages from ground up
Adjustments
Adjustments where made to the lo-fi model and tested a couple more times before being taken forward to the next stage.
High Fidelity Prototypes
Subsequently, high-fidelity designs were created through the process of mocking up ideas. Before a final prototype of this version was developed, which can be accessed through this link.
If you wish to delve into more details of the project, you can follow this link to access my comprehensive case study.
LESSONS LEARNT
Throughout the project, there have been several instances of self-learning. One notable instance was approaching the problem from two different perspectives: first was considering the shelter staff inputting information and how they would use the system and second considering the needs of people wanting information when searching for a pet and trying to align these two needs together.
The most challenging aspect of the project was establishing communication with industry professionals. Many major shelters had policies against answering questions on this area, and smaller shelters lacked the necessary resources for research interviews.
During the initial round of low-fidelity usability testing, several issues became apparent that should have been addressed earlier. To address this, I will create a self-directed list of common issues to tackle before reaching this stage of projects in the future.
Furthermore, observing how users struggled with what I considered to be easy functionality taking away functions to try and reduce work load actually had the opposite effect on some users and so made me realize that users often desire more feeling of control over their actions, to ensure they have feel of comfort and that its in their control still.
Transitioning to the high-fidelity stage of the project posed challenges in maintaining the software’s comprehensive feel while adhering to web design constraints.
Lastly, I created mockup designs for the platform on smaller screens, as the primary interface would be the office computer. However, the platform needed to be responsive across various devices, such as tablets and phones, and this would require its own testing on these screen sizes. This could also involved incorporating device-specific functionalities like built-in cameras.
