Invention.

Thursday 24 April, 2008

Welcome to The Lab.

Atomic Ninja Labs has been the most crazy-insane, frustrating and eye-opening development I’ve done in quite some time. It’s a radical shift away from my previous experiences and represents an entirely new, fresh approach to blogging.

Gone is the re-blogging. Gone is the hard-to-handle and clumsy Wordpress interface. Say hello to Textpattern, a fresh new design, dynamic content spanning code, design, full on nerdery and piles of experimentation. All scratch built in XHTML CSS and is liberated by Textile.

So, lets rip the cover off the lab manual and see what is hiding underneath.

Structure.

The design uses the EM measure where possible, rather than px. That means it should scale (up and down) reasonably well without too much borkage, and should also display correctly in most modern standards based browsers. It wasn’t an easy or familiar choice, and it took reading Dan Cederholm’s book Bullet Proof Web Design to convince me. However.. I feel as though the design just works better as a result.

The content features include a rolling link list, full articles and lab notes. The later will cover projects and efforts this author is involved in, whereas the former will track interesting and or relevant resources elsewhere on the web¹. The design has been built to present content clearly, a minimalist “simple” brief.

Images and media are served from the Amazon Web Services S3, an ideal, stable platform to serve static media and content that helps reduce load on the (dv) server.

Typography.

The fonts used for The Lab include common cross-platform fonts such as Verdana, Geneva and Helvetica (in order of preference) for body text with Impact used for navigation bar. The logo sports Sonora Medium Italic — for something a little different I’ve deployed P22 Atomica for some of the symbols.

It’s often difficult to find a balance between using common fonts and something more unique, as there really isn’t any strong alternative to using image replacement, which is seldom efficient or portable. The decision was made to focus on content rather than cosmetics and as such the numbers of fonts used have been kept to an absolute minimum and the design should thus look very similar across a number of platforms.

Painted Canvas.

Whilst the colours might feel a little familiar, they’re actually a whole new set. The background #F5F5D5, which has been variously described to me as “fawn” or “khaki” was only actually chosen towards the end² of the design process after nearly two months of rejecting numerous other (similar and not so) colours. Given the original design goals, I think the softer colours and minimal pallet use helps illustrate a simple, clean look.

You can view the complete set at COLOURlovers.

There is a lot more going on here and I’m pretty excited about what the future holds — which I fully intend to cover over the next few weeks — but as a beginners guide to the lab, it’s a start. Feel free to have a wander around the lab. There are a small number of experiments that might quite be ready for prime time yet and rest assured I’ll be working on those.

Finally, you will have noticed that there is only one advertising spot, site wide. That is by design. I can’t go into too much detail right now, but if you’d like to know more, please do make contact to see what can be worked out.

Now it’s over to you. I’d love to hear what you think — be it conversation over the design elements, things you like (dislike?) or even simply reports of any breakage, feel free to click on the contact link below.

¹ Actually sharing the love, not just mindlessly re-blogging it.

² A happy accident with the colour chooser in the Gimp.