Show HN: Timbuk2 Bag Customizer from Flash to Ember.js and Canvas

timbuk2.com

9 pointsjguimont3 comments

I built this with my team at http://porkepic.com . We built this with 1 designer, 1.5 developer over 3 months.

Here to answer any question you might have on the implementation.

This had to be a fun project/client. How did you design the color selector? Was it tons of different images or something more programmatic?

There are 2 kind of fabrics, the ballistics (solid colors) and all the others.

For the ballistics all the colorization is done on the browser using canvas. There is a grey mask that is exposure (based on an exposure curve for the color) and tint adjusted (based on the color chosen) and then composited on the canvas. All the swatches on the right side and the bag are colorized like that.

For all the other fabrics, it is a bunch of images precut and loaded on the canvas.

Reply on news.ycombinator.com