Close
View Project

ABOUT

Xi Xiao Bao(洗消宝)is a vehicle disinfection product for the pig farming industry. Empowered by smart devices, it secures the pork supply chain against its top hazard, African Swine Fever.
Yingzi creates IoT solutions to automate pig farms. I was tasked with designing the phone app for its new vehicle disinfection product line, from the primary research to the initial launch.
My contribution
2021 May - August
Yingzi Tech Co
Research
UIUX Design
Agency
Project Timeline

IMPACT

After the success of the pilot run, with the support of the local government, Xi Xiao Bao was quickly promoted and installed in more than 50 vehicle disinfection centers in various pig transportation lines in Guangxi Province, securing the production of more than 200 medium and large pig farms.
"Recently, Yingzi Technology has obtained another certificate - its product "Xi Xiao Bao" successfully passed the audit of Department of Public Security and obtained the third-level 'Information System Security Level Protection Certificate'..."
Project Context
In China, preventing African Swine Fever has become the top priority for hog farms of all scales.

What is African Swine Fever (ASF)?

African Swine Fever is a highly contagious and deadly swine disease that can affect both farm-raised and feral (wild) pigs of all ages. ASF doesn't infect people, but it is readily passed from one pig to another by direct contact with bodily fluids from an infected pig.

How damaging is African Swine Fever?

It is estimated that 43.46 million pigs in China died either due to ASF virus infection, being culled to stamp out the virus or as a consequence of other ASF-related impacts during the first year of the ASF outbreaks, accounting for 6.3% of the total number of pigs slaughtered in 2018 (that is, 693.824 million). The total economic loss caused by the ASF outbreak is estimated to be about US$111.2 billion.

How to prevent African Swine Fever?

Since no ASF vaccine has been developed yet, the spread of ASF can be prevented only by early detection and the strict application of classical disease control methods, including surveillance, epidemiological investigation, tracing of pigs, stamping out in infected holdings, biosecurity measures, quarantine, and animal movement control.

CHALLENGE

Based on the Product Requirements Document our team received, these are the goals we had to accomplish for the MVP.

01

Allow managers and business owners to track the performance of the disinfection center's with ease and identify the bio-hazard risk in advance.

02

Integrate smart devices into the existing workflow to assist employees in uploading and processing disinfection data

03

Synchronize disinfection data with the government and other organizations in real-time

Research

Contextual Inquiry

Our project team paid a visit to a vehicle disinfection facility in operation to deepen our understanding of the problem we are solving and gather ideas over how do we digitalize this existing workflow to go zero to one.
This is an eye-opening experience for someone like me who has just joined the team, especially after witnessing the current digitalization level and workflow management mode of the disinfection center. What I observed there confirmed the severity of the bio-hazard risk issue we are solving for.

Understand the workflow

By consulting with experts and observing field operations, we gathered enough information to map the 5-step workflow of a typical vehicle disinfection center. It helps us  understand the complex matter quickly and serves as the foundational blueprint for our to iterate and design on.

Primary Interview

While the product's goal is to digitalize and standardize the disinfection process, understanding how employees think and feel about current workflows is also critical to the success of our products. To learn their viewpoint on the daily work, we interviewed staff at the disinfection center.

Persona

According to the interview outcome, we divided our product users into two types, workers and managers. Both of them are our primary users so we created a persona for each to clarify that they have different responsibilities and pain points.

Learning

These findings from the primary research allowed us to approach the day-to-day needs of employees, making us more user-centric when designing those features and thinking about how those functions help them adapt to a more regulated process rather than brutally disrupting their current workspace habits.

01

The disinfection centers maily rely on chat apps to share information, but the operators won't look at their phones during work, so miscommunication issue issues persist.

02

The workers usually don't fill out the disinfection form immediately after completing the task. They usually do so after a few rounds of tasks because it's troublesome to put on and take off gear and gloves

03

The workers complain of unpredictable workloads. Especially during peak hours of the day and different times of the month. Sometimes they have to work late into the night.

Design

Flowmap

To begin with, we integrated newly-developed smart devices capable of uploading data and restructured the disinfection process from creating a disinfection appointment to departing the facility. And we defined what key actions the workers need to perform to drive the new system.

Information architecture

We created the information architecture of the MVP based on all of the features listed in PRD and our research insight. It outlined all the different screens and features we need to design. This helped us get an overview of how users of different needs would navigate the system and interact with functions at specific situations of their work.

Wireframes

After creating high-fidelity wireframes for the MVP, we set up review sessions with the project team. Front-end and back-end engineers provided their points of view on the feasibility of the design. We made corresponding changes to the design in consideration of the project timeline. When the final design version was approved, the design team divided the screen design tasks and completed them separately.

Visual Design

The green color palette and typography we picked for the product conform to the company's visual guidelines. Because some of our users' display screens are relatively outdated, we choose to use as few colors as possible to create a clear, easy-to-use, and compatible user experience.

As for typography, since some of our users have small screens size, we design with the screen size of the iPhone 5 to ensure that all information can be read effortlessly on an 1136-by-640 screen.

Testing

After completing the visual design, we simulated the disinfection scene and tested its usability on screens of different sizes. Considering the dampness of the facility and the inconvenience of the employees using the product with their gloves on, we added a waterproof phone case and include it as a part of our solution.
Deliver

Everything you need to know

The home screen of the app listed all the prioritized information the users need to know. The notice board bridges the gap of communication in the facility and allows important messages to be broadcast and received by all employees. The task dashboard allows workers to quickly locate their current tasks to perform the required action. It also provides relevant information on all the waiting tasks including the task number, task type, vehicle plate number, and workspace information.

Tracking all Disinfection Data to secure the supply chain

Every registered vehicle is represented as a card throughout the system, the user can easily read its basic information and its current stage in the disinfection process. Quality Assurance workers can click the card to read the details of a specific step, such as the operator, the operation time, the type of disinfectant used, and the water usage.

Insightful Analytics Leads to better decision-making

Xi Xiao Bao allows users to analyze the facility data. Every work order would be logged and processed. Based on our research, we found this feature would not only informs workers of the amount of work they would undertake every day but more importantly benefit facility managers in coping with the surge of seasonal transportation demand.

Standardize the process to lower the rework rate

Xi Xiao Bao connects with smart devices and reminds the workers when the disinfection metrics are not met. It secures the disinfection quality and reduces the cases of rework, which would increase the productivity of the facility.

next steps

01

Evaluative research

Once the product has been implemented, it would be essential for us to talk to the users at the disinfection facility and learn how they use and feel about the new system so that we can evaluate our design and iterate it.

02

On-boarding experience

Due to the tight schedule, we haven't had the chance to design a seamless onboarding experience for the product, which is essential for those employees who are intimidated by learning new software.

03

Desktop backend

This phone app is the first touchpoint of Yingzi's new vehicle disinfection solution. And a desktop end-end that allows for more customized features and better management tools is the next milestone listed on PRD.

Reflection

After the successful pilot run, Xi Xiao Bao was officially launched. The system runs smoothly and the error rate is low. Our products have received positive reviews from customers and users.  By the time I left the company, the system had been implemented in more than 50 disinfection centers in Guangxi Province.

User scenarios are the key to designing industry product

This is my first time designing an industry product from conception to completion. Its design process faces more constraints than a consumer product because an established workflow sometimes is reluctant to change. Its user experience consideration falls upon the efficiency of acquiring information. Therefore, we should pay attention to the logic behind the screens and be crystal clear about its user scenarios.

Be flexible and be resourceful

Due to the Covid surge and the quarantine policy, we couldn't leave the city to carry out the user research and testing in the most ideal way. But through remote measures and other prototyping techniques, we were still able to simulate the use case and test our solutions for iteration.

Next Project

Plague Inc. Redesign