UX design from conception to high-fidelity prototype, Writing
Tool
Adobe XD
Duration
October 2022
Create a responsive website for the dedicated mobile app “PetStats”
Main modifications from the app version
A plan was developed for the web version of PetStats. The PetStats app used a radar chart to present the results of the nutritional tracker. Some users in Asian countries mentioned that bar charts are more intuitive. I tried adopting a bar chart for the web version.
Nutritional tracker
Simply registers the current amount of pet food and inputs the amount eaten. You can check whether the nutritional value is sufficient.
Easy sorting interface
Enhanced categories, making it easier to sort by brand, food type, etc. on a single screen
Design Process
Design & Refine
User Flow & Paper Wire Frames
Low-Fi Prototype
Usability Test
High-Fi Prototype
Usability Test
I went from hand-drawn wireframes to digital ones, followed by prototyping the main user flow.
Impact
When testing this web version with the same participants as the dedicated mobile app, some said that this version was “clearly easier to use.” To make this app more realistic, AB testing is required for each country.
Reiko Yoshida Bilingual visual designer in Tokyo | Freelance | Branding | UX UI | Graphic design | Localization | Available in Japanese and English