Het Eiland: an internal communication tool for Eiland Gasten

Context

Create a platform that improves the internal communication of Eiland Gasten, based on the problems caused by the current communication platform: Facebook Groups. Use a NodeJS stack and the VueJS framework for the final product.

Keywords

Interaction Design, Visual Design, Front-end Development, Back-end Development, VueJS, NodeJS, Express, Socket.io, Google Drive API, MongoDB

Idea

In an effort to improve communication I came up with the idea to build a self-hosted platform that works with the same priciples of a Facebook group, but uses multiple timelines to order the posts. Since the collective focusses on organizing events, they should be able to create a virtual event space where the timelines could live. In this way, every event could be discussed on its own and every subject in the discussion could have its own timeline.

The creation of a self-hosted customized web application also opens a door to improvements like planning/agenda and financial documentation.

Current situation

Eiland Gasten is a creative collective of 13 people who collaborate without any form of hierarchy. Their main occupation is the organization of different types of events. They use a secret Facebook group to communicate about all the things they’re working on. This works pretty well when there is only one thing to talk about, but tends to get chaotic when there are multiple subjects to discuss.

Because a facebook group revolves around a single timeline of posts, it’s easy to overlook conversations and important announcements. Post that were submitted in the morning can get snowed under with other posts during the day. This structure makes it hard to find things back and communicate clearly.

Event overview

The event overview is the homepage of the application and show upcoming events as well as past events. Each event is represented by a name, date and location and has a notification indicator showing the amount of active notifications.

Every user has the permission to create a new event using the “Create event” button. The user fills in the name and location of the event and picks a date using a datepicker. After creating the event, all other users get a real-time notification.

Subjects

Every event is split into multiple subjects for tranparent and clear communication. Several subjects like Poster and Line-up are automatically generated when an event is created. It’s also possible for users to add subjects manually.

Posts

Every subject is discussed using posts. Posts are named using a title and can contain text, images and polls. In order to start a conversation, users can leave comments about a post’s content.

Poll

Poll image

Image Detail

Modal image

Development

Het Eiland was a way for me to learn NodeJS and VueJS. Setting up a web-application using Node, Express and MongoDB was a fun and insightfull challenge. In the start phase of the project I decided to use Socket.io for realtime notifications, posts and comments. I also figured it would be a good idea to store all the images in one cetral place, so I used the Google Drive API for node with node to store everything on Google Drive. The users log in using their facebook account, so that there is no hassle with account setup.

view the code