Streamlining the Inventory Management Process for Theatre@First nonprofit
Theatre@First is an all-volunteer community theatre based in Somerville, MA. They draw upon the talents and support of individuals and organizations throughout the community to provide opportunities for their participants and audiences to experience quality live theatre in a variety of local venues.
Over the course of two semesters, my engineering team at JumboCode developed a comprehensive inventory management website. As the lead designer from start to finish, I collaborated with the non-profit to evaluate the core needs of their organization and worked with the PM/TL to develop a feasible technical solution to be built out in less than a year. The platform will be used by Theatre@First admins as well as volunteers.
I designed the website from 0 to 1, along with a full-scale design system from scratch and design handoff to help ensure that the product can be maintained by the non-profit long term.
Note: My first big, end-to-end UI/UX project ever. Now, I am excited to apply what I have learned through this project to the next one in my second year involving with JumboCode ✧
Date
Sep 2023 - May 2024
Role
Lead Designer
Skills
Visual Design, Interaction Design, Design Systems, Usability Testing
Team
1 Project Manager, 1 Tech Lead, 10 Developers, 1 Designer (Me)
The Problem
Theatre@First volunteers collect 2000+ quantities of props, furniture, costumes, and other materials in their inventory. As this happens, it can be difficult for them to keep track of what they own, where it is, and what condition it is in.
The Solution
To address these challenges, I worked with the client and development team to create an inventory management system that is streamlined, centralized, automated, and scalable. With this comprehensive system, designers can quickly check availability, locate specific items, and ensure everything they need for a production is readily at hand.
⎯ ⋆˚✿˖ °𐙚 ⊹ ࣪ ˖ ᡣ𐭩 ⎯
Getting started
Stakeholder Interviews & Insights
⎯⎯⎯
Advocating for User
At JumboCode, the fast-paced environment required designers to quickly deliver high-fidelity results with minimal research outside of the project brief. However, given the broad scope of our project, I advocated for incorporating user research into the process. I took the initiative to conduct stakeholder interviews with the Inventory Coordinator and staff of Theatre@First to gain a deeper understanding of their needs and challenges. Together, we established a single source of truth that outlined the project’s expectations, goals, and requirements, ensuring alignment between the team and the client.
🤔 Key questions:
What challenges do volunteers face with the current traditional inventory system?
How can the new platform address the challenges around managing and finding theatre inventory?
✍🏻 Insights:
Inefficient Search Process 🔍
For volunteers, searching through physical boxes for specific props is time-consuming and prone to errors as it is based solely on memory retrieval.
Lack of Organization 📋
With no formal inventory management system in place, there is no concrete record of items. The current reliance on physical labels creates disorganization, especially when trying to track the condition of each item.
Manual Inventory Tracking 📝
Managing the inventory manually, including adding new items, is a tedious process. Volunteers rely on spreadsheets, which often leads to duplication of records and inaccuracies during busy show preparations.
Difficulty Scaling 🚀
The lack of a structured inventory system limits the ability to scale. As more props are acquired, especially during new show seasons, the task of managing and locating them becomes overwhelming.
—————————————————————————————————————————————————-
Who Is Involved?
After breaking down the insights gathered from stakeholder interviews and talking with my Project Manager and Tech Lead, I learned that there are multiple stakeholders involved in the overall ecosystem of this project. Before continuing to address the insights, me + Project Manager + Tech Lead broke down each role and their respective responsibilities to gain clarity on each stakeholder.
Design Principles
To move forward with the design, I defined a set of reverse principles based on the insights gathered, and 4 key design opportunities emerged to guide the platform’s development:
⎯ ⋆˚✿˖ °𐙚 ⊹ ࣪ ˖ ᡣ𐭩 ⎯
Next,
Set The Foundation
⎯⎯⎯
How We Collaborated
As my first time collaborating with a cross-functional team, I initiated 1:1 conversations with the PM and TL to learn about their working style, expectations, and their goals. These discussions provided clarity on how we could best work together and allowed me to align my design process with their technical and project management needs.
Unified Design System
In addition to defining the primary and secondary color palette, I also specified a set of indicator colors—such as error, info, and success—that cover a wide color range. These colors are designed to accommodate various use case scenarios, and I ensured to communicate their specific applications during the design handoff process..
I used the 4px baseline grid to ensure consistency and coherence across different reusable components in my Design System. Rounded corners were also used to make the interface appear softer and more inviting.
—————————————————————————————————————————————————-
⎯ ⋆˚✿˖ °𐙚 ⊹ ࣪ ˖ ᡣ𐭩 ⎯
Rounds of
Iterations, Testing, and Iterations
⎯⎯⎯
Some drafts, feedback, and 3 rounds of think-aloud usability testing sessions later, I made iterative improvements tailored to the specific needs of Theatre@First’s volunteers and admins:
Inefficient -> Streamlined
—————————————————————————————————————————————————-
Disorganized -> Centralized
—————————————————————————————————————————————————-
⎯ ⋆˚✿˖ °𐙚 ⊹ ࣪ ˖ ᡣ𐭩 ⎯
Final Design
Streamlining the Inventory Management Process
⎯⎯⎯
A CATEGORIZED LIST OF ITEMS
Volunteers can easily search and filter inventory based on categories or tags, allowing them to quickly locate specific items without navigating through physical storage.
PREVIOUS SOLUTION
Volunteers searched through boxes manually and based on memory retrieval, which was time-consuming and often prone to errors.
UPLOAD SINGLE ITEMS
Admins can upload new inventory items individually, ensuring that all items are accurately recorded and easy to retrieve.
PREVIOUS SOLUTION
Inventory additions were managed manually via spreadsheets, often leading to duplicated items specifically during the busy season.
VIEW ITEM DETAILS AND COMMENTS
Users can view the item details (eg: images, description) and include their comments specific to certain items, possibly noting certain conditions or attributes.
PREVIOUS SOLUTION
There was no centralized way to track the condition of an items. Volunteers often have to go in-person to check.
⎯ ⋆˚✿˖ °𐙚 ⊹ ࣪ ˖ ᡣ𐭩 ⎯
As my first big UI/UX project,
I learned that …
⎯⎯⎯
Communication is key in a cross-functional team
As the only designer for my first end-to-end project, I learned that constant communication with cross-functional teams (project manager, tech lead, developers, and clients) is crucial. This ensured we were all aligned on project goals, technical constraints, and evolving client requirements.
The first design is never the final
Through active participation in the iterative design process, I gained a deeper appreciation for the importance of user testing in meeting user needs. If I were to revisit this project, I would challenge myself to explore a broader range of design variations before settling on a final choice for further testing. This approach would foster more creative solutions while balancing user experience and technical feasibility.
Early feedback is essential
Working in a team is very different from designing alone. In the face of ambiguity, I learned that it is crucial to check in with developers early to make sure that my designs worked for their constraints and asked for feedback from clients throughout the process to make sure that the designs are solving their problems. If I were to redo this project again, I would iterate more on lo-fi and mid-fi wireframes based on stakeholders' inputs.
Design for different use cases
Collaborating closely with the project manager in drafting product specs allowed me to consider multiple user flows for different roles, as well as different edge cases we might not have thought of. This comprehensive approach ensured that the design was flexible and accommodating across diverse use cases for diverse user roles.
