develop for good

introduction

I volunteered with Develop For Good during their 2021 summer cycle to support our client — Digitunity in revamping their technology donation flow alongside a team of nine product designers and developers. As a product designer on the team, my role mainly consisted of translating our team’s ideas into a design and designing low-fidelity to high-fidelity wireframes.

about Digitunity

Digitunity is an organization that aims to eliminate the technology gap in society through its technology donation service. Their service matches individual and corporate donations of old technological devices such as PC or laptop computers to their 1,300+ nonprofit partners across the nation that are in need of this equipment.

identifying the problems

During our initial meetings with the client, our team was made aware of several issues that exist within the current flow. This included:

• An outdated design
• Unoptimized mobile flow
• Misuse of the flow (ex. Users would use the flow as a means to donate their unwanted items instead of only their technology)

In addition to these issues, during brainstorming meetings where our team conducted a deep dive into the existing flow, we also identified the following:

• Incomprehensible user flow (ex. there was only one way to move forward with the form, alternative responses from users weren’t designed for)
• UI was hard to navigate, especially for non-tech savvy individuals
• ex. Options to select specifications was unclear, pages consisted of lots of technical terminology without explanations

process

Given these issues we identified, our team had decided to redesign the entire flow with the goals of making the flow comprehensive and enhancing users’ experience when utilizing the service. We first conducted user research to look at how similar flows were designed and brainstormed a list of nice-to-have features we would like to include.

We experimented with ideas like making an accordion-style flow, to allow users to see the entire form at once and know what information they need to complete it. However, this turned out to be unfeasible as our form contains many content-heavy sections. Therefore, in an attempt to not overwhelm the user, we ultimately decided to use a progress indicator instead as it could achieve the same goal of showing a user their completion status.

solution

As we concluded our brainstorming meetings, we settled on the following features to include in our flow.

• Empowering the user in selecting the destination of their donation
• Allowing the option to select multiple nonprofit preferences in case their first choice was unable to accept the donation
• Allowing the ability to filter nonprofit search results by cause
• Designing our flow as a decision tree where users’ selections on each page would determine what shows up on the next screen
• A minimum requirements check to ensure equipment is in working condition and fit for a donation, if not user will be prompted to exit the flow
• Providing users with the option to recycle their equipment, in the case it does not meet the minimum requirements
• Enhancing our flow’s accessibility to users
• Including a “search by picture” feature where users can identify their equipment visually instead of manually searching for and entering their equipment’s specifications
• Including an FAQ that provides further details on information users may need to complete the process
• Creating a progress indicator to show users’ completion status on the form
• Designing with mobile accessibility as a priority

final deliverable

I was tasked with creating the minimum requirements flow, which included questions about the equipment’s manufacture date, whether or not it was in working condition, and other basic information to gauge whether or not the equipment was fit for a donation to Digitunity’s nonprofit partners.

Ultimately, we ran out of time in the cycle to develop our idea with code so we were only able to complete the redesign of the flow. Here is the minimum requirements flow that I designed:

Play with the prototype here!