# I created multiplayer online game with p5js

**URL:** <https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854>\
**Category:** Gallery\
**Created:** [June 10, 2018, 8:10pm UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854 "2018-06-10T20:10:20Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![r4nd0m](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/r4nd0m/32/9477_2.png) [@r4nd0m](https://discourse.processing.org/u/r4nd0m)\
**Post date:** [June 10, 2018, 8:10pm UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/1 "2018-06-10T20:10:20Z")

</div>

Hi everyone, I would like to share with community the game I created with p5js as a renderer. It is a realtime multiplayer game, similar to AgarIO and other games in that ecosystem.

You can try it out on [http://owom.io](http://owom.io)

Feel free to ask any questions regarding tech, and any ideas on how the game might be improved are welcome!

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [June 11, 2018, 1:39am UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/2 "2018-06-11T01:39:31Z")

</div>

> **[r/processing - Owom.io - Realtime multiplayer game using p5js](https://www.reddit.com/r/processing/comments/8q4df1/owomio_realtime_multiplayer_game_using_p5js/)**
>
> 17 votes and 8 comments so far on Reddit

- [https://forum.processing.org/two/discussion/28050/i-created-multiplayer-online-game-with-p5js](https://forum.processing.org/two/discussion/28050/i-created-multiplayer-online-game-with-p5js)

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [June 12, 2018, 10:31pm UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/3 "2018-06-12T22:31:36Z")

</div>

Thanks for sharing this!

It might be helpful to distinguish between charged bombs and ready-to-drop bombs. Right now, the UI indicates when bombs are fully charged, but not whether or not you can drop one – if you already have one dropped, you can’t. The latest bomb could be highlighted only if another bomb is not already deployed.

Interesting decision to drop the bomb in front of the player movement direction, rather than on top of the player or behind. Is that copied from AgarIO?

---

<div class="post-metadata">

**Author:** ![r4nd0m](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/r4nd0m/32/9477_2.png) [@r4nd0m](https://discourse.processing.org/u/r4nd0m)\
**Post date:** [June 13, 2018, 6:30am UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/4 "2018-06-13T06:30:40Z")

</div>

Thank you for a great feedback!  
Yes, the bomb part is confusing, there should definitely be some more indication whether or not a bomb can be deployed.  
At first, I had a plan to let players deploy more than one bomb, somehow it complicated the logic and I decided not to include it in the first release.  
Honestly, dropping bomb is an unhappy result of a position interpolation on the client. On the server bomb is assigned a player’s current position, and on the client it is rendered on that position right away, but the players movement is gradually interpolated to that position. This is why you always see bomb in front.

---

<div class="post-metadata">

**Author:** ![r4nd0m](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/r4nd0m/32/9477_2.png) [@r4nd0m](https://discourse.processing.org/u/r4nd0m)\
**Post date:** [June 13, 2018, 4:59pm UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/5 "2018-06-13T16:59:58Z")

</div>

New Feature! - Bomb Radar

More on the offical game subreddit

> **[r/owomio - New Feature! - Bomb Radar](https://www.reddit.com/r/owomio/comments/8qu0hr/new_feature_bomb_radar/)**
>
> 2 votes and 0 comments so far on Reddit

---

<div class="post-metadata">

**Author:** ![Carmine](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/carmine/32/480_2.png) [@Carmine](https://discourse.processing.org/u/Carmine)\
**Post date:** [June 18, 2018, 6:53am UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/6 "2018-06-18T06:53:10Z")

</div>

What are you using for the server (software) backend? Did you build your own?

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [June 18, 2018, 3:15pm UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/7 "2018-06-18T15:15:37Z")

</div>

> [@r4nd0m](#):
>
> On the server bomb is assigned a player’s current position, and on the client it is rendered on that position right away, but the players movement is gradually interpolated to that position. This is why you always see bomb in front.

Interesting. One idea if you wanted to work around that appear-in-front behavior, I imagine you could have the server respond with the current location of the requested bomb, and the client display instead show the bomb appear being “carried” in top of the player (in motion, not dropped yet) until it reaches that server bomb position – then it is “dropped.” This would all be client-side display – from the server perspective, everything stays the same, with a bomb appearing at the player current position.

---

<div class="post-metadata">

**Author:** ![r4nd0m](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/r4nd0m/32/9477_2.png) [@r4nd0m](https://discourse.processing.org/u/r4nd0m)\
**Post date:** [June 18, 2018, 5:44pm UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/8 "2018-06-18T17:44:42Z")

</div>

Yes, that’s a good plan. I will take some time to fix this. Thanks once more!

---

<div class="post-metadata">

**Author:** ![r4nd0m](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/r4nd0m/32/9477_2.png) [@r4nd0m](https://discourse.processing.org/u/r4nd0m)\
**Post date:** [June 18, 2018, 5:46pm UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/9 "2018-06-18T17:46:59Z")

</div>

> [@Carmine](#):
>
> What are you using for the server (software) backend? Did you build your own?

Hi, I’m using nodejs on backend.

---

<div class="post-metadata">

**Author:** ![Carmine](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/carmine/32/480_2.png) [@Carmine](https://discourse.processing.org/u/Carmine)\
**Post date:** [June 18, 2018, 6:07pm UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/10 "2018-06-18T18:07:29Z")

</div>

Any chance you are open-sourcing the client and server?

---

<div class="post-metadata">

**Author:** ![r4nd0m](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/r4nd0m/32/9477_2.png) [@r4nd0m](https://discourse.processing.org/u/r4nd0m)\
**Post date:** [June 18, 2018, 7:44pm UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/11 "2018-06-18T19:44:43Z")

</div>

Yes, but not soon, since I’m quite busy with a few other things I’m working on. For client I’ve developed a small lightweight framework to boost development, which when ready will be released on github. As for the server, I can’t say.

---

<div class="post-metadata">

**Author:** ![kriz](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kriz/32/212_2.png) [@kriz](https://discourse.processing.org/u/kriz)\
**Post date:** [July 31, 2018, 11:40am UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/12 "2018-07-31T11:40:08Z")

</div>

Cool game !! Nice sharing here, looking forward to check out he code 🙂

---

<div class="post-metadata">

**Author:** ![gaocegege](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gaocegege/32/631_2.png) [@gaocegege](https://discourse.processing.org/u/gaocegege)\
**Post date:** [August 1, 2018, 3:33am UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/13 "2018-08-01T03:33:18Z")

</div>

Cool game! While some vendor js files are not accessed in China.

---

<div class="post-metadata">

**Author:** ![r4nd0m](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/r4nd0m/32/9477_2.png) [@r4nd0m](https://discourse.processing.org/u/r4nd0m)\
**Post date:** [August 6, 2018, 10:03pm UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/14 "2018-08-06T22:03:13Z")

</div>

Hi, [gaocegege](https://discourse.processing.org/u/gaocegege) probably google analytics and/or facebook/twitter social plugins are being filtered.

---

<div class="post-metadata">

**Author:** ![Extension\_Shoe](https://avatars.discourse-cdn.com/v4/letter/e/6de8d8/32.png) [@Extension\_Shoe](https://discourse.processing.org/u/Extension_Shoe)\
**Post date:** [September 1, 2018, 12:56pm UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/15 "2018-09-01T12:56:47Z")

</div>

Hey just checked out your game and I have couple of questions I hope you can answer for me:

1. I checked your code using chrome console I see you use a vundled js file which is good I guess but I have got to ask why did not you obfuscate it? I can see you changed variable names to single letters but shouldn’t you obfuscate it better?

2. How did you promote your game? Who did you contact with?

3. Where did you get the .io domain? Was it free? If not how much do you pay for it? I am currently stuck with ithub pages which has been great so far but adding .github.io at the end is a little annoying.

4. Are you using [socket.io](http://socket.io) for communication? If not why?

5. This one is not a question but more of a favor to ask can you check out my game it is a multiplayer space fighting game with the server running on heroku: [https://extensionshoe.github.io/](https://extensionshoe.github.io/)

Thanks in advance 😃

---

<div class="post-metadata">

**Author:** ![kfrajer](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kfrajer/32/196_2.png) [@kfrajer](https://discourse.processing.org/u/kfrajer)\
**Post date:** [September 1, 2018, 6:43pm UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/16 "2018-09-01T18:43:27Z")

</div>

@Extension_Shoe Can you provide a link to your post. I believe ppl should be commenting about your game in your post. You can always cross-link to this post if you think it is important.

I find your code a bit laggish. It could be server or it could be the way you handle your graphics as you are using a larger game space.

Kf

---

<div class="post-metadata">

**Author:** ![r4nd0m](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/r4nd0m/32/9477_2.png) [@r4nd0m](https://discourse.processing.org/u/r4nd0m)\
**Post date:** [September 2, 2018, 4:10pm UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/17 "2018-09-02T16:10:48Z")

</div>

Hi @Extension_Shoe!  
Just tried out your game, It’s fun. Keep up the good work!

1. JS bundle you see is a result of webpack optimize (uglifyjs) plugin working in production mode with default options. I’m really not concerned about hiding the code.
2. I’m trying to post regularly on Twitter/Reddit/Youtube.
3. You must buy one. io domains are ~35$/yr. Try Namecheap or GoDaddy.
4. Yes.  
Cheers

---

<div class="post-metadata">

**Author:** ![r4nd0m](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/r4nd0m/32/9477_2.png) [@r4nd0m](https://discourse.processing.org/u/r4nd0m)\
**Post date:** [October 7, 2018, 6:58pm UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/18 "2018-10-07T18:58:15Z")

</div>

I’m currently working on a game development framework with wich [Owom.io](http://Owom.io) was developed.  
Trying to simplify some things, add new features to it, generally polish the thing before actual release.  
Here is my first video on the progress.  
[https://www.youtube.com/watch?v=p-gwhy8z3W0](https://www.youtube.com/watch?v=p-gwhy8z3W0)

---

<div class="post-metadata">

**Author:** ![Quillbert1](https://avatars.discourse-cdn.com/v4/letter/q/f475e1/32.png) [@Quillbert1](https://discourse.processing.org/u/Quillbert1)\
**Post date:** [October 10, 2018, 3:12am UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/19 "2018-10-10T03:12:26Z")

</div>

This is a cool game! I can’t wait until you make the backend code open source!

---

<div class="post-metadata">

**Author:** ![r4nd0m](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/r4nd0m/32/9477_2.png) [@r4nd0m](https://discourse.processing.org/u/r4nd0m)\
**Post date:** [November 22, 2018, 5:36pm UTC](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854/20 "2018-11-22T17:36:23Z")

</div>

Framework which powers [owom.io](http://owom.io) is now available on NPM.  
Feel free to play with it, and any feedback is much appreciated 🙂  
[https://www.npmjs.com/package/froobit](https://www.npmjs.com/package/froobit)

[Next page](https://discourse.processing.org/t/i-created-multiplayer-online-game-with-p5js/854.md?page=2)
