Vission.io

Vission.io

Vission.io is a social networking site that uses a graphical display of nodes to show related and interlinked groups. A group of friends and I created it for the Cruzhacks 2018 Hackathon at UC Santa Cruz. Our initial idea was to create a hub where like minded creators could find others interested in the same topics and find other topics that link, or are related to the groups they are in.

Vission.io homepage The Vission.io homepage

The homepage looks like this, a collection of nodes related to music groups. Each branch represents a connection between the nodes, showing that they have been built off of each other. To create this node-like appearance, we used the SigmaJS library, along with ReactJS to build the rest of our front end. For the back end we used Firebase and Node.js.

Each node has a comment/chat box section, where creators can link up and think of new ideas together. For this project we were inspired by traditional forums such as Reddit, but we aimed to make it more focused on creative discourse rather than being a link aggregator.

Vission.io homepage Info page for the main music group

For our demo, we created a bunch of groups based off of some of our favorite artists, when selecting a node you can build off of one into another related topic by clicking the "build" button.

The comments section showcases a discussion between people in the group. This is where creators interested in the same topic can meet others and branch off into more specific groups.

While not a fully complete product, this project was really fun to create for a 36 hour hackathon, and I learned quite a bit about ReactJS and Firebase from it.