Screen Shot 2019-01-17 at 6.09.22 PM.png

Toolbox

Product Design, UI/UX, Visual Design

Toolbox is a web platform that aims to help students, work-study monitors and administrators in York/Sheridan Design Program ease the equipment rental process and inventory management. 

Toolbox
 

Role

User Research, Ideation, User Testing, Visual Design and Prototyping

Timeline

February-April 2018

Team

Mohit Gupta (Me), Carson YoungZhen Li

Tools Used

Sketch, Invision, Illustrator, Photoshop, After Effects

 
 


Our team was approached by the Design department at York University to create a new platform for equipment rentals in the YSDN program. The solution, called Toolbox, allows an easy equipment booking process for students, a smoother check-in and check-out experience for staff, and a more informed and easily run inventory management system for administrators.

Understanding the Target Audience


THE PROBLEM

The YSDN equipment rental program at York University allows students to select and rent out equipment to help complete projects requiring additional resources such as cameras, tripods and audio equipment. However, this system and process has yet to be digitalized, resulting in confusion policies, ineffective methods of enforcement, and unreported damage to equipment.

As a team, we were tasked with creating a digitalized system for not only the students to book online, but also help the staff (also called lab monitors) and administrators easily oversee and run the program.

 

Design Challenge

How might we design an equipment checking in/out process that is intuitive and efficient for student, monitors and administration?

 

The Solution

Toolbox is an online web platform designed to help improve the current YSDN equipment rental service.

  1. An easy equipment booking process for students.

  2. A smoother checkin and checkout experience for staff.

  3. A more informed and easily run equipment system for administrators.

The platform allows students to book items online in advance of pickup, eases the checkout and return flows for lab monitors, and creates an efficient and standardized system to ensure all equipment is accounted for for administrators.

 

Research

User Research

We began looking at this problem by interviewing the different stakeholders involved with the rental program. Due to the size of the program, there were three different user-types (administrators, student lab monitors and students) whom we had to consult throughout the entire process. These stakeholders helped us better understand the problems with the current system. From these interviews and conversations, we crafted user personas and a PACT analysis that easily summarized our research to that point: 



Constraints

We also had several major constraints we had to consider for our final solution. Some of these constraints included a lack of online payment system, a limited budget for development, and a limited amount of time for the project. To make the equipment rental process more intuitive on this platform, we focused on the core users needs:

  1. Students want an easy booking and returning process. They want to make sure that the equipment they booked are ready to use when they need them. 

  2. Monitors want to make sure that the equipment booked is in good condition when students come pick-up and drop-off.

  3. Administrators want to make sure that all equipments’ location and conditions are tracked. If equipment is missing or damaged, they also need to know who is responsible.

    More Research: PACT AnalysisUser Interview planSystem Requirement Chart

 


Ideation

Our team spent a lot of time researching our targeted users before ideation began. It was important that the platform not only served these three, distinctly different user groups, but also make sure that the user experience was cohesive across each touchpoint.


My role for this project post the ideation phase was to understand the problems faced by students when checking-out equipments from the YSDN rental service and iterate on the user flows to help improve the current process, while also syncing with my team to make use the complete product experience is cohesive.

Some ideation questions I had to work through during this process include:

  1. What are some of the problems that student experience with the current system?

  2. How might we create an easy and hassle-free checkout experience for students in YSDN?

  3. How might we educate the students about the rental agreement before they request any equipments?

  4. What would happen if an equipment that student needs is not available?

  5. How might we notify the students about any overdue balance and damage fees they owe?

 


Site Map

After we had brainstormed potential solutions and analyzed pain points, we created a detailed site map outlining where each of Toolbox's features would be developed. This allowed us to get a grasp into how the complete platform would operate and what each of need to focus on.

 
 
 
 

User flows and scenarios

The user flows provided clarity on where we should focus our efforts as a group, and the necessary steps we had to design for. This helped our group realize we had some discrepancies with the system-focused mapping of our platform above, and allowed us an opportunity to blend these two conceptual charts early. 

 

User Testing

Our team had the opportunity to meet and test these different types of users, including students, monitors and administrators with our proposed solution. These testing sessions included 6 students, 2 monitors, and 1 administrator and allowed us to receive a lot of valuable feedback and insight. We gained a lot of unique perspectives on the problem space through this.

Overall, users were able to navigate within the created space fairly easily and intuitively understood the information architecture of the product. They were also excited with the features Toolbox had to offer. We found that there were some way-finding and visual clarity issues, such as confusing labels on CTAs, inconsistent icons, and a lack of personalized features for the different user types. Through this testing, we were able to detect these issues early and iterate on them.

 View full User Testing Sessions Analysis

 

Visual Design Guidelines

Once we moved from ideation phase to prototyping, we decided to build a visual design guideline together to make sure that all design elements were cohesive throughout the design process.

 
 
 

Final Solution

After a long three months, our final solution is a collective effort that helps create a platform capable of making several significant improvements to the current rental program of YSDN. Here are the user flows for students (the user group I was responsible for), this new system is an invaluable step up from what we currently have in many different ways:

 
 
 
 

A simple and intuitive checkout flow for students to check what’s available in the inventory and quickly request items after agreeing to the rental agreement.

Link to Invision prototype 

s1.gif
 
 
 

In case an item isn’t currently available, students can place an ‘On hold’ request. Students would receive email alerts for when the item/s become available. The date picker allows them to select the date with they no longer wish to be notified about the availability of the equipment.

Link to Invision Prototype

s2.gif
 
 
 

A notification alert would pop up if a student owes any damage fees or has an overdue balance. Students can personalize email alerts in settings. New students can also check the hours and location of the rental service on campus directly from the dashboard.

Link to Invision Prototype 

 

Complete Platform Walkthrough