Fluid Corners, a window UI idea

A few days back a very sim­ple idea struck me right before going to bed. The more I thought about it, the less I could sleep. The day after this short night I fired up Pho­to­shop and started writ­ing a lit­tle bit of JavaScript. All this led to Fluid Cor­ners.

The idea is pretty sim­ple but could come in handy: when your OS’s win­dows are moved off-screen, their essen­tials UI ele­ments (think: but­tons) stay at reach, stick­ing to the screen’s limit. Go ahead and play with the demo, you’ll get it!

Thoughts wel­come, of course.

ps 1: A hot thread about it on Hacker News.
ps 2: @raphael­bastide’s take on the idea: greasy!

Hey! – A Lego Table

When I moved in I bought an IKEA Ramvik table and while trav­el­ling this sum­mer I had an idea (don’t ask why): dec­o­rate its top with Lego bricks used as pix­els. Here are the steps I went through. If you don’t care about those steps and want to see a nice time-lapse video, scroll to the end of the article!

Lego bricks

First things first. What are the Lego brick sizes and col­ors avail­able? Oddly enough this ques­tion is not that eas­ily answered. Prob­a­bly because Lego’s site is crappy, or because nobody really cares… I even­tu­ally found Brick­ipedia which hap­pens to be a much richer resource than the offi­cial ones. Every­thing I was look­ing for was there: the Lego “unit” is 8 mil­lime­ters and the color palette is pretty sim­ple.

Table specs

Know­ing my table size I had var­i­ous options, depend­ing on the “pixel size” I’d choose. Of course the num­ber of bricks (and the price) would also vary. So I cre­ated a dynamic spread­sheet on Google Docs that’d do the cal­cu­la­tions for me… Here it is, with all the options pos­si­ble (French, sorry).

iframe: <a href="https://spreadsheets.google.com/pub?key=0AmyvU-n2aOBpdG5oNUN6UW0xcUJ4a2E3eXFrTTJIVnc&amp;hl=en&amp;output=html&amp;widget=true">https://spreadsheets.google.com/pub?key=0AmyvU-n2aOBpdG5oNUN6UW0xcUJ4a2E3eXFrTTJIVnc<span class="amp">&amp;</span>hl=en<span class="amp">&amp;</span>output=html<span class="amp">&amp;</span>widget=true</a>

I chose the 4x4 option, quite cheap and still offer­ing a cool num­ber of pixels.

Design

36x16 pix­els of free­dom, that’s it. I tried lots of dif­fer­ent designs, from lo-fi pho­tos to pixel-art draw­ings. I decided to go for a Heavy Oblique Futura.

Actual size:

Look­ing good.

The Lego palette

I set my type to white, on a black back­ground. The anti-aliasing process cre­ates gray-scale pix­els to smooth the curves, which is great, but Lego bricks aren’t avail­able in all col­ors! To have a real­is­tic pre­view of what it would look like I had to cre­ate a Pho­to­shop Color Table match­ing Lego’s gray-scales (if you’re inter­ested, just ping me [UPDATE: here they are]). Here’s a com­par­i­son between Photoshop’s default gray-scales (left) and Lego’s palette (right):


You may notice that Lego’s black is a lit­tle bit light and the grays are yellowish.

Time to order bricks!

Already? Nope, not that fast. Before order­ing I had to know exactly what to order, that means count­ing the pix­els. Well, I’m not this kind of guy. I’m a devel­oper; I hate repet­i­tive chores, you know.

So I fired up Flash Builder and came up with Palet­te­Counter a sim­ple, Open­Source, app to count pix­els of each color. I also added some kind of “assem­bly instruc­tions gen­er­a­tor” to help us build it. Handy.

Time to order!

Really? Yup. I placed an order on lego.com’s Pick A Brick and received it a cou­ple of weeks later. Yay!

Let’s do this

I’m not going to describe the process (that hap­pened this sat­ur­day), just have a look at this time-lapse vid. 1020 pics shot in about an hour, yummy. Thanks to Céline and Julie for help­ing out!

Elsewhere III

Pigeon

I got lucky.


Dok — AS3 Doc. UI

Meet Dok, my lat­est and nicest AIR app to this day!

Always look­ing for help when writ­ing AS3 for Flash, Flex and AIR? Think Adobe’s ref­er­ence is rich but brows­ing it sucks? Well, I did too. So I wrote this lit­tle thingy that loads, parses and caches help pages and then presents them in a slick and quick UI!

Since this app is only intended for devs and there­fore may not be very inter­est­ing to oth­ers, I decided it should look good. So I tried my best and worked hard on those pix­els and styles (col­ors and tex­tures inspired by that sweet clock)… Jump to the project page for life-size screenshot!

This project is absolutely Open­Source, from top to bot­tom. AS3 classes, MXML, Illus­tra­tor and Pho­to­shop files, PNGs and so on… Help your­self.

Tarticrêpe

Went snow­board­ing this week-end… Hunger and alti­tude helped us develop a new culi­nary concept.

Drank some Bir­lou, lis­tened to Da Baby­lo­ni­anz, didn’t break any of my bones. Dope.

Elsewhere II

In Stores Soon

I’ve been look­ing for ideas for my 2010 greet­ing card and finally found what I was look­ing for. Dur­ing the process I devel­oped sev­eral iter­a­tions that didn’t made the final cut, I selected two of them that are not that bad but not good enough for prime time!

The “ad” version

ad

The “flash­back trip­tych” version

Since it’s a trip­tych it needs more space, so I set up a ded­i­cated page… Go see it!

What now?

The actual greet­ing card will be posted in January!

VOI7D

Just got me a Canon 7D, went out and played with it a bit (no Pho­to­shop trick, except for the text, obviously).

VOI7D

Since it also records videos it will allow me to shoot a new Beat Bat­tle soon (remem­ber?), with bet­ter image qual­ity… Cool, huh?

Elsewhere

ElsewhereElsewhere