Aggie Reuse Radar

The inventory screen

Inspiration

Because the Aggie Reuse Store has been receiving more clothing items every quarter and their current way of recording data is by manually entering numbers into a spreadsheet is very tedious for the volunteers, we wanted to help increase the efficiency and reduce human error.

What it does

We created a streamlined interface and an organized database system to meet the Aggie Reuse Store's need for an inventory tracking system. Student's working at the store can use this to keep track of their inventory, see top products at their store, compare data analytics by day, week, month, and year, and also see how much pounds of waste was diverted.

How we built it

Our design process was split into three parts. We first created had an initial designing phase where we brainstormed ideas and sketched wireframes. After coming to a consensus on the designs we were going to implement, we went on to create lo-fi/mid-fi designs on Figma. Our lo-fi designs were built upon the wireframes by adding more visual details and context to better represent the project's user interface (UI) and interactions. Visually, we added basic colors and fonts so we would have a general idea for our final design. Finally, for hi-fi designs, we polished and refined our lofi’s and finalized our design system and interactive elements. After finishing up hi-fi’s we handed the designs to the developers to provide them with clear visual specifications and assets for implementation. On the development side, as the designers were working on the visual aspects of the project, we built a full-stack website using React, Express, Node, and MongoDB. We used Replit to host and run our frontend and backend separately.

Challenges we ran into

On the design side, it was challenging to come up with the features we wanted to have on our home page and choose the best way to visually design the different features in a coherent yet visually appealing way. For the inventory page, it was hard to design how to place the information especially when there is only two information needed. On the development side, we encountered challenges in implementing the UI components, and building an entire web design in under a short period of time.

Accomplishments that we're proud of

We were proud of coming up with a with a unique and innovative solution to upgrade the current inventory tracking system. For designs, we were able to create an intuitive, streamlined, and user-friendly interface that enhances the overall user experience. For development, we're proud of how the inventory table turned out, it looks really clean.

What we learned

For some of the members, it was our first time working in an interdisciplinary team so working cross functionally was a good learning experience.

What's next for Aggie Reuse Radar

We plan on:

Making it possible for users to also write/change the data using their keyboards.
Fixing up the UI such that it reflects the design better & user testing.
Fleshing out the data on the dashboard to reflect what the client wants.
Make the webpage responsive.