A really interesting and well-executed portfolio site, utterly let down by the tone of this demeaning and insulting piece of copy:
WARNING: Do not proceed if you suffer from vertigo or if you find experimental interfaces offensive.
(Pssst: copy is also interface.)
A great post from Anna on the front-end styleguides she’s worked on for A List Apart and Code for America. ‘Twas a pleasure working with her on the Code for America project.
A-mer-ica! Fuck yeah!
Mike has written about the Code for America alpha website that we collaborated on:
We chose to work with ClearLeft because they develop a pattern portfolio (a pattern/style library) which would allow us to scale our work to our Brigades. This unique approach has aligned perfectly with our work style and decentralized organizational structure.
Thankfully, I think the approach of delivering a pattern portfolio (instead of just pages) isn’t so unique these days. Mind you, it still seems to be more common with in-house teams than agencies. The Mailchimp pattern library is a classic example.
But agencies like Paravel are—like Clearleft—delivering systems, not pages. Dave wrote about providing responsive deliverables:
Responsive deliverables should look a lot like fully-functioning Twitter Bootstrap-style systems custom tailored for your clients’ needs.
I think that’s a good way of looking at it: a Bootstrap for every project.
Here’s the front-end style guide for Code for America.
Usually these front-end deliverables will be password-protected on the Clearleft extranet for the client’s eyes only, but Code for America are all about openness, so they’re more than willing to let us share it with the world. That makes me very happy. I remember encouraging the guys at Starbucks to publish their front-end style guide and I’ve written about this spirit of sharing before:
These style guides and pattern libraries aren’t being published in an attempt to provide ready-made solutions—every project should have its own distinct pattern library. Instead, these pattern libraries are being published in a spirit of openness and sharing …a way of saying “Hey, this is what worked for us in these particular circumstances.”
If you’re poking around the Code for America style guide, you’ll notice that it borrows some ideas from the pattern primer idea I published a while back. But in this iteration, the markup is available via a toggle—a nice variation. There’s also a patchwork page that provides a nice glance-able uninterrupted view of the same patterns.
Every project is a learning experience and each front-end style guide gives us ideas about how to do the next one better. In fact, Mark is busy working on better internal tools for creating these kinds of deliverables—something we’ll definitely be sharing. In the meantime, I’ll be encouraging other clients to be as open as Code for America have been in allowing us to share these deliverables.
For more on the usefulness of front-end style guides, be sure to read Paul’s article on style guides for the web, Anna’s classic 24 Ways article, and of course, Anna’s pocket guide from Five Simple Steps.
I kind of love the interaction design of this site.
Jon gives some insight into how and why we use pattern portfolios as deliverables at Clearleft.
Kyle’s new site is looking lovely and responsive (thanks to Josh). But mostly it just gets out of the way so you can take in his truly amazing work.
Aegir’s portfolio is a thing of a beauty on every screen size.
A lovely responsive portfolio showcasing a lovely responsive site. Responsinception!
Naz shares his advice for up-and-coming designers …and the institutions that educate them.
I don't normally like all-Flash sites and I really don't like sites that mess with my cursor* but this one works really well. * I'm looking at you, Harry Potter Twitter site with the password anti-pattern.
Black ink meets water.
Beautiful photography.
Best. Portfolio/resumé. Site. Ever.
Camille Seaman's stunning pictures of icebergs and clouds make me feel small and insignificant. But in a good way.
The idea I like most from this portfolio is the heat-sensitive wallpaper with blooming flowers.
Beautiful artwork in a minimalist interface. But you'd better have your browser window maximised on a big monitor. *sigh*
The portfolio of a food photographer.
A strange and beautiful portfolio of photographs.
This local artist does great things with mackerel. I think I might have to get a piece to hang in the new flat.
Cameron has put together a lovely looking portfolio page.