Pencils for Success

A platform that helps organize 300+ pounds of supplies to distribute to 30+ schools in need throughout Kansas, Texas, and Georgia.

Pencils for Success Header Screenshot

About Project

Pencils for Success About Screenshot

The project is to create a platform that would manage the supplies that Pencils for Success receives and identify and distribute the supplies to schools in need. The platform would notify Pencils for Success whenever a school demonstrates a need and the schools in need of the supplies that Pencils for success has.

Pencils for Success Thumbnail

Our Client

Pencils for Success

Pencils for Success is a 501(c)(3) nonprofit that provides essential school supplies to underserved schools and foster care. They receive donations from the community that they redistribute to centers in need which include over 5000 students. They currently have chapters in Georgia, Texas, and Kansas in the US, as well as in New Delhi and Indore in India.

Our Process

Product Scope

Client Goals 🥅

This technical experience should be an extension of the existing website, easily accessible to prospective Pencils for Success donors, recipients, and chapter leaders. Specifically, the admin will oversee the chapter accounts led by each location. Each chapter account will manage supply requests and the donor map as well as control access recipient accounts. The recipients will maintain updated contact information and request needed supplies. Finally, donors will view the recipient map and understand what resources Pencils for Success needs.

End-User Goals ⚽

Admins must be able to add/remove/edit chapter accounts, including chapter location & login credentials. Chapters must be able to add/remove/edit recipients shown on the map, supply/view/edit requests, and edit recipient accounts and information. Recipients must be able to edit contact info and make/edit/delete supply requests. Donors must be able to view what donations Pencils for Success accepts, view what supplies are needed and the contact/donation information for each branch & see donor recipients in a map view.

Technology 💻

The project was architected using NextJS, React, and Chakra UI. This development deployment is on the Bits of Good Vercel account and uses a free Heroku Postgres database on the Bits of Good Heroku account. For actual production deployment, an Azure PostgreSQL Database will be used instead.

Our Solution

Key Features

Donor Landing Page

The homepage of the website, displays a map containing a users location. In the top right of the screen, are three buttons, each of which will lead you to the corresponding account login page. From here a user simply has to enter their correct login details, and they will be taken to the homepage for their respective account.

donor land

Admin Dashboard

Allows for easy creation and management of the different Chapters of Pencils for Success, with a clean viewing layout and complete information regarding current, pending, and fulfilled supply requests.

admin dash

Chapter Dashboard

In order to make new chapter accounts, the admin will need to log in, click on the “+ Add New” button on the right side of the screen, and enter the necessary details for the new chapter user. The Chapter Dashboard allows chapters to easily view the recipients included in the chapter and the status of supply requests, and update, edit, or delete current supply requests


Recipient Dashboard

In order to make new recipient accounts, the respective chapter leader for this new recipient will need to log in, click on the “+” button on the left side of the screen, and enter the necessary details for the new recipient user. The Recipient Dashboard allows recipients to easily create, view, edit, update, and remove their supply requests.

Recipient - Portal