Stuff & Nonsense product and website design

Blogging and all that malarkey

Toon Titles

Explore my growing collection of classic cartoon title cards, lovingly recreated using CSS, SVG, and SMIL animations. Enjoy the nostalgia and learn from the code on CodePen.

Kerfuffle on the Planet of the Apes

Kingdom of the Planet of the Apes is out and I decided to update one of my responsive easter egg headers—Kerfuffle on the Planet of the Apes—with more efficient, modern code.

CSS Specisithity

Originally published in 2005 and updated in 2024, CSS Specisithity explains how to master specificity using Star Wars metaphors. It’s been credited with helping web designers and developers understand what’s often considered a complex subject.

The popular Contract Killer template

Clarify what’s expected on both sides to help build great relationships between you and your clients. Contract Killer is plain and simple and there’s no legal jargon. It’s customisable to suit your business and has been used on countless web projects since 2008.

Layout Love

I wanted a simple set of layout modules I could call on for design projects, so I developed my own. I call them Layout Love and rather than keep them to myself, I’m offering them to everyone to use which I hope will encourage people to make layouts which are more interesting.

Transcending CSS Revisited

I wrote my first book, Transcending CSS: The Fine Art of Web design, way back in 2006. It became a success and since then I’ve had countless people tell me it was influential in their careers. Transcending CSS Revisited is available to read online for free, with a new foreword by Rachel Andrew.

Redecoration

It’s been a mad couple of weeks since I came back from holiday. This week onsite with my friends at STV and the first spent head down on another project. But before I could get back to work, I had to set up our new studio.

Never Buy The Sun

I haven’t posted lyrics for a while, but it seemed appropriate this week, both with the news (no pun intended) this week that Rebekah Brooks and Andy Coulson face charges relating to phone hacking and the fact that I put the final, final, final touches to my design for the upcoming Hillsborough Independent Panel’s report into the Hillsborough Disaster that will be launched in September.

Turn on Fireworks CS6 auto-save

My beloved Fireworks, now in CS6, encountered an error yesterday and refused to save. My only option was to Force Quit the app and lose half an hour’s work. Hey ho.

Then I found out that auto-save might have helped me, maybe lose less work. Here’s what I did.

Sun

Sun is a web app designed for the iPhone and iPad. It’s making heavy use of gestures. Rest assured, you’ll be doing a lot of pinching.

Beautiful.

Bringing a knife to a gunfight — my slide deck from An Event Apart, Austin 2012

I’ve just come home from a ten hot days in Texas, where I had the honour, again, of speaking at An Event Apart alongside some of the best speakers in the industry. I enjoyed the trip, and especially the conference, enormously.

I’ve spoken at conferences regularly since my first time (again alongside Jeremy and Jeffrey) at @media 2005. (I’d never have guessed then that we’d still be friends, still doing this thing, all these years later.) But in the last couple of years I started to enjoy speaking less and emotional risk/reward ratio that goes with public speaking tipped too much toward risk. So I decided to not speak at all in 2012. That is until Jeffrey persuaded me to speak in Austin.

Unlike Jeremy, this wasn’t my first not-SXSW visit to Austin as Elliot, Simon, Tim and I and a bunch of design globetrotters went there to redesign a bank a few years ago.

I’m glad I went. Every An Event Apart conference feels special, but at this one the (unplanned) recurring themes were spooky. My talk was about designing, design process and particularly how our conventional design tools — drawing tools like Fireworks and Photoshop — are not equipped for designing today’s web. They’re ‘Bringing a knife to a gunfight!’ From the website:

In the mid-nineties, when designers started making their mark on the web, they did it with software tools and processes that they’d brought with them from print. But the web’s a different place now than it was ten, five, even two years ago; the tools and processes we’ve relied on for years are no longer capable of properly designing today’s flexible, responsive web. In this session, we’ll find new ways to design that better serve the needs of today’s responsive web, and investigate better, alternative tools and approaches to design. We’ll learn too how new tools and approaches can improve communication between designers and developers and our clients.

I hear that the talk was well received and I had a great time giving it. In fact, it’s definitely helped me to get my speaking mojo working again.

For everyone not at An Event Apart in Austin:

CodePen

CodePen is all about front end code inspiration, education, and sharing.

Like Dribbble for code? I like it. A lot.

Firefox’s file uri origin policy and web fonts

File this one under gotchas.

I’m desktop browser testing a series of layout templates for a current project today. Everything was going really well until I encountered some files where my web fonts stubbornly refused to display in Firefox, but rendered perfectly in every other browser. Luckily I found the reason for the problem and a solution to it.

PixelPerc

Converts fixed-pixel width layout dimension to percentages. It would be better with padding and box-sizing, but mustn’t grumble.

MICKY the world’s cleverest CHIMPANZEE

Before she died at the fantastic age of 98, my Nana gave me her boxes of family photographs. She knew I value family histories and would keep her things safe. I’m in the process of organising them and in one box I found a tourism brochure from Liverpool from around 1938/39. In it, an advertisement, for Liverpool Zoological Park caught my interest. In particular, “MICKY,” the world’s cleverest CHIMPANZEE.

Hosting a second responsive design workshop at Smashing Conference

Sorry to break into your Diamond Jubilee celebrations, but my Flexible Responsive Web Design workshop on the 19th September in Freiburg in Germany sold out so fast that Smashing Conference and I are hosting a second day. That’s right. We didn’t want disappointed Germans. Especially after Engerlaaand will be beating them in Euro 2012.

This one’s the day before the conference, on the 16th September.

You know the drill.

Pay up

My contribution to The Pastry Box Project this month:

There’s no reason why anyone should have to wait more than 24 hours for the money you owe them, especially people you work with.

So the next time you receive an invoice from a contractor or supplier, pay it right away. Don’t wait a month, a week, a day or even an hour longer than you have to. Better still, find out how to pay them before they start any work. That way you can pay them immediately when you receive their invoice.

They’ll feel good and so will you.

(This post was inspired by the experience of someone I know.)

BOOM, TISH, BOOM BOOM TISH

This morning I picked up the phone to (just) Holly, a chirpy sounding lady who asked if we played music ‘within our business.’ If we did, we’d need a license. I told her we didn’t (yeah, shoot first and ask questions later) and she said we’d be removed from their list (whatever that is.)

Come and have a look at what you would have won

I’ve given Vitaly and his Smashing Magazine team some (good natured) stick over the years, but (to their credit) they ignored me completely and have built a fabulous business that publishes the website and books including Smashing Book #3 that I was proud to write the closing chapter for.

Now they’re organising what I predict with be one of the best web conferences anywhere this year. The Smashing Conference will be held in beautiful, historic FreibergFreiburg in Germany on 17th and 18th September and the speaker line up is tremendous. Heck. It has three of my CSS heroes, two of my favourite people in the whole world, AND more. What a show it’s going to be!

As you probably heard, I’m taking a break from speaking this year (apart from Austin (see what I did there?)), but I will be hosting a Fashionably Flexible Responsive Web Design workshop on the 19th. It’s an updated version of the workshop that was so well received in Australia earlier in the year. (You can grab the slide deck from that from Speaker Deck to give you a taste.

You know the drill.

I’m looking forward to the Smashing Conference so much. So much! It’s going to be super, smashing, great.

NoisePNG

Need noise? Get noise.

(Via: Tim Van Damme’s @2x.)

Thoughts on pricing

This post from Jolly Bureau ties in very nicely with what I wrote for The Pastry Box Project this month. So I thought I’d elaborate on:

About a year ago, I left day rates and job rates behind and started estimating, billing and working on projects on a weekly basis. A year on and I’m better organised, more productive and less stressed than ever before. Our accounts are in better shape and no one owes us money for longer than a week. It was one of the best business moves I’ve made.

Escape From The Planet Of The Apes

When I set up my home/office wireless after switching broadband providers, I called the downstairs router’s network ‘Planet Of The Apes.’ And why not? ‘Andy Clarke’s Network’ is a boring name. (And Planet Of The Apes is a better movie than Star Wars.)

Then I called the Airport Extreme extended upstairs network ‘Rise Of The Planet Of The Apes’ and the Airport Express I keep under my desk ‘Beneath The Planet Of The Apes.’

I bought a mifi today because I’m working in London a fair bit over the next few months and the client site doesn’t have open wifi. I could stick with the network’s given name, 3MobileWiFi-c602, but ‘Escape From The Planet Of The Apes’ seems much, much more appropriate.

Hi honey, I’m home!

I’ve worked for myself for the last fourteen years and for most of that I’ve worked in my office at home.


Browse topics

Browse tags

Andy Clarke portrait

About Andy

Hello. I’m Andy Clarke, an internationally recognised product and website designer and writer on art direction for products the web. I help product and website owners captivate customers by delivering distinctive digital designs.


Subscribe to RSS feed

Britpack

Favourites

Would you like advice and inspiration on making better designs for the web?

Every two weeks you’ll get design inspiration and insights on how to improve your design. View some recent emails, sign up today, and get:

  • Email advice once or twice per month + 
  • Design tips + 
  • Inspiration + 
  • Free Layout Love templates worth £9.99 + 
  • Early access to books + 
  • Coaching offers

    I promise never to share your email and you can unsubscribe with just one click.

    Get a free set of Layout Love grid templates if you sign up today.