Lucid Projects

Blog - Day to day mumblings...
Liveweb Final Idea

Liveweb Final Idea

18 Nov 2020 - Jake Sherwood

tvLand Liveweb Final Idea

Liveweb Final Idea

For my LiveWeb final I want to combine a few things we’ve gone over this semester.

At the base I want to use threejs and incorporated Aidan’s threejs_webrtc template.

Building on that I want add a few features from previous assignments this semester.

I also wanted to add a more surreal environment to the scene.

I modeled this space rock in Blender and have pulled it into a basic threejs set up.
space rock 3d blender object

I started from a base example without the webrtc code and have been working on adding camera / orbit controls to both move the camera around the space as well as move a single object.


threejs space rock world

Aidan’s template does all that but I am adding a few more user controls.

I also added a background image by cubemaping an HDRI image I found. This great webtool lets you take an HDRI/equirectangular image and cute it up into a cubemap..

I also want to add my private chat code and a way to show / hide chat next to your avatar.


chat private messages

Additionally I plan to add what I’ve been thinking about as a virtual “tattooing.” When you interact with another user you will be able to randomly skin one side of their cube. The front cube will be excluded and reserved for the user’s video.

I’d like it to work similarly to the roulette message project I did. When you within close proximity you will be able to click a button or hit a key to start the roulette and “tattoo” one side of he user’s avatar cube.


cube tattoo roulette

The above gif was with saved video, but perhaps this version would have an array of gifs or other relavant content. Also perhaps users could upload their own images to added as an option.

I’m not sure if I will able to attach the roulette to the side of the cube but I hope it is possible.

If I get all that done I would like to also explore controlling movement of the cube with the phone as a controller. Also adding some game aspect to it would be nice.

Things to do
1) Finish user controls - I want to add a jump control
2) Add raycasting to allow for the traversing the terrain of the space rock
3) Add boundaries to limit movement. Decide if I want to allow for movement off of the rock
4) Finish lighting the space.
5) Tie back in all the webrtc features from Aidan’s template
6) Add private chat - data channels
7) Add tattoo roulette
8) Probably add tippy tooltips for better UI

Wish list items
9) Movement control from phone
10) Add game aspect
11) If I make it through all of the above, I would like to explore setting up an SFU

Thats the feature bloated idea at this point.

categories: liveweb

join me on this crazy ride. enter your email:

contact [at] jakesherwood [dot] com

contact me if you'd like to work together