https://github.com/ameobea/sketches-3d

Experiments and demos of 3D game-like things. Mostly using Blender + Three.JS with custom shaders and interactive bits.
https://github.com/ameobea/sketches-3d

gamedev glsl shaders svelte sveltekit threejs webgl

Last synced: 4 months ago
JSON representation

Experiments and demos of 3D game-like things. Mostly using Blender + Three.JS with custom shaders and interactive bits.

• Host: GitHub
• URL: https://github.com/ameobea/sketches-3d
• Owner: Ameobea
• Created: 2022-08-16T20:39:34.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2023-12-12T22:31:26.000Z (over 1 year ago)
• Last Synced: 2024-04-15T04:36:44.731Z (about 1 year ago)
• Topics: gamedev, glsl, shaders, svelte, sveltekit, threejs, webgl
• Language: TypeScript
• Homepage: https://3d.ameo.design/rainy.html
• Size: 1.93 MB
• Stars: 17
• Watchers: 2
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# 3D Sketches + Experiments

This holds the outputs of my foray into 3D modeling, shaders, Three.JS, and psuedo-gamedev.  It consists of a variety of scenes, sketches, and experiments that I created while learning and exploring the tech and methods involved with creating interactive 3D content that runs in the browser.

|![A screenshot of one of the 3D game-like demos I've been working on.  Shows a floating bridge with a pixelated texture and some metal arches, a brightly-colored green and red sky, and maroon fog over the bridge's surface](https://i.ameo.link/abw.png) | ![A screenshot of one of the 3D sketches I created as a part of this project.  A golden arch made out of a metallic-rocky material stands on a concrete plinth.  It sits in what looks like a sort of shrine with curved stone arches.  There is a cobblestone floor and stone walls.  The graphics are remiscent of PS2 games or similar style.](https://i.ameo.link/azv.png) |

|:---:|:---:|

## In-Browser Demos

* [Pinklights ![A screenshot of the pinklights scene.  It shows a bright panel in the background with dark slats over it which is casting long horizontal shadows over a rocky-looking pixelated ground.  There are some hills around the area and the camera is placed in a small valley.  It looks kind of like if you were inside a terrarium.](https://i.ameo.link/azt.png)](https://3d.ameo.design/pinklights.html)

* [Bridge2 ![A screenshot of the bridge scene.  It shows a pastel-colored sky in the background with a yellow sun disc.  There are some floating geometric monoliths on the left, and some dark wall-like structures on the right casting prominent shadows.  The ground looks to be rocky with embedded metal that reflects golden in the light.](https://i.ameo.link/azu.png)](https://3d.ameo.design/bridge2.html)

* [Rainy ![A screenshot of the rainy scene.  It is a dark gray scene with a black railing and some concrete pillars, like a long balcony that is part of an apartment complex.  There are many dark concrete skyscrapers in the background, blurring into the background as they go further back into the distance.](https://i.ameo.link/ayc.png)](https://3d.ameo.design/rainy.html)

* [Particle Conduit ![A screenshot of the particle conduit sketch.  Strings of colored particles stream through space.  A control panel configuring the simulation params exists on the right.](https://i.ameo.link/azx.png)](https://3d.ameo.design/blink.html)

## Tech

Most of the stuff here is built using Blender, Three.JS, and some custom shaders. It will all run in the browser, targeting desktop devices with mouse + keyboard. SvelteKit is used as a lightweight framework for wrapping everything up and bundling releases.

Include audio integration that is generated in realtime also in the browser via my [web-synth](https://github.com/ameobea/web-synth) project.