The first capstone project of DesignLab's UX Academy should have been a genuine unsolicited redesign of an existing website, i.e. ilpaesedeigatti.blogspot.com, a blog-turned-website that represents a small local cat shelter. Unfortunately, despite accepting the redesign, the owner did not want to collaborate during the research phase. This is why the research phase went on without being able to consider the true needs of the actual stakeholder.
As the current website was not fully responsive and did not look professional at all, the main goal was to create a usable responsive website that would fit the cat shelter and inspire trust in the user. Creating a logo and definig the brand, both of which were absent, were additional goals.
Duration: 1 month.
Role: UX Researcher, UX/UI Designer.
Tools: Figma, InVision, Illustrator, Maze.
While wokring on the redesign of the Il Paese dei Gatti website, I relied on the Design Thinking process.
Usability test plan
My research included a competitor analysis and customer interviews, both in-person and online using a questionnaire created with Google Forms. While the participants of the in-person interviews were recruited among family and coworkers, the participants of the survey were recruited on Slack among fellow UX Academy students.
The goal was to get a feeling about what competitors were doing, find out what users would need to know to consider a shelter reliable (both in general and regarding contents of a website), how they chose/would choose their cat(s), and so on.
The results confirmed the type of provisional personas I had created during the research ramp-up, as among the interviewees there were people who adopted a cat from a shelter, donated to shelters and/or volunteered for shelters. It helped flesh out the personas with information based on real data concerning e.g. their needs and fears.
In general, regarding the online presence of a cat shelter, respondents valued beautiful pictures of cats and location, a professional layout and testimonials by cat adopters when it came to reliability.
The insights gathered during the research phase were extremely valuable and they helped me during the next phase of defining the product. My approach included constant interation, albeit user testing only happend after creating the mockups.
Based on the research, I created the feature roadmap, that ranked the features from must-have to "can come later". Later, I created a sitemap that showed how the website would be structured. In order to define the steps and therefore the pages required for each one of the main tasks that arised from the three personas, I created task and user flows.
I sketched different versions of the home page and then proceeded to create grid-base, responsive wireframes using Figma.
After a brainstorming session that helped me defining the brand's attributes, I created the logo, as well as a style tile, and was then ready to create the first mockup, which underwent various iterations. Later, I also created a UI kit that would illustrate several important aspects of the design.
While I like creating wireframes, applying the brand elements to a design is extremely rewarding, as it makes the screens become alive, like adding flesh and skin to a bare skeleton.
Creating a logo is always challenging, although brainstorming sessions are very helpful. But finding the right combination of color, type, sizing and placement is always tricky.
After creating the mockups for all three screen types (i.e. desktop, tablet, mobile phone), I developed a protptype using InVision.
This helped me understand whether all the steps the user would need to follow to complete the main tasks presented in the task flow were present.
After defining the test objectives and other specifications, I used Maze to conduct my usability tests on the desktop version. The results were then gathered and summarized in a report and illustrated by means of an affinity map that included possible solutions to the problems that were highlighted by the test.
In general, the users were able to complete all tasks. Issues concerned e.g. the form to apply for adoption, as users either missed it (as it would appear once the CTA was clicked) or expected to be directed to another page. One user also perceived all elements to be to big, confirming a doubt I had.
This was the first project I carried out without the guide that was provided at the beginning of DesignLab's UX Academy. Despite this, all steps ran smoothly and it was interesting to dive into the world of (cat) shelters, as, like the respondes of my interviews and questionnaire, I love animals.
The resulting website would finally offer a professional presence to the cat shelter, with beautiful pictures and testimonials, which are all elements that prove the shelter is reliable, according to my research. Moreover, the website would now be easily navigable with a desktop, tablet or mobile device.
Given more time, I would also have conducted in-person, moderated usability tests and recruited more interviewees, both for the in-person interviews, as well as for the survey.
Overall, I enjoyed every step of this project, not only because of the topic, but also because each phase led to the creation of a valid redesign of a blog-turned-website that was neither professional nor appealing, as the layout looked quite disorganized and inconsistent, and it was not very responsive.