As I mentioned earlier, for the Live Web final I was working on the interactive ITP yearbook. I wanted it to be a separately running website, which would be meant for ITP community only.
Since the school year is going to the end, people get more emotional about leaving, new people coming, you know the thing. So the interactive yearbook could be one of the tools to remember people. And in a bit more interesting way than usual school yearbooks:
The page is running here: https://rk2906.itp.io:8087/
It’s a mini website that I built using websockets and Express. When people enter the page, they can choose to either view existing yearbooks or submit their own image.
The way it’s different from other yearbooks is that instead of uploading photographs, people can record their own video, which is later placed together with other people’s videos.
Before clicking “record”, users are asked to enter their full name and their superpower (to make things a bit more interesting). When they hit “record”, the timer shows up and people have 4 seconds to move for their video.
The video is being saved in the database on a server with the title of entered full name and then displayed on a new page.
The plan for the job was the following:
- make the code work on a separate page
- merge everything with Express
- do some styling
Some of the things I coded / used:
Media recorder to enable the recording, as well as Timer function
Filesystem and nedb for saving videos
Sockets to enable everything
Express to build actual website
Regular expressions to remove spaces in full name
At the moment the page is functional for Live Web class only, but soon users will be able to select between ITP graduating years of 2016 and 2017 and leave their videos.