Skip to content

A little interactive sandbox for tiny people, tiny thoughts, and their tiny stories

License

Notifications You must be signed in to change notification settings

eBildungslabor/tinyhumans

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Tiny humans 🌏

Tiny humans is a weekend hack inspired by this Instagram post. It's an interactive little sandbox world with tiny people and their tiny conversations. Play with it at tinyhumans.vercel.app or check out the gallery below for some ideas.

Tiny humans is written entirely in Oak, my programming language that conveniently compiles to JavaScript — you can read the whole source here. It renders everything using basic HTML 2D Canvas, and uses a custom algorithm to generate humans and their shadows. The background texture is from @marjanblan's Unsplash.

Tiny human

Build and deploy

Tiny humans is written in Oak. To develop or modify it, you'll need to install the oak tool from the latest release. With it installed:

  • Tiny humas is a static single-page app. Use any web server (like node-static or python -m http.Server) to serve the project directory. I use python -m http.Server 10009 and go to localhost:10009. You should see the app load!
  • The entire Oak source code for Tiny humans is in main.oak. To compile it into bundle.js which the app loads, run
     oak build --entry main.oak --output bundle.js --web
    That --web tells oak to compile our program to JavaScript. I usually run a variation of this while developing so that the code re-compiles on every change to my file. There's lots of ways to do this, but I use entr:
     ls *.oak | entr -cr oak build --entry main.oak -o bundle.js --web
  • Oak has a code auto-formatter built in, called oak fmt. To re-format main.oak, run
     oak fmt main.oak --fix
     # or
     oak fmt --fix -- main.oak
    The --fix tells oak to fix up the file in-place. Using --diff instead won't change the file, but show any needed changes in your terminal.

Tiny humans gallery

Did you make something cool with Tiny humans? Do share it with me at @thesephist, I'd love to see :)

Tiny humans line up in formation, and a couple of leaders forge ahead into the unknown.

description

A tiny human battle is about to break out! Battlefronts form, and the first few brave souls make their moves.

description

A tiny human line forms for people waiting to join a tiny human circle. What for? That, I do not know.

description

About

A little interactive sandbox for tiny people, tiny thoughts, and their tiny stories

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • HTML 100.0%