Wiz Partners
Manage school admin work at ease
MY ROLE
Product Designer
ACTIVITY
User Research, Interaction Design, Visual Design, User Flows, Rapid Prototyping
CLIENT
Wiz Robotics
TIMELINE
March - June, 2024
TEAM
Jamie Tang, Software Engineer
Jack Zhou, PM & Owner
Jenny Wang, End User
Yichen He, Design Advisor
With an outdated CRM dashboard and a handful of needs being met, Wiz Robotics, a school that helps students with STEM, was losing valuable new customers and profit.
To flip the narratives, Wiz elevated the dashboard by revamping workflows, modernizing UIs and reimagining how they want to grow big. The result is a beautiful and effective CRM dashboard that is both easy to manage and helps staff to get work done. The product has its own name within the Wiz ecosystem - Wiz Partners.
ONE
Tool for all admin operations
+45%
Increase in user efficiency
+7%
Increase in conversion rate
/ THE PROBLEMS
Outdated tool is costly and insufficient
Wiz’s business is booming, attracting many new customers. However, the outdated tool is neither keeping up with the business's growth nor meeting the admin team’s needs to onboard or convert new customers efficiently.
Business Problem
Outdated dashboard does not help for growth
Disorganized user flows
Lack of features and data points
Outdated UI library
User Problem
Lack of efficiency to streamline admin work
Disorganized customer datas
Still rely on paper, Excel and human memories
Lack of automation
/ THE CHALLENGE
How to manage school admin work at ease and drive sales?
/ DESIGN STRATEGY
Start from the Step 0
I initiated the innovation process starting with customer registration and the ability for the admin to add different classes for purchase, as these are the foundational steps before any other “customer service” workflows. These two steps were also the most frequently mentioned pain points by employees during user interviews.
Conversion Funnel and Design Strategy
Image
/ DIVE IN: ENROLL NEW STUDENTS
Current Enrollment Blocks
The existing enrollment process shows an insufficient workflow that requires the user to go through unnecessary clicks and repetitive steps with no clear indicator that the students are in the same household.
Step 1: Reimagine the end result
Before jumping in to map out the new journey map, I took a step back to work with the team and reimagined what the end result would look like. We started from the Student List screen to finalize the data that requires immediate access and started from there.
Final Student List Screen
Image
Once we had all the data points, I transformed them into registration forms on a grid system and tested them out with the admin team to see if they were aligned with their daily operations. The form is on a grid system, so we can easily rearrange them if we want to fit them in other canvas sizes.
Registration Forms
Interactive
Step 2: New Workflow and New Layout
I first mapped out the new user journey that maximizes the conversion rate - after registration, users immediately move into purchasing to buy their first class. Both registration and purchasing UIs need to work for single and multiple student use cases.
New User Journey
Image
After testing some layout options, I found the multi-layer menu works best for the user to enroll multiple students and have their information on the same screen. This layout solves our problem and will keep users informed at all times.
Multi-layer Menu Info Architecture
Image
Step 3: Final Layout Anatomy
I first mapped out the new user journey that maximizes the conversion rate - after registration, users immediately move into purchasing to buy their first class. Both registration and purchasing UIs need to work for single and multiple student use cases. After testing out some options, I found the multi-layer menu works what we are trying to achieve.
Final Registration Forms Anatomy
Interactive
Enrollment Workflow Prototype
/ DIVE IN: PURCHASE CLASSES FOR MULTIPLE
Current Purchasing Blocks
The existing workflow of purchasing multiple classes for multiple students showed the same blocks - repetitive steps and clicks can be simplified.
Step 1: Identify Important Money Data
Currently, users can only manually type in discount codes with limited discount types, but Wiz offers multiple discount types as incentives. I categorized the discount types and use cases through interviews with the admin team.
From a customer standpoint, to place an order with confidence and transparency, the admin staff needs to have immediate access to all the cost details in front of them to minimize the wait time and optimize the conversion rate.
Discount Types
Quantity
E.g Order more than # to get extra X% of discount
Special
E.g Return customer, special gesture, etc.
Total Cost
E.g Over $$ of total order to get the extra % of discount
Cost Details
Per Course
E.g The selected course
Per Students
E.g All selected courses for students
Total Cost
E.g All courses for all the students
Step 2: New User Journey Exploration
Considering we already have a workflow to link students, I incorporated the result into the purchase flow as a “hint” so the user can encourage or remind the customer to add more students for purchase.
Different discount types are also part of the workflow and users can easily use the hint note or add special discounts as needed.
Step 3: Final Layout Anatomy
As I already created the forms and used the multi-layer menu layout, creating the purchasing workflow and UIs was fairly seamless.
Final Purchaing Forms Anatomy
Interactive
Final Purchase Workflow
Project Takeaways
This is our first step in revamping the Wiz Partner. Here are some of the takeaways that I would carry forward:
User vs. Customer
The “Admin” is the user I designed for, but the Students/Parents are our “customers”. Differences between these two personas helped me be mindful and empathetic for different goals.
Be mindful to connect dots
While working on 7-8 workflows simultaneously and to innovate workflows, being empathetic with the user and the customers helped me to be in “character” and connect the dots intuitively.
Leverage existing resources
The existing design system helped me go from 0 to 1 quickly. And I also leveraged Google Materials Library which saved a tremendous amount of time to create new components.
Open communication
We were lucky to work in a small team that was easy to book meetings to share ideas and insights from all directions. It helped us to be mindful of other’s work from the very beginning.