An app that helps bring pets home.
This is a UI design for the Asian Association of Animal Shelter Healthcare's Wandering Terminal WeChat mini program - a sub-app which helps owners find lost pets, leveraging the social connections and backend search potential of Tencent's WeChat network.
The team consisted of volunteers from across design, computer science, and management fields. I was very inspired by the skillsets of each member of the team and how we were able to communicate across our different fields and areas of expertise. Between two different languages and many different timezones, with people who's daytime commitments ranged from studying at college to coding at Google, we were able to connect the different stages of app development to create this product.
This was the first time I worked with such a diverse team where both my Chinese language skills and programming knowledge were put to the test. Being able to communicate in Chinese helped me capture nuances and reach conclusions quickly when talking to the team in China while my programming knowledge helped me with my research in the limitations of WeChat mini programs and with talking ot the frontend and backend teams about the technological capabilities avavailable to our product.
Mingyu, who is the UX designer on the team, created the UX design with input from me. She then documented the flows and intent to make it easily translatable into the final prototype.
I then worked off this document to create the interface and visuals which would facilitate the interactions Mingyu intended.
Buttons and options
Search inputs and drop downs
A combination of rounded corners and drop shadow were used to indicate which blocks were in the "foreground" of the interface and were hence more important.
Physical layering of certain graphics in front of others was used to indicate what was "on top" or needed the most immediate attention. Addtionally, the typed search bar is "indented" to indicate that it requires the input of information to "fill" the space to function.
The pop color yellow was used to highlight the most important information and subtly lead the user through the flow by accentuating the next step.
Special thanks to Mingyu and Sophie 姐.
Programs used for this project include: