Chip Cullen

Layer Cake: A Responsive Design Layout Pattern

There is a design pattern that I’ve noticed emerge on a lot of the responsive projects that I’ve worked on in the last few years. They have all tended to gravitate towards a particular kind of layout. There are a lot of situations where this pattern is helpful, so I wanted to write a bit about it.

I call it “The Layer Cake” - it’s a way to approach page layout in a responsive design. You can also call it ‘tiered’ layout - but, mmmmm - cake. This differs from a regular ‘multi column’ layout in that there is no all-encompassing container, or long running sidebars. There can be multiple columns within a layer, though.

A 2 Column Layout vs. a Layer Cake

Keep reading Layer Cake: A Responsive Design Layout Pattern

Creativity is yet to come in Web Design


The above talk was given by Andy Clarke last November, lamenting the lack of “soul” and creativity in Web Design. He argues that the industry’s fixation on process and execution has left little room for great ideas.

Keep reading Creativity is yet to come in Web Design

Where to begin? How I start a visual design for the web

Editor’s note: This blog post is a written version of a talk that I gave at the UX Bar Camp DC 2015.

Visual Design, which, despite my background in it, often feels like the hardest part of an overall web design project for me. By “Visual Design” I’m referring to establishing look, feel, texture color, etc. So much of it seems objective and hard to judge. There aren’t arbitrary boundaries that can easily be evaluated against.

This is not another “blah blah - first design” argument. This part of the process is independent of research, testing, business goals, discovery, etc. This is purely the moment of when you crack open a design document - what do you do?

This is not prescriptive. This is about what works for me, which I’m posting in the hopes that it helps someone else out there help think through their processes.

Keep reading Where to begin? How I start a visual design for the web

Mac OS X Digital color meter for web designers

Digital Color Meter

Have you ever wanted to figure out the particular color of a piece of text, or a background, without having to sift through a CSS file, or open Photoshop to use its eye dropper tool?

One of the secrets of the Mac OS, at least for web designers, is the utility called Digital Color Meter. I’m surprised more designers and developers don’t know about it, so I thought I’d try to rectify that situation.

Keep reading Mac OS X Digital color meter for web designers