playhtml --- interactive, collaborative html elements (multiplayer websites!)

[loren]

i've been getting more and more interested in making multiplayer websites, but a big hurdle for me is understanding how any of the actual multiplayer parts work, like how the data is stored and transferred between players. i think websockets are (sometimes?) involved but every "beginner" guide i read assumes that i have way more knowledge than i do, so i never end up learning much... anyway! i found out about another way to add simple multiplayer elements to a site, without having to figure out out all the technical details myself.

playhtml 

playhtml aims to provides infrastructure for designing communal experiences that make the web feel alive. From shared fingerprints on a letter to live reactions to live confetti with every click, I think we can reimagine the shape of websites and how we can interact with each other on them. I hope this becomes a foundation for making diverse open forms of "social media."

Most of the elements on this page are live examples! Trying clicking, dragging, and playing around with them. If anyone else is on the site, you'll see their cursors and how they're playing with the elements too.

to use it, you just have to add some extra attributes to the elements that you want to be interactive, and include a script at the end of the page. it handles all of the backend stuff! some of the examples are a draggable fridge poetry page and one where visitors can add stripes of color to the background.

what do you think? i'm not sure what i'd like to do with it yet, but i'm excited to play around!

[Melooon]

I had a nice call with Spencer a few months ago to discuss the relationship of web infrastructure and art  A bit of an aside, but its quite shocking when you realise then entire scene of people making cool projects like this prob could not fill a restaurant.

Anyway, I have opinions about this topic since I've worked on similar projects too and I've run into a lot of the key questions that this project also faces.. mainly.. once you overcome the bounds of being able to create multiplayer interactions, your suddenly faced with the daunting reality that we don't have any mental constructs or clear ideas about what multiplayer interactions in a web space should actually be.

What does it mean to be multiplayer? Is movement alone a multiplayer experience? Is seeing someone's mouse like seeing into their brain? If you see the reactions of another persons actions, but you don't know, or see the person - what is that experience? Is it a haunting? Is it like plato's shadow experience of the world? Are we like alternate laws of physics colliding with each other? Or is it something else entirely?

Thats all quite deep for a fun html toy I know; but the thing is that it needs to be; interaction is powerful and its effect on people should not be underestimated. I would like to find answers to these questions!

[MediocreMetastasis]

That's pretty cool. Allowing to change a variable globally without having to create a backend database makes it very beginner friendly allows you to learn how to transfer dynamic data between clients.
If your site runs on Node.js. Maybe you can implement it into the everyone site @Melooon .

[loren]

Thats all quite deep for a fun html toy I know; but the thing is that it needs to be; interaction is powerful

thank you for your questions! i don't think they're too deep for the topic; they really get at the heart of something that i'm thinking about, but maybe only hinted at in my post. now that i have access to a tool that gets me over my big technical hurdle, what should i do with it?

the idea of letting visitors arrange things on a page together is exciting to me, but what combination of things can i offer them that would feel meaningful? let's say i let everyone rearrange the images on my homepage. right now, things are tidy, with images carefully placed on the desk and on bookshelves. i can only really imagine two things happening: visitors scattering the images to make a "mess" and others (maybe even me) putting them back in place to tidy it up again. there is some tension between the two states, but is that tension interesting? in both cases, it feels more like a way for the visitor to interact with me and my ideal vision of the page, instead of a way to interact with each other. maybe it would be very satisfying for someone who is angry with me to "throw" my digital belongings (do they belong to me? another question) on the floor, but i don't think that's something i'd like to encourage.

to make a page where people are truly interacting with each other and not just with me, i think i'd need to give them enough options to combine things in ways i couldn't predict, which is sort of scary! the fridge poetry example lets visitors add their own words, so they have the freedom to create all sorts of meanings with it. but i do worry about the possibility of someone adding something cruel! if i had a page like that on my site, i think i would be constantly watching it to make sure i removed anything mean before anyone else saw it. i probably worry too much though! the fridge poetry page also gives every visitor the power to delete things, so maybe it all sorts itself out into a pleasant experience without too much top-down moderation... hmmm...

Is seeing someone's mouse like seeing into their brain?

does your sense of personal space include your cursor? i think mine does — i don't feel that my cursor represents my brain exactly, but i do feel like it's part of me. because of the pointer and grabber icons, maybe my cursor is something like my hand? if i wiggle my cursor near someone else's, am i waving hello to them? if our cursors touch, is it like shaking hands? holding hands?

most of my experience with multiplayer cursors was on the nekoweb homepage when it was very new. there was a lot of activity at the beginning, so it felt like a party! lots of cursors darting across the screen. sometimes people would circle their cursors around each other, and this felt like a little dance to me. i think you could hover over someone's cursor to see their username, but i didn't recognize anyone, so it was like a big semi-anonymous dancefloor. shortly after that, a chat system got added to the cursors, and it stopped being fun for me almost immediately. more than once, another cursor would follow mine around, asking me who i was, confusing me with other people, and making demands of me. i went from feeling like part of the crowd enjoying a shared experience, to a lone individual that could be watched and followed. it made me uncomfortable enough that i stopped logging into nekoweb. i think you can turn the feature off, and there's less homepage traffic now, so the chance of that happening again is basically zero, but the experience still colors my memory of the site.

If you see the reactions of another persons actions, but you don't know, or see the person - what is that experience?

i'm not sure! in a 3D multiplayer world with avatars, we can make our avatars face each other. on my screen, i'd be looking at "you", and on yours, you'd be looking at "me". we can acknowledge each other in a way that mimics being in a room with each other offline. what we have here is an entirely different thing. instead of looking at each other, we're looking at a shared third thing. is it like going out to see a movie? everyone in the theater has most of their focus directed at what's being shown on the screen, but they're still aware of the people sitting near them (especially when they laugh or clap or eat popcorn very loud). even though audience members can't change the movie itself, they can change the experience of watching it for everyone else in the room.

If your site runs on Node.js. Maybe you can implement it into the everyone site

i feel like the everyone site already offers a similar multiplayer experience. if i wanted to move an image or add a color to a page someone else made, there's nothing stopping me! i could go to the source code and change it for everyone instantly. there's no synced cursors on any pages i know of, but there's a menu button (the supervillain emoji in the upper right) on the etherpad docs that shows who else is online editing the same page.
though if you wanted to add playhtml to an everyone site page, you just have to link the script. (no node.js required?) i just made a test page and it works!

[Melooon]

my digital belongings (do they belong to me? another question) on the floor, but i don't think that's something i'd like to encourage

This one of the challenges! In most cases a personal site is a private experience; letting someone into your site is like letting them stay over in your bedroom while you're away - you try to leave it neat for them and you know they will inspect what they see, but you also know they will focus on things they find interesting and they will prob walk away from it with a different understanding of you. Its about you and them.

It's different public space, and it would be very unwelcome if strangers started walking into your friend's room and moving things around while you were supposed to be staying there! Thats different from a city street where you expect strangers to be moving around and where its quite uncanny if you see no one there (thats why people get stressed when they think our Minecraft server is inactive - they expect a public space).

Likewise, we don't expect to have to moderate our bedroom very often; but we do expect a public street to be moderated (both by social conventions and police). It's very unwelcome when the police come into your bedroom uninvited though

if our cursors touch, is it like shaking hands? holding hands?

we can make our avatars face each other

I think for me it's a lot like holding hands, and having someones cursor too close to mine is a lot like a stranger trying to hold my hand. That's the old issue of embodiment; humans require our interactions with a world to be filtered through a form we can embody and perceive as ourselves - most people get very uncomfortable if you remove their body

i just made a test page and it works

That works super well! The everyone site might actually be a very appropriate space for multiplayer features because its already a public space, there's no conflict between creator and visitor and its already mostly moderated

ANYWAY:
All of that leads me to say that to do this right I think we might need a few basics:

• We need some sort of understood form of embodiment
• We need some sort of flow control to define personal spaces within public spaces
• We need public spaces to retain a story and a soul through their interactions
• We need to do those things without just recreating video games

I also think that mentioning https://wplace.live is relevant here since in some ways to does accomplish flow control and personal space (you embody your drawing) - I like how it adds a lot of depth by layering reality and a digital world - but I also find it overwhelming and loud, there are too many voices there all shouting - I think that issue of size is important too!