Index
Overview
Ben Fry created AsciiVideo, a Processing sketch which transforms live
video into ASCII text art, and shared his approach with
the Processing language community. Instead of using brightness-sorted letters for pixels, this studio will take
his work a step further and use brightness-sorted images instead.
The methods that you'll learn in
this studio were used to create the video installation "Barbie Mirror", which
translates live video into a moving mosaic of tiny Barbie
doll faces. Create the same mosaic effect with your own image
collections.
Get inspired! Ben Fry, Daniel Rozin, Golan Levin, Camille Utterback, Brian Knep, Philip Worthington
Ingredients:
- Installed Processing application
- Live video input or a local movie (e.g. .mov) file
- Some prior programming knowledge
Steps in the process:
- Collect thumbnail images and tour Processing.app
- Collect thumnail images. /try it
- Tour Processing application. /try it
Download completed processingIntro0b sketch
- Walk through AsciiVideo sketch and modify video source:
Download AsciiVideo sketch
- Add comments, subtract unnecessaries. /try it
Download completed mosaicPresenterStep1a sketch
- Edit to use an existing movie file instead of live video. /try it
Download completed mosaicPresenterStep1b sketch
- Switch from ASCII characters to thumbnail images:
- Pair character-related variables with new thumbnail-related variables.
Comment "* Preview *" where related code changes will occur. /try it
Download completed mosaicPresenterStep2a sketch
- Get thumbnail images (skipping file reading code) incorporated in place of characters. /try it
Download completed mosaicPresenterStep2b sketch
- Get thumbnail image files read and working, with help from Daniel Shiffman. /try it
Download completed mosaicPresenterStep2c sketch
- Repair vertical start position for placing thumbnails. /try it
Download completed mosaicPresenter sketch
At this point, we've got a basic working mosaic video presenter application. Next, let's create an application to get those thumbnail images analyzed and ready for sorting so that the presenter app can use them.
- Create a sort-ready directory of brightness-prefixed thumbnail images:
- Borrow useful code from mosaicPresenter/AsciiVideo code.
Comment "* Preview *" what major code chunks need to do. /try it
Download completed imageSorter3a sketch
- Calculate brightness of each image file. /try it
Download completed imageSorter3b sketch
- Prefix brightness to image filename and save copy in "sort" subdirectory. /try it
Download completed imageSorter sketch
- Fine-tuning options
- Quick experiments to improve your real-time mosaic. /try it
Download completed mosaicPresenterStep4a sketch
Download completed imageSorterStep4a sketch
- Generate .csv file showing how thumbnails map to 256 levels of brightness (a.k.a. histogram). /try it
Download completed imageAnalysisCSV sketch
Skip to the end and download all the finished sketches instead
Let's begin!