• Stars
    star
    207
  • Rank 188,887 (Top 4 %)
  • Language
    JavaScript
  • License
    Apache License 2.0
  • Created over 5 years ago
  • Updated over 4 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

PoseNet Sketchbook is a collection of open source, interactive web experiments designed to allude to the artistic possibilities of using PoseNet (running on tensorflow.js) to create a relationship between movement and machine.

PoseNet Sketchbook

PoseNet Sketchbook is a collection of open source, interactive web experiments designed to allude to the artistic possibilities of using PoseNet (running on tensorflow.js) to create a relationship between movement and machine.

Try out the live demos.

These prototypes exemplify a wide range of interactions that PoseNet can enable. Together, they make up a raw starter kit that is built to be used by dancers and developers alike.

This is not a library or code repository that intends to evolve. Instead, it is an archive of where Body, Movement, Language first began. You can use this collection of code as a starting point to create your own wacky or wild or just plain useful PoseNet experiments.

To read more about the journey from PoseNet Sketchbook to Body, Movement, Language in the blog post here.

Install and Run

First, clone or download this repository. For more information on how to do this, check out this article.

Next, Make sure you are in the project folder: All of the commands below should be run from your terminal on your machine.

cd posenet-sketches

Install dependencies:

yarn

To watch files for changes, and launch a dev server:

yarn watch

The server should be running at localhost:1234.

File structure

All sketches use PoseDetection.js, a wrapper class I created to handle the PoseNet data.

Each individual sketch is hosted in the 'sketches' folder.

  • index.html:
  • style.css: Styling for the sketch.
  • assets/: The thumbnail, gif, and any additional assets used in the sketch.
  • js/: The soure files.
    • main.js: Set up the camera, load the video, and initialize Pose Detection and the sketch.
    • sketch.js: This is where the ~ magic ~ happens. Some functions to note:
      • setup: Initializes the the canvas width and height.
      • initSketchGui: Sets up the GUI elements that will affect the sketch and adds them to the GUI structure.
      • draw: Looping at 60 fps. Renders and updates elements on canvas with each call.

The Sketches

Basic

How does PoseNet interpret your pose?

basic demo gif

Movement Multiplier

How might we allow past motion to linger?

movement multiplier gif

Text Trailer

How might movement history affect text on screen?

text trailer gif

Shape Shifter

How might movement be translated and abstracted into new forms?

shape shifter gif

Collage Creator

How might a variety of elements collage to recreate a figure on screen?

collage creator gif

Body Transcriber

How might spoken words manifest on screen in relation to the body?

body transcriber gif

Color Mapper

How might body poisition be used as a controller?

color mapper gif

Image Mapper

How might body position surface and highlight content?

image mapper gif

Audio Controller

How might body position manipulate an audio experience?

audio controller gif

Contributors

Built by Maya Man at the Google Creative Lab.

Notes

This is not an official Google product.

We encourage open sourcing projects as a way of learning from each other. Please respect our and other creators’ rights, including copyright and trademark rights when present when sharing these works and creating derivative work. If you want more info on Google's policy, you can find it here. To contribute to the project, please refer to the contributing document in this repository.

More Repositories

1

anypixel

A web-friendly way for anyone to build unusual displays
C
6,437
star
2

quickdraw-dataset

Documentation on how to access and use the Quick, Draw! Dataset.
6,092
star
3

teachable-machine-v1

Explore how machine learning works, live in the browser. No coding required.
JavaScript
3,848
star
4

coder

A simple way to make web stuff on Raspberry Pi
JavaScript
2,425
star
5

open-nsynth-super

Open NSynth Super is an experimental physical interface for the NSynth algorithm
C++
2,419
star
6

chrome-music-lab

A collection of experiments for exploring how music works, all built with the Web Audio API.
JavaScript
2,127
star
7

aiexperiments-ai-duet

A piano that responds to you.
JavaScript
1,631
star
8

teachablemachine-community

Example code snippets and machine learning code for Teachable Machine
TypeScript
1,488
star
9

paper-signals

Build your own voice controlled object.
C++
742
star
10

aiexperiments-drum-machine

Thousands of everyday sounds, organized using machine learning.
JavaScript
736
star
11

Sprayscape

Sprayscape is a perfectly imperfect VR-ish camera. It is an open source Android app released on the Android Experiments platform.
Objective-C
568
star
12

teachable-machine-boilerplate

Boilerplate code for Teachable Machine
JavaScript
504
star
13

aiexperiments-giorgio-cam

Take a picture to make music with the computer.
JavaScript
481
star
14

aiexperiments-bird-sounds

Thousands of bird sounds visualized using machine learning.
JavaScript
474
star
15

ar-drawing-java

A simple AR drawing experiment build in Java using ARCore.
Java
415
star
16

inside-music

Inside Music lets you step inside of a song, seeing its individual pieces to give you a closer look at how music is made.
JavaScript
384
star
17

meter

Meter is a data-driven wallpaper that displays your battery, wireless signal and notifications
Java
362
star
18

digital-wellbeing-experiments-toolkit

Code components for starting your own Digital Wellbeing experiments
Kotlin
341
star
19

giantemoji

JavaScript
313
star
20

creatability-components

Web components for making creative tools more accessible.
TypeScript
287
star
21

morse-learn

A fun little web app to help you learn Morse code on Gboard.
JavaScript
284
star
22

alto

Explore the basics of machine learning by building your own teachable object at home.
Python
278
star
23

aiexperiments-sound-maker

Make unusual new sounds with machine learning.
JavaScript
255
star
24

justaline-android

The first cross-platform collaborative AR app (for doodling)
Java
252
star
25

shadercam

Simple OpenGL Shaders with the camera2 apis in Android 5.0+
Java
240
star
26

arexperiments-portal-painter

Doodle new worlds onto your own, with Google ARCore.
C#
198
star
27

beat-blender

Blend beats using machine learning to create music in a fun new way.
JavaScript
190
star
28

coder-projects

Fun projects and sneakily educational things that can all be made with Coder and Rasberry Pi.
CSS
188
star
29

landmarker

Orientation, GPS, and Places enabled Android Experiment
Java
180
star
30

webvr-musicalforest

Join users from around the world in a musical forest. A WebVR Experiment.
JavaScript
164
star
31

balloon-pop

A multiplayer geospatial experience
C#
163
star
32

melody-mixer

A fun way to explore music using machine learning.
JavaScript
153
star
33

lipswap

Replace sections of a photo with your own recorded video.
Java
142
star
34

norman-ar

Decorate your world with AR animations.
C++
136
star
35

justaline-ios

The first cross-platform collaborative AR app (for doodling)
Swift
120
star
36

quickdraw-component

Use any of the of the 50 million Quick, Draw! doodles in your web-based project with one line of markup
JavaScript
104
star
37

creatability-seeing-music

Experience music visually.
JavaScript
101
star
38

semi-conductor

Semi-Conductor allows you to conduct a virtual orchestra using only your web browser & webcam.
JavaScript
100
star
39

tunnelvision

Distort your surroundings through a collection of transformative filters
Java
93
star
40

lines-of-play

Design domino art creations that interact with the real world using the ARCore Depth API.
C#
89
star
41

project-oasis

A voice controlled terrarium that recreates outside weather inside a box
JavaScript
89
star
42

access-mars

JavaScript
82
star
43

tiny-motion-trainer

Train and test machine learning models for your Arduino Nano 33 BLE Sense in the browser.
JavaScript
79
star
44

mystery-animal

A new spin on the classic 20-questions game.
JavaScript
79
star
45

mix-lab

MixLab is an experiment that makes it easier for anyone to create music, using simple voice commands.
TypeScript
71
star
46

sounds-in-space

An interactive audio experience, where the virtual sounds you hear change depending on your physical location.
C#
70
star
47

tf4micro-motion-kit

Arduino Sketch and a Web Bluetooth API for loading models and running inference on the Nano Sense 33 BLE device.
C++
66
star
48

obvi

A Polymer 3+ webcomponent / button for doing speech recognition
JavaScript
57
star
49

finger-user-interface

Control connected devices with the wave of a finger.
C
54
star
50

xyfi

Xyfi: BYO pointing device at a physical installation
JavaScript
48
star
51

morse-speak-demo

Text-to-Speech (TTS) demo web app that converts written text into spoken words via Morse code
JavaScript
44
star
52

aog-canvas-quiz

Canvas Quiz is a starter kit for developers to make custom, voice-enabled question-answer games for the Google Assistant.
JavaScript
40
star
53

air-snare

Play drums in the air.
Svelte
40
star
54

webvr-speaktogo

Explore the world with your voice.
JavaScript
34
star
55

norman-sketch-player

Embed Norman animated sketches on the web
JavaScript
29
star
56

pattern-radio

Code for patternradio.withgoogle.com
JavaScript
27
star
57

things-with-firebase-at-io2017

The Android Things projects used in the Experiments Tent at Google I/O 2017
Java
22
star
58

astrowand

Draw shapes in the sky to form constellations with TensorFlow and a microcontroller.
JavaScript
19
star
59

visual-alarm-clock

Get up in the morning by striking a pose to stop your alarm from ringing.
C++
10
star
60

dat.fire

JavaScript
6
star
61

.allstar

2
star
62

.github

1
star