Combining the collective minds of some very talented and enthusiastic individuals with a fascination for avocados and mochi ice cream, TCL-22 set out on a quest to create a fun and engaging shopping list app, aptly titled AvoCart!

Built with React, Material UI, Styled Components, and Firebase, AvoCart was an effective use case for both the team to understand how effective communication can create less friction and allow for more creativity and a greater developer experience in group projects.

How does it work?

As a user, you will enter items (e.g., “Greek yogurt” or “Paper towels”) into your list. Each time you buy the item, you mark it as purchased in the list. Over time, the app comes to understand the intervals at which you buy different items. If an item is likely to be due to be bought soon, it rises to the top of the shopping list.

Highlights

The team clicked right from the beginning with fun pairings like team Baltimore and team Canada. Everyone worked collaboratively and effectively throughout the entire project. Some of the highlights from working together on this project include:

• The team was able to implement and learn new packages very quickly, such as Notistack, Material UI, and Styled Components, and everyone was open to learning new tools.
• Everyone was very proactive and did not need a lot of direction from the mentors when it came to pairing up and communicating with each other. They began discussing UI in a thread before any of the mentors really knew!
• All team members provided constructive feedback in a respectful manner.
• The growth on the team was amazing. Kudos to Abbey, Karan and Caitlin for each securing jobs during the experience!
• Daria’s curiosity and ability to explain difficult concepts was incredibly helpful, especially with out-of-scope topics such as the pre-built token generator. She does a great job of digging deep into the technical details.
• Everyone on the team was positive and enthusiastic about creating software that was fun to use, and everyone agreed on the avocado theme.
• The team created a Figma board to track moodboard inspiration, and build designs for the avocart site. The designs included both mobile and desktop. Both Figma, and responsive design was something that the team learned by themselves.

You can watch the demo of the project below, and also visit AvoCart through the hosted application on Firebase or at our Github repo!

The Design

Our team built out the design prototypes in Figma before developing the UI, and it was a great experience for collaborating and whiteboarding UX and design ideas for the project! Feel free to take a look at our Figma board or preview the images below!

Authors

• Daria Tsvetkova
• Karan Katoch
• Abby Benjamin
• Caitlin Floyd

Advisors

• Lauren Beatty
• Jonathan Yeong
• Luis Augusto