SparkPositivity Website

Inspiration

On the first day of the hackathon, we formed a team freshman and sophomores who had no experience in making a full blown project. It was our very first hackathon ever, but we were extremely ambitious. We wanted to make a strong impact with the small set of skills we have and brainstormed hard on an idea. Our idea for a project with the theme "community" is simple yet very impactful. We wanted to spread positivity throughout the community and to create a sense of unity and warmness. We wanted to capture the spirit that even though you can be inexperienced in creating something, you can still make a big impact, no matter how simple or small your project or idea can be. Our project also took inspiration from the UIC Library where sometimes you are able to add post it notes to a wall with questions such as "How was your semester" and it felt like a great way to engage with the community. That is why our project looks like post-it notes on a wall.

What it does

Our SparkPositivity is a website where people can read positive and kind messages from anonymous people (mainly people who attended the hackathon). Users can also have the option to post their own positive message on the website so others can see too.

How we built it

We used CSS, Javascript, and HTML to make the website. We also used InfinityFree to host the website for free.

Challenges we ran into

We really wanted to have a website that can be accessed by everyone so we needed to host a website. However, having a domain and hosting a website costs money and we didn't have resources to host one. However we were able to overcome that issue by finding a website called InfinityFree where you are able to host websites for free. Another challenge is the "like button". We wanted to implement the like button in our toolbar and allows users to click on the heart, which turns the heart from white to red. We figured out pretty quickly how to get the heart in the toolbox, however, changing the color on click was giving us some major issues. We eventually realized a potential solution, which did allow users to toggle between the red and white heart that we were wanting. The issue with this is that the note started off already liked. We wanted the heart to be white, since the user hasn't liked it yet, but our heart started off red, meaning that it was already liked. We found a solution after some time and eventually got the heart working just the way we wanted it to.

Accomplishments that we're proud of

We are proud of creating a website from scratch that looks pleasing to the eye and has user functionality. We are also proud of learning out how to host and even host the website we worked on so that everyone can use.

What we learned

We learned how to make a website from scratch using HTML, CSS, and JAVASCRIPT. We learned how to better style our website so that it can be pleasing to look at. We also learned how hosting a website works. Most importantly, we learned how to work as a team and using Github.

What's next for SparkPositivity Website

We want to add a filter in the future so that potentially harmful messages would not end up on the message board. Harmful messages will just be auto replaced with automatically generated positive messages. We can accomplish this by Sentiment Analysis, which is machine learning. We would also want to add more animations and make the website even more pleasing and satisfying to use. We would also want to add a feature where people on the website can meet each other and able to share socials. We also want to add dynamic features because as of now, the messages a user posts won't be updated on the website for others.

Built With

• css
• hosting
• html
• javascript
• website