Sketchpad for Custom Print

Sketchpad for Custom Print

Sketchpad has been used in applications from scientific machine learning, to kids drawing, but we haven’t had much chance to focus on any commercial aspects. This is why we’re excited to be changing that. We’re gearing up to provide the technology that makes your users product customization experience quick and easy by tapping into our(…)

Sketchpad 3.0

Sketchpad 3.0

Sketchpad 3 is available in the Chrome Webstore (for free), combining WebGL effects with vector editing, and lots of HTML5 goodness! Some of the major improvements include: Webcam FX core integration—take photos with your camera, add filters, and place into your drawing! Save your entire drawing, from vector commands, to attached assets into a single .SKETCH package container(…)

WebcamFX – GLSL Shaders

WebcamFX – GLSL Shaders

Take photos with your webcam: mix and match combinations of filters to come up with your own unique effects. FilterStack includes a large collection of filter combinations to help get you started. Once you’re happy with your image, you can save to your computer, or upload to Sketch.IO to share with your friends. Similarly, you(…)

Open Source Code on Github

Open Source Code on Github

I’ve recently started releasing a bunch of projects on Github, generally these a bits of code that I find to be very useful in many various projects like Event.js, or just a fun little exercise in code like porting the Inkscape Star tool into Javascript, this is an overview of some of my favorites, and code used in(…)

Sketchpad 2.1

Sketchpad 2.1

UPDATE: Read about Sketchpad 3.0 Where Sketchpad 2.0 introduced non-destructive vector + bitmap editing on the web, Sketchpad 2.1 (SP2.1) takes that bland package of vector tools and borrows features from Sketch Mobile, an app that exhibited my furthest exploration in creating colorful enviroments. SP2.1 is great at creating background wallpapers quickly now that most of(…)

Sketchpad 2.0

Sketchpad 2.0

UPDATE: Read about Sketchpad 3.0 Introducing a new way to create graphics online. Sketchpad 2.0 is a non-destructive vector & image editor, built in HTML5, that you can start using right now, for free! I/O is for input and output, that means, any drawing you make can be shared, forked, and edited. You can drag and(…)

Making Web Magic

I recently had the honor to be part of a new series called Presets on Google Developer Live hosted by Paul Irish, and lovingly put together by Louis Grey, Phoebe Peronto amongst other Googlers. We discussed my most popular Chrome Experiments including Color Sphere, Color Piano, as well as my latest project Sketchpad 2.0. Here’s the description of(…)

“Time Traveler” piano song

It’s time to start going out of my comfort zone and pursuing music a bit more! This is a song that I wrote earlier this year for the harpsichord and dulcimer, performed on the electric keyboard, and mastered in Logic. It’s dedicated to my sister, who is living in Tanzania the next few years teaching elementary school.(…)

Sketch Mobile

Sketch Mobile

Sketch Mobile is a drawing app build for mobile browsers; taking advantage of technologies such as multi-touch, the accelerometer, and the gyroscope; providing a fun & novel environment to express yourself in colorful ways Sketch Mobile was commissioned by Google as part of the Mobile Chrome Experiments released at Google I/O show in San Francisco. It(…)

Color Picker

The latest rendition of the Color Picker “Classic”, themed after Photoshop, GIMP, and other image editors—there are no frills here, it’s a basic Hue, Saturation, Luminance, and Alpha (HSVA) color selector. It works in browsers that support the <canvas> element; Firefox 2+, Safari 3+, Opera 9+, Google Chrome, IE9+. Configuration: size—how large the saturation/luminance area(…)

MIDI.js

MIDI.js

MIDI.js (on github) ties together, and builds upon frameworks that bring MIDI generation to the browser. Combine MIDI.js with jasmid to create a web-radio MIDI stream similar to this demo… or with Three.js, Sparks.js, or GLSL to create Audio/visual experiments. Piano/guitar simulations, Drum machines, MIDI recording, and all kinds of certified funkitude are within your grasps (with a little elbow grease)! Google Chrome is(…)

Color Piano 2.0

Color Piano 2.0

Learn how to play piano songs by watching notes fall towards the keyboard as color-blocks; similar to how Guitar Hero works, but with a real instrument. Color piano Theory (CPT) ties together chords, scales, inversions, octaves, key signatures, and play-by-play examples of classical compositions, getting you started with playing piano the easy way =) Color Piano is(…)

HTML5: SoundFonts

Color Piano Theory is now available on the Chrome Webstore. There haven’t been any major UI overhauls since last reported, but there has been a lot of work going on the back-end! Most importantly moving from the Java interface to native HTML5 <audio> tag (as Java isn’t supported in the Chrome Webstore). Although this sounds like a(…)

Batch Thumbnail Generator

Batch Thumbnail Generator

Many times, when researching a larger project, I make smaller demos—to break up my workflow, and keep things fresh. The Batch Thumbnail Generator (BTG) is one of these offshoots, a sandbox for creating zip packages with the BlobBuilder API, and Flash based download solutions—I also used BTG to create the thumbnails for the Software page(…)

ColRD: Image DNA

ColRD: Image DNA

Exciting news on ColRD.com! Today we’re announcing the public beta of Image DNA, available exclusively on the Chrome Webstore. Image DNA is an application that aides you with intelligent extraction of colors from images. The colors extracted are spread evenly across the humanly visible spectrum; so you’ll notice, for example, although there is not much blue in(…)

Portland Ketchup

Portland Ketchup

I’m thrilled to see Portland Ketchup in the Oregon Museum of Science & Industry (OMSI), this place has always held a sweet place in my heart, it was (and continues to be) an adventure to visit; from the newest exhibits, to it’s oldest classics! Who could forget being part of a zero-gravity simulation, having their friends(…)

Color Sphere

Color Sphere

Color Sphere was one of my 1st HTML5 projects, way back in 2007. Well, the years passed, browsers sped up, my hair grew longer, and nothing changed on Color Sphere… but the time has come! The latest rendition is bigger (easier to see), more accurate (pixel perfect), and looks really cool when you switch it(…)

Print-ready graphics in <canvas>

Print-ready graphics in <canvas>

Last month, I posted about the possibility of creating high-resolution and print-ready graphics in <canvas>. Since then, it’s been in the back of my mind, but happened to be at Kinko’s today, and decided to take this experiment to the next level… The following flash-cards were designed in Illustrator [by Altered Focus], exported into SVG, then(…)

Bitwise Gems and other optimizations

One of my favorite posts in the last few years was Bitwise Gems in AS3 by Polygonal Labs, an article inspired by Bitwise Operations in C on Gamedev. This article is a summery of what I’ve learned, applied to Javascript, plus a few other tricks. What’s the wisdom in using bitwise? Bitwise operations can be(…)

ColRD: Gradient Creator

ColRD: Gradient Creator

Tonight, on ColRD, we released the latest rendition of Palette Creator, along with our newest addition; the Gradient Creator! This new webapp makes it fun and easy to create CSS3 linear gradients :) UPDATE: You can also download the Gradient Creator as a Chrome webapp. Features: Drag & Drop GIMP Gradient (.GGR) files into the browser to view(…)

Load More