ReForum

Inspiration

Icon. That's what we believe when we think about Greta Thunberg. She's an environmental activist our age, who inspires us as she fights for what she believes in -- what we believe in -- saving the earth.

Since she is one of the most influential people to our generation, we wanted to create a product with Gen-Z and Millenials, in mind, as our target market.

They're the most likely to use online communities and value sustainability but lack practical knowledge on how to save the earth.

So how do we help educate these generations? We decided that crowdsourcing was our solution. People coming together to learn.

And thus, ReForum was born. "Re" represents the 5 R's of sustainability: Refuse, Reduce, Reuse, Repurpose, Recycle. In addition, ReForum is a pun on reform because our goal is to better the earth.

What it does

We connect, crowdsource, and promote a sustainable future through our community forum and latest research.

Our website facilitates a place where users interact with one another to learn about practical steps to promote sustainability. The forum allows for high and low involvement. High involvement is when a user comments to answer questions while low involvement can be simply voting on polls.

We take advantage of crowdsourcing - a way to obtain information through the internet.

Because we rely on users for information, we keep them accountable through reputation points. Each like and dislike on a comment corresponds to a point.

Our leaderboard publicly shows each user's reputation. This further incentivizes users to spread accurate and helpful information to demonstrate their trustworthiness.

Lastly, we have an informational page displaying our research. It currently shows different recycling symbols, what they mean, and their disposal methods. In the future, we will continue to add more certified research and informational resources.

How we built it

Process: We looked into different online forums for inspiration and decided what features were absolutely necessary. Team members skilled in Javascript created a page where all of the threads were listed and new threads, with polls and images, could be created. In each thread page, we added a comment section and a like/dislike feature.

Meanwhile, team members skilled in user interface built our home, info, and leaderboard pages in Figma. For the leaderboard, the Javascript team members displayed each user's reputation, calculated by the net number of each user's likes (+1 rep) and dislikes (-1 rep).

Technical Details: Our site uses HTML, CSS, and JavaScript. It is hosted as a project site on Github Pages. Some of the pages used Figma - a scaffolding tool - for the user interface.

Challenges we ran into

When we used Figma, it scaled the page elements in pixels, so the pages only fit one team member's screen. When we imported this page to other IDEs in order to add Javascript, the page was not to scale. We had to edit many of the page elements so that the scaling was based off of percent of screen real-estate instead of arbitrary pixels.

Another challenge is that ur website is entirely front-end and does not have a back-end, so the JavaScript team members faced many challenges recreating back-end functions. For example, we do not have a database to keep track of users, their login information, their threads/comments, and their reputation points. Instead, the JavaScript members innovatively created a work around by using localStorage variables.

Accomplishments that we're proud of

The JavaScript team members are very proud of our innovative work arounds to not using a back end. We were able to save usernames and display those same usernames when those users added comments, even without a back-end data store. We were also able to dynamically create new threads and comments by inserting HTML for each new thread or comment.

Overall, the team is proud of our rapid improvement in web development as we tackled this hackathon. We were all inexperienced in web development and had to enter a completely new territory, but are pleased with our progress.

What we learned

The JavaScript team members learned how to debug code through inspecting websites. We also learned how to use localStorage variables, how to insert HTML dynamically, and JSON.

Overall, the team learned several marketing concepts as we researched taglines from companies like Facebook, Instagram, and Reddit to come up with our tagline. The team also became more familiar with web development in general.

What's next for ReForum

Right now, it's established largely for recycling - in fact, the default voting option is "Is it recyclable?". In the future, we want to focus on the other 4 R's of sustainability. We want to make it like the ancient Greek agoras - a marketplace where people can sell or trade items. For example, if someone no longer has a use for something, someone else can take it and repurpose it. The community can also work together to change laws and regulations to protect the environment, such as lobbying the FDA to ban certain harmful gases and emissions. They can band together to change shopping behavior and refuse certain unsustainable products.

If this project were to continue, we would also create a backend. This would serve to store user's account information, reputation, and more. It would also be more secure than saving information in localStorage variables. Additionally, it could be used to dynamically create threads and add comments instead of JavaScript.

Built With

• css
• figma
• github
• html
• javascript
• json
• w3