So Long Tumblr

I’m sad to say that I’m leaving Tumblr and moving my blog to Posterous. The uptime over the past few months has been unbelievably bad and now we’ve got spambots running rampant and drama with David Karp - all of which I can do without. I hope Tumblr works through its growing pains and ends up more successful than ever. In the meantime, I need more stability and fewer headaches for my simple little blog.

Some parting notes:

Posted on January 28, 2011 · 16 notes

Comment styling with CSS3 and -webkit-transform

Here’s a quick little tip that might come in handy for someone. I’m working on the mobile version of a magazine’s site which will be targeting WebKit browsers. The design I’m implementing calls for a list of comments that alternates the display of the commenter’s name (and timestamp info) left and right. This can be done with a single image, use of the nth-child(even) CSS selector, and -webkit-transform: scaleX(-1). The fiddle here uses jQuery, but I’m using Zepto.js (mostly jQuery-compatible syntax in just a couple of kb) for the actual implementation.

Miscellaneous thoughts:

  • For bonus points, the comment arrow could be implemented with a small canvas to remove the need for an image at all.
  • AFAIK, there doesn’t seem to be an agreed upon microformat for comments.

(Tumblr users need to click through to view the fiddle)

Posted on January 26, 2011 · 10 notes
I’m excited to announce that I have launched a redesign of my business/portfolio site Black Ant Media. I started in on a redesign about a year ago and never finished it. They say if you’re too busy to update your own site, that’s a good thing. But when you’re in the business of selling your supposed expert services, not having any work to view is an embarrassment.

I had been wanting to play with MooTools for a while now, so I took the opportunity to use it on this redesign. I came away from the experience feeling like PHP is to jQuery (everyone structures their code differently) as Rails is to MooTools (established OO patterns that pretty much everyone follows). The MooTools Fx classes offer some of the smoothest animations I’ve come across. There is still much I want to learn about this framework, but I’m really impressed so far.

I’m using the lightweight (no database) Stacey CMS for the portfolio. Since this is a single-page site, I decided to load all of the project information dynamically from Stacey using AJAX calls and fetching JSON data.

I had a fun time working on the contact form as well. For WebKit browsers, the form flips around when you submit it turning your message into an envelope that gets dropped into a slot. On the server side, I use Akismet to check for spam submissions. Please send me a message if you’d like to try it out.

I few other buzzwords I incorporated: HTML5, Sass, TypeKit, Modernizr, hCard microformat, and parallax background scrolling.

I still have a bunch of cleanup/refactoring to do and I need to make a mobile version, but I’m really pleased with how it has turned out so far.

Oh, and all of the code lives in public Github repo if you want to check it out. Hit me up on Twitter with any questions or feedback.

I’m excited to announce that I have launched a redesign of my business/portfolio site Black Ant Media. I started in on a redesign about a year ago and never finished it. They say if you’re too busy to update your own site, that’s a good thing. But when you’re in the business of selling your supposed expert services, not having any work to view is an embarrassment.

I had been wanting to play with MooTools for a while now, so I took the opportunity to use it on this redesign. I came away from the experience feeling like PHP is to jQuery (everyone structures their code differently) as Rails is to MooTools (established OO patterns that pretty much everyone follows). The MooTools Fx classes offer some of the smoothest animations I’ve come across. There is still much I want to learn about this framework, but I’m really impressed so far.

I’m using the lightweight (no database) Stacey CMS for the portfolio. Since this is a single-page site, I decided to load all of the project information dynamically from Stacey using AJAX calls and fetching JSON data.

I had a fun time working on the contact form as well. For WebKit browsers, the form flips around when you submit it turning your message into an envelope that gets dropped into a slot. On the server side, I use Akismet to check for spam submissions. Please send me a message if you’d like to try it out.

I few other buzzwords I incorporated: HTML5, Sass, TypeKit, Modernizr, hCard microformat, and parallax background scrolling.

I still have a bunch of cleanup/refactoring to do and I need to make a mobile version, but I’m really pleased with how it has turned out so far.

Oh, and all of the code lives in public Github repo if you want to check it out. Hit me up on Twitter with any questions or feedback.

Posted on January 21, 2011 · 17 notes
Profits from the sale of every HTML5 shirt go directly to the development of the HTML5 test suite.

Profits from the sale of every HTML5 shirt go directly to the development of the HTML5 test suite.

Posted on January 18, 2011 · 13 notes
One of those subtle typography gems you’d never notice otherwise. Identity by Cuban Council.

One of those subtle typography gems you’d never notice otherwise. Identity by Cuban Council.

Posted on January 13, 2011 · 10 notes
Anatomy of an Apple email
Posted on January 12, 2011 · 16 notes
A great tip from David Lanham (designer for Astronut). If you find that sharpening a layer in Photoshop is too harsh, convert the layer to a Smart Object and apply the sharpening as a Smart Filter, but bump the opacity down. The same idea can be applied to any filter where you’d like a more subtle result.

A great tip from David Lanham (designer for Astronut). If you find that sharpening a layer in Photoshop is too harsh, convert the layer to a Smart Object and apply the sharpening as a Smart Filter, but bump the opacity down. The same idea can be applied to any filter where you’d like a more subtle result.

Posted on January 11, 2011 · 58 notes
Stunning animated WebGL jellyfish by Alexandar Rodic. The shaders (including caustics for the water surface) make it nearly photorealistic. Amazing work.

Stunning animated WebGL jellyfish by Alexandar Rodic. The shaders (including caustics for the water surface) make it nearly photorealistic. Amazing work.

Posted on January 11, 2011 · 9 notes
Bike 2.0
Posted on January 7, 2011 · 15 notes

I have to admit, Microsoft is really onto something here with their Surface sequel. Looks fantastic.

Posted on January 6, 2011 · 9 notes
My all-time favorite web design shop, Cuban Council, has rolled out a beautiful redesign for their company site. As usual, their attention to detail is outstanding.

My all-time favorite web design shop, Cuban Council, has rolled out a beautiful redesign for their company site. As usual, their attention to detail is outstanding.

Posted on January 4, 2011 · 23 notes
Really impressed by the accuracy of this Word Lens app.

Really impressed by the accuracy of this Word Lens app.

Posted on December 17, 2010 · 22 notes
Posted on December 17, 2010 · 60 notes

Meet Buck - I love the visual style of this animated short. It’s like great pre-production concept art come to life. Check out Salesman Pete as well.

Posted on December 9, 2010 · 8 notes
Canvas Snow - very classy snowfall effect using canvas and some particle emitter Javascript code.

Canvas Snow - very classy snowfall effect using canvas and some particle emitter Javascript code.

Posted on December 8, 2010 · 13 notes