PART 2 of designing the RSPCA Pet App
The second part of this blog includes:
- two visual representations of the user scenarios
- lo-fi wireframes for final prototype
- A/B split testing
- user research interviews
- final prototype for the RSPCA app
Progressing on from the User Scenarios in the first part of the process, I created two storyboards to visually map out how they interact with the RSPCA app in their respective situations.
“Sam” needed an app that would provide him with sitter services, pet food recommendations and training services. “Mark” needed an app that would allow him to research specific breeds of dogs to suit his children and active lifestyle. I made sure that all these needs were catered for so that the app would be applicable to existing pet owners and those who were looking into buying one.
I then created some low fidelity wireframes so that I could map out how the screens would progress through the app. I made sure that they had an intuitive flow and directed the design towards a user that was just signing up for the app for the first time.
From there, I took the designs into Figma and begun the prototypes.
I did some research into current UX design trends and found that glass morphism was popular, so I made sure to include this as an element in my designs. I used the green and blue in the original RSPCA logo as highlight colours throughout the design eg. the blue always signifies that the element is clickable.
I incorporated progressive disclosure through the drop-down arrows in the initial set up page and the filters throughout the app as these are universally recognised icons that users are aware of. It also cleans up each screen so that the user isn’t bombarded with information. I was aware of the user scenarios whilst designing the prototype and kept their goals in mind.
I then conducted an A/B split test on five users from different age groups and demographics. I changed the layout of three of the screens in the B prototype to see which one they preferred. After they’d tested each of the prototypes, I asked them the following questions:
- Did you find anything difficult about the app?
- Could you see yourself using this app to help you look after your pet?
- Would you be more inclined to purchase products and services through the app from the recommendations?
- Would you use this app if you hadn’t owned a pet before but were looking into buying one?
- What would you add or take away from the app to improve it?
- What did you like about it?
- Which one did you prefer (between the A/B prototypes)?
They managed to progress through the prototypes pretty well but struggled with the fact that it wasn’t fully interactive, especially at the start. They all commented on that in the questions afterwards but as this was just a prototype, I wasn’t too concerned about that.
The feedback that I received from the test users was actually quite similar. They collectively preferred when all of the information was presented on one screen and didn’t require scrolling. They said that vet page needed to have bigger writing and that all of the icons should be direct links to the email, phone and website.
Contrast was another big thing that came up in the user tests. They said that the writing on a few of the screens would benefit from a higher contrast with the background so that note was made.
They liked the simplicity of the app, the flow and that it had a lot of information for where they needed it.
After the interviews, I went back through and edited the prototype so that it was an amalgamation of A and B. The final prototype had:
- Better contrast on drop down menus
- Increased size contacts for the ‘Vet’ page
- No white stroke on blue clickable buttons
- All relevant information on one screen, reducing/eliminating scroll
- Lighter paw print in the background
- Information laid out in squares
Overall, I found this an interesting task to work on and not something that I would have initially picked out for myself to undertake. The user test sessions were extremely valuable and resulted in some feedback that I wouldn’t have picked up on by myself. I think that the final prototype ticks as many boxes as it can (being a prototype) and would make many users happy — I hope!