C-U Strings (A hackathon story)

About

In 2016, I participated in an event called "HackCulture". Basically, it was a Hackathon wherein we had to build an application for the Champaign-Urbana Community. This was a great experience for me. I worked in a team of four people and I was the designated "UX Designer" of the team. We did not win the Hackathon but we built an application we were proud of. We called it C-U Strings. Unfortunately, I cannot provide the live version of this website due to copyright issues but I do have some screenshots to show for it. 

Languages and Libraries Used: Jade, Json, JQuery, HTML, CSS, Node.js, Python 

Inspiration

The idea stemmed out of a bad experience one of my classmates had during the Mid Term work. He was an international student who was feeling overwhelmed with the stress of exams and was feeling homesick. He tried calling the counseling center but they were not very helpful and could not really connect with him properly.

So, the problem was very clear to us. We had to build something that could connect people who were going through an emotion and wanted an outlet or just wanted to talk to someone anonymously within the Champaign-Urbana(CU) community. 

Ideation

We felt that the best way to connect people with each other would be via social media. Security was a prime concern for us, so we decided to keep the connection anonymous. Also, we wanted people to chat with others or read messages by other people who were going through a similar emotion. For this, we also gave the option of an anonymous chat and message boards. Along with that, for people feeling depressed or other negative emotions, we also added the option of talking with a counselor or a professional. 

The main objective of this website was to tell people that they are not the only one feeling lonely or sad. Similarly, they are also not the only people feeling happy or excited. There are others in the community who are feeling the same. So, we used Crimson Hexagon to create infographics of people tweeting about a similar emotion. 

Mockup for the final site 

Mockup for the final site 

The display page for a sample emotion

The display page for a sample emotion

I designed the above two mockups for the website. I wanted to keep the design simple and crisp, so this looked like the best possible version. Since, we had very limited time, I could not perfect my designs or do anything wild with it but this seemed reasonable to me. 

Implementation

Home page

Home page

A sample of what happens when someone enters happy 

A sample of what happens when someone enters happy 

The final product that we came up with looked something like above. This website also contains a chat feature and people are directed to the resources according to the emotion entered. 

Interesting Experience

Working on this project was a lot of fun as I was working in a team with people from various backgrounds like Library Science, Economics, and Philosophy. Learning about their perspectives and thinking methodology made this experience worthwhile.