ThreeJS With Pointlight Shadows and Star Sphere

Screenshot 2016-03-03 18.41.40

This is another experiment using the ThreeJS library I made recently to learn about point light and shadows and creating a background surrounding illusion of stars.

The scene starts with only 2 of the blue shapes but the user can add more shapes or remove them one by one with the control panel on the right and clicking on the ‘addShapes’ or ‘killShape’ buttons.

The point light source can be moved by changing it’s position values via the control panel. Other light attributes can also be tweaked by the user.

There is a rotating star field in the background that surrounds the scene of blue shapes and this can also be controlled.

The ground itself can be raised or lowered to change the feel of the shapes in the scene. When the ground in raised, the shapes appear as if they are smaller objects meandering in a larger space. When the ground is lowered, the shapes hover over it.

Finally, the viewpoint perspective of the scene can be changed with a mouse to rotate around, over and under (click and drag the mouse to do so). Also the view can be zoomed in and out (use the mouse scroll wheel or two fingers sliding without pressing on an apple mouse/touchpad).

The below image shows the scene with the ground level raised so that only the very tops of the shapes are visible. This makes me think of skaters at night on a large illuminated surface of freshly smoothed ice.

ThreeJS With Pointlight Shadows and Star Sphere

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s