Scarlet Seconds

"Scarlet Seconds: Taste the Future! Supporting Rutgers' Climate Action Plan by rescuing leftovers. Join us in feeding minds, not bins!"

Comment

How we built it

Step 1: Define. We first defined our problem as stated in the inspiration and understood how our project could help students like us in our everyday campus life. Step 2: Ask. Then we asked what could be improved in this issue, how could we prevent food wastage and what is the correct way of doing this so that students can both look for food and help sustainability. Step 3: Imagine. We then imagined the process of solving this problem. We realized that organizations almost always cater and so this information could be made public so that people attend meetings and the club doesn’t have to throw food away. Step 4: Plan. Then we planned a website that could help students find these organizations and directly shop from them for leftovers, just like an online ordering system. We then decided on the logo of our website, a Scarlet Knight eating a slice of pizza, just like all Rutgers students. Then we decided on the color scheme and the layout of the website so that it looks easy to use as well as have some sort of functionality that we can code within 24 hours as beginners. Step 5: Prototype. Then we started the cycle of coding and debugging. As new users of web and app development, we ultimately came up with using React JS as our platform for website development.We used React JS and Vite. We then had to first teach ourselves how to use React and how we could even set up a website that we could code. We followed online tutorials for setting up our website and used resources such as YouTube and other blog posts to fix our errors. We soon learned to create assets with a folder of our images, a jsx asset file with our imports and exports of other tabs and menu items. Then we created our components, the organizations section, the shopping cart section, the ideas section, the header, the navigation bar, and the footer. After creating the jsx files for each, we edited through CSS files and adjusted for our aesthetics. After this, we linked our navbar to the contents, added links to some of our images, and created the add and subtract button for the organization leftovers. We even added ratings, cuisine type, location and time, as well as the logos for the current organizations. All of this was done through a very long process of debugging as this was our first time creating a website and even coding a working website in general. Each step was a success for us when we saw it work! Step 6: Test As mentioned before, we went through lots of debugging, talking with mentors, re-running, and re-designing our website. Step 7: Improve. We made lots of improvements through our debugging however we plan to continue to improve with future ideas that will be mentioned later.

Challenges we ran into

The biggest challenge we went through was creating our website from scratch and seeing something on the screen. As mentioned before, we had to debug from the very beginning and create something we had never tried before. We had a hard time also trying to figure out how to work an app, this took a long time as we were trying to get an app in instead of a website, however, react native didn’t work for us, so we decided to create a website instead. We learned that even though it was a change in our plan, it is easier to direct Rutgers-related content through a website and a lot of Rutgers’ resources are on web pages. Another challenge we ran into was trying to learn how import and export assets worked. All of these terms and processes were new to us, including CSS and javascript. Hence, we had to debug and understand where the problems occurred and change the root issues. However, at the end of the day, we were able to create a website from scratch, hand-coded, and were able to learn how a website works and is made step-by-step.

Accomplishments that we're proud of

Developing Scarlet Seconds, we successfully established a platform that addresses two critical issues: late-night food availability for Rutgers students living on campus and food waste reduction through sustainability initiatives. By connecting students with organizations and restaurants offering leftover food at discounted prices or for free, the platform promotes sustainability while meeting the needs of the student community. In addition to this, Scarlet Seconds has a user-friendly interface with intuitive navigation features, including tabs for easy access to information about available food options, ratings, cuisine types, and event details and a cart feature for selecting and organizing meals enhancing user experience, making it convenient for students to browse and select their preferred food options. The website also offers resources for users to make the most out of their leftovers at home.

What we learned

Through the process of designing and refining features such as the navigation interface, cart functionality, and recipe generator, we gained insights into the importance of flexibility and responsiveness to user needs. The process of implementing features like sign-in, search, and cart functionality presented technical challenges that required problem-solving and adaptation. During that, we learned to overcome these challenges while maintaining the integrity and usability of the platform providing valuable technical skills and insights. We also learned that incentivizing user engagement through features like ratings, reviews, and personalized recommendations can contribute to long-term user retention and platform sustainability.

What's next for Scarlet Seconds

Scarlet Seconds is the future of Rutgers’s climate action plan. The future ideas for this include fixing the functionality of some of the buttons on the website, for example, we are in the process of creating the pages for the cart, order placement, and sign-in page. Speaking of sign-in, the future of Scarlet Seconds is to have an organization log-in where these clubs can add when they have leftovers and send alerts to users. Customers sign-in would be able to shop from the website and add to the cart. We would also want to partner with Rutgers and New Brunswick restaurants to engage in these live alerts for leftovers. The future is to add more features as well as create a partnership with local small businesses as well so that we can all fight climate change and create more food options for students on campus.

Built With

Share this project:

Updates