Shoes That Fit

At a glance

Shoes That Fit is a non-profit that tackles one of the most visible signs of poverty by giving kids in need new athletic shoes to attend school with dignity and joy. As part of LA Blueprint, we were given to opportunity to design an inventory management web application to assist Shoes That Fit with processing orders, donations, and managing inventory.

I worked specifically on the admin dashboard, inventory page, and recent activity page.

 

ROLE

TEAM

DATE

SKILLS

TOOLS

Designer

Project Leads: Vivian Wong (Design), Michael Shi (Development)

Designers: Nasser Elhajjaoui, Galen Heuer, Aye Pyae

Developers: Jerry Xu, Jiamin Xu, Kevin Antony, Laura Lu, Ryan Kim, Siddharth Nandy, Solaine Zhao

Jan 2022 - Jun 2022

Design, Prototyping, Usability Testing, Interviews

Figma

Background

Across the country, an estimated 1 in 3 children lives in a low-income household. One of the most visible and prevalent signs of poverty affecting these children is a lack of access to well-fitting shoes. Shoes That Fit is a non-profit organization based in Claremont, California which provides over 100,000 kids with new, proper fitting shoes each year through an impressive network of volunteer-run local grassroots chapters. Since their founding in 1992, Shoes That Fit has helped over 2 million students and schools supported by the organization have reported increased self-esteem, increased physical activity, improved behavior, and improved attendance for their students.

Problem

Shoes That Fit currently relies on a time-consuming manual approach to process orders and donations, and an inefficient digital process to manage inventory.

As the organization grows, the manual process becomes less manageable and less desirable.

The Challenge

How can we transition to an intuitive online system that integrates the current system used by Shoes That Fit while also allowing users to easily keep track of orders, donations, and inventory all in one place?

Solution

To address these issues, we proposed an all-encompassing web application with an educator portal and an admin portal that allows Shoes That Fit to efficiently manage their orders, donations, and inventory, featuring:

  1. A profile system for educators and administrators to ensure a secure web application and to avoid entering repetitive information for orders

  2. A summary table of all orders which allows administrators to easily find the most recent orders and to check their status

  3. Intuitive forms allowing administrators to easily update the inventory and register new donations

  4. An inventory table where administrators can sort by different criteria to find specific shoes

  5. An option to automatically update the inventory once an order is placed

Research

User Interviews

To gain insight into the users involved with the order process, we conducted 5 user interviews, including 3 administrators from Shoes That Fit and 2 educator liaisons. Each of these interviews consisted of general questions to gain a better understanding of the current process and the difficulties faced by both internal and external users, including:

  • What are some problems you face using the current methods for placing or fulfilling orders?

  • For Educators: Can you walk us through the process of placing an order with ShoesThatFit?

  • For Administrators: Can you walk us through the process of updating the inventory when an order or donation is received?

Key Takeaways

From our initial interviews with users, we identified several different issues and goals:

  • Maintaining familiarity with the current Excel spreadsheet system

  • Adding flexibility with notes feature to record special preferences

    • Girls wanting boys style or vice-versa

    • Parents wanting Velcro shoes for young children

  • Automating processes that are currently manual

    • Emailing back and forth to place orders

    • Using manila folders to organize past orders

    • These manual processes result in mistakes and inefficiency

  • Synthesizing everything for orders, donations, and inventory into one application

    • Currently using multiple platforms like TopShelf and Salesforce for different needs

    • Inefficient and difficult for users to manage

  • Ensuring that the system is easy-to-use

    • Many of the administrators and educators are not especially familiar with tech

Ideation

User Flow

Information Architecture

Wireframe sketches

Low Fidelity frames

Usability Testing

We were able to recruit 4 participants, including 2 educators and 2 Shoes ThatFit administrators, for usability testing. Our usability testing consisted of presenting the users with different tasks to complete on the prototype web application.

General tasks included:

  • Creating an account as a new user

  • Asking for general impressions of each new screen

  • Logging out of the account

For administrators, these tasks included:

  • Adding and removing items from the inventory

  • Checking recent activity and looking for new orders

  • Viewing the donations history and logging a new donation

  • Finding the details for a new order

  • Adjusting the status of a completed order

For educators, these tasks included:

  • Placing a new order

  • Adding a special note to an order

  • Reviewing a previously placed order

Key Findings & Suggestions

Through usability testing, our participants generally found the application design to be simple and clean. Furthermore, the users noted that the application was straightforward and easy-to-use, especially since it closely mirrored the current system used by ShoesThatFit administrators and educators.

However, we were able to identify some issues with the design and usability of the application. Specifically, users mentioned:

  • Some elements were hard to see or nonintuitive

    • Making fonts bigger for user clarity

    • Enlarging button touch targets for easier usability

    • Allowing users to “refresh” the page using the navigation bar

    • Editing Filters button to include the word "filter"

  • Adding more flexibility with the school database

    • Giving users the option to delete schools

Final Solution

Dashboard and Recent Activity

Inventory

Reflections

This project was an amazing opportunity for me to learn and grow as a designer. It was my first time collaborating with developers and working for a real client! Knowing that the end product was going to be used by real users put pressure on me but I was excited that my work would be able to create direct impact. I learned to prioritize feasibility and usability over visual and aesthetics. I always kept our users’ needs and technical familiarity in mind and made sure that the solutions I was ideating and creating were intuitive and simple to use. Overall, it was a challenging but fulfilling experience. I got to talk to the nonprofit stakeholders, administrators, and educator liaisons and listen to their needs and problems. Designing a solution to streamline Shoes That Fit’s system, making it more time- and labor-efficient, and thereby supporting them to create impact at a larger scale, was very rewarding.