Week 6: Midterm

screenshot-2016-10-18-10-47-40 screenshot-2016-10-18-10-51-24 screenshot-2016-10-18-10-18-46

My Live Web Midterm took me on quite on journey. I had a vision that I wanted to create a chat where you can’t see yourself except when you send a message.

Where this idea stemmed from:

When I video chat with people I typically use FaceTime. I have noticed that when I am chatting, the majority of the time, I am just looking at myself. This tends to be a bit distracting as I’m paying more attention to how I look when I speak instead of listening and speakingĀ in a meaningful way. Conversely, when I am not paying attention to how I look and am more engaged in the conversation, I occasionally notice how incredibly silly I look when I am active listening.

Basic concept:

The default interface will be very plain and the user will be prompted to send a message. When a message is sent a picture is taken and displayed on the screen with the text message.

My first task was to get the general video chat working. It took some time, but I was able to get the chat to work with multiple users. I also used Bootstrap to help with the styling, and ideally put the videos in a grid to be nicely displayed on the screen.

Test with 1 chatter:



Test with multiple users:

I sent out texts to a bunch of people both in the States and outside. I just said if you are on a computer, please go to this URL. And with that we had a little chat working.



What I would want to improve is the placement of the messages coming in and where the videos go.

I put this to the side and then started to work on my other idea. I got everything set up but then starting running into problems.



I asked one of my friends who is backend developer to look at my code and see what the issue is. And alas! It was that I was missing the Image and Text HTML tags. Now it’s at a point where it’s taking awkward photos, below is showing one of the first while I was testing.