yalbert-telematic

Instructions: Click on the screen to build a creature that eats the dot. Work with your opponent, who has a different dot but is controlling the same creature.

Source

Summary: An interactive game in which players are forced to work together to reach their goals.

Within my game, players must try to eat the dots placed around the canvas. While each players' dots are in different locations, they are all navigating using the same springular blob. Therefore, they have to work together to ensure everyone eats their dots. This project was an extension of past spring explorations that I've done. I really like the interactive twist though because it forces a sort of collaboration that people aren't always used to. Even though everyone has separate goals, they have to work together to collectively reach them. Based on the nature of the game, it is best played when the two players on are in the same room. If this isn't possible, the game could also be played with players talking on the phone or texting one another.

chromsan-telematic


Add a whisper of text and try to interpret everyone else's whispers as each changes little by little.

 

In short, this is the game of telephone for random people on the internet with text instead of audio.

I wanted to implement this game (sometimes called "Chinese whispers," evidently) with text instead of voice while preserving the same quality of randomness that it has. I initially thought about using a reCAPTCHA style system to mess up the text, but that would have been too easy to read. Messing with the unicode made it much more difficult to read the messages, and I found a nice library for doing that. What's interesting about the game telephone is that everyone has an important role in playing since they each pass the message along, but all the players are equal in the sense that everyone's job is the same, except for one. In the original game, the person that starts the message is somewhat more important, but I got rid of this dynamic by having each visitor enter their own message, which is then interpreted by the other visitors.  In my version, all the players have the same role.

I had the idea to keep the messages so that the next visitor could add to the chain of whispers, which Glitch didn't seem to easily be able to do. I then decided to make my life much more difficult by shifting over to python and making a backend with Django, which I then put on Heroku, which was probably really unnecessary especially for this one feature. However, now the whispers that are added are persistent, so anyone can add to each of the chains and the initial phrases can keep morphing- they don't disappear when no one is online.

Direct link to project.

Initial ideas about messing up the text

Project's code can be found on GitHub.

 

weirdie-telematic

Rain Ghosts

Interactive: Hover and move your mouse around the screen in the rain.

This is as a simple interactive environment based on the idea of being together with someone even though you cannot see them. 

 

Below is a GIF of 2 people interacting with it.

 

The project is a rainy forest in which the only indication that anyone else is there with you is where the rain is falling. If there is a gap, there must be another person present. After testing it out with a few friends, it has become apparent that not only is this something you must be looking and waiting for, but that you may find yourself seeing gaps or "ghosts" that aren't really there. It attempts to combine anonymity and intimacy through the concept of simply being there with another person. You may or may not know who they are, but you share a space and environment that reacts to you together regardless of how far apart you actually are.

Originally, I had many grand ideas for this project. Perhaps a collaborative garden where individuals planted trees and helped care for other peoples' saplings, or a drawing program where individuals had different "parts" - branches, leaves, and flowers.

In the end, this is what I had time for, and while it is simple, I think it has potential. I would like to expand this first to have the drops impact and make small splashes on the ground and on the tops of the entities in the environment, and to create leaves on the bushes that would react to being "brushed past".

 

Rain code derived from: http://thecodingtrain.com/CodingChallenges/004-purplerain.html

Interactivity based on Shar Stiles' drawing program: https://glitch.com/~cmuems-drawing-game

nixel-telematic

Embedded app:

Direct Link:

Custom Emoji Creator

How to interact:

Simply click on the small icons to customize the big one. There are 4 clear categories: eyebrows, eyes, mouth, and accessories. There can ever only be one (or none) of each type on the big emoji at once. Click the X if you ever want to clear that feature. You can interact with many people at once who are on their own browsers.

Description:

Sometimes you want to express an emotion that the current range of emoji's just don't cover. That was the purpose of this project. I took inspiration from iconic internet created emoji's like: Image result and wondered how many other emotions we feel but aren't able to express.

Gif of me playing with it along with a few friends:

My process:

For this project, I essentially mashed together two of the given prompts for when we're 'stuck for ideas': making a space where people can only interact with emoji's, and having the participants construct a monster corpse through body parts. And this is what I ended up with.

My process was pretty straightforward. I looked for existing dress up games on glitch to reference from, and found this one for cats and based the majority of my structure off of it. I spent a long time cutting apart emojis, formatting HTML, CSS, and messing with jQuery, all of which I'd never worked with before. I hit some pretty dumb bugs that I fought with for a long time (for example, not realizing I didn't import jQuery). I struggled a little with understanding the client-server stuff in application to my own project, but it was a lot simpler than it looked once I broke down the pathways.

Here are some notes I took on the given templates:

I made remixes of all of the templates and took notes on how each one worked with socket.io. This is how I brainstormed to apply it to my program:

I think a part of this project is that I want it to be kind of chaotic and unpredictable. I want multiple people to be able to explore the different options available and experiment. By having many people on at once, everyone with equal roles, it allows for lots of surprises. It is also good as a solo experience. I think of the multi-user interaction as a feature and not a defining point.

I shared it with my friends, and they had a lot of fun with it. At most, I think there were around 6 people messing with it at once, and everyone was amused at the results we were getting.

By the end of this project, I'd learned a lot about HTML, CSS, jQuery, socket.io, and glitch, and made something that made my friends laugh, so  it is pretty successful by my standards.

breep-telematic

Glitch App: Ensure Audio is on (Headphones are optimum for the notion of privacy) 

To log in:

  1. Do Not Click anywhere on the screen or press any keys
  2. Click on Username Input Box
  3. Enter Username
  4. Click on Password Input Box
  5. Enter Password
  6. Press Enter, and you should enter into the chatroom
  7. If nothing happens, refresh the page and try again

Documentation:

All messages received are spoken out to the user with p5.js Speech, and the only hallmark of them within the chat is 'Received Message'. However all text sent to the chat is posted on twitter with the username associated as well as the text and a hashtag. There is no evidence on the group chat of this occurring though, so the allure of privacy is maintained.

Twitter Page

I would like to view this project as a public private chat. I learnt a-lot about TwitterBots in the process of making this piece, as well as html and the connection between servers and clients. I struggled a-lot with implementing libraries initially, with my understanding of where the code should fit into the glitch page. I am happy with the text part of the project, but I feel that more work on the speech element of it would aid in making it seem more polished. I would also dedicate more time to make the chatroom itself more conducive to the audio formatting.

I feel the piece is many to many, given that the population of the chatroom speaks to the population of twitter. It is asynchronous given the disjunction inherent within communication. Everyone has equal roles, there is no special communicator within the chat room. I feel the piece is both anonymous and intimate, given the lack of awareness of the public aspect of it. It is remote collaboration, given that those in chat room would communicate across distance as well as the content on the twitterpage reaching a wider audience. I feel the work is self-reflexive and critical of networked environments, highlighting the faith in privacy on the internet despite the public connections that those stem on.

 

dinkolas-telematic

Control your line segment by moving your mouse in the bottom left, collaborate with other line segments, avoid obstacles and get the gold!

App
GIF

Each player is a single line segment, which changes size and rotation based on the location of the mouse or finger. Everyone shares the same goal, but plays a slightly different role in achieving it. As the end segment, your job is often to shrink so as to give the other players room to move, and then finish off the task to get the gold. As the base, you carry a lot of responsibility, and can mess everyone up at any moment. Thus, the roles are subtly complementary. The gameplay is highly synchronous, with time coordination required for many of the obstacles. Despite this, it really doesn't matter if players share a physical space or not. It was fun, however, to have everyone looking at the same computer screen while playing with their fingers on their phones. There is no real critique of the medium, ideally the medium is ignored.

harsh-telematic

 

link

This interactive environment is called "Bird-Do-Or-Die" where users compete or collaborate to either save or kill the bird(s). This is best played over a period of time. People should use their asynchronous free time to either protect or kill the bird - competing against other users over longer durations.

The network model here is ideally a many-to-many setup - where people form teams to work on saving/and or killing the bird over time. This also makes the system asynchronous - where people can work on increasing the bridge blocks over time, which then others must overcome to kill the bird. The roles are essentially oppositional - where people work to defeat the other's work.