When I was preparing my Responsive Enhancement workshop for last year’s dConstruct, I thought I should create an example site to demonstrate the various techniques I would be talking about to demonstrate how responsive design could be combined with progressive enhancement to make something works great on any device.
Round about that time, while I was scratching my head trying to figure out what the fake example site should be, I got an email from Bobbie asking if I wanted to meet up for a coffee and a chat. We met up and he told me about a project he wanted to do with his colleague Jim Giles. They wanted to create a place for really good long-form journalism on science and technology.
“The thing is,” said Bobbie, “we want to make sure it’s readable on phones, on tablets, on Kindles, everything really. But we don’t know the best approach to take for that.”
“Well, Bobbie, it’s funny you should mention that,” I said. “I’m currently putting together a workshop all about responsive design, which sounds perfect for what you want to do. And I need to create an example site to showcase the ideas.”
It was a perfect match. Bobbie gave me his design principles, personas, and—most importantly—content. In return, he would get a prototype that would demonstrate how that content could be readable on any device; perfect for drumming up interest and investment.
The workshop went really well, and some great ideas came out of the brainstorming the attendees were doing.
A few months later, Bobbie and Jim put the project—now called Matter—up on Kickstarter. They met their target, and then some. Clearly there was a lot of interest in well-written original journalism on the web. Now they had to build it.
They got hold of Phil to do the backend so that was sorted but Bobbie asked me if I knew any kick-ass designers and front-end developers.
“Well, I would love to work on it,” I said. “So how about working with Clearleft?”
“I didn’t think you guys would be available,” he said. “I’d love to work with you!”
And so we began a very fun collaboration. Paul moved his desk next to mine and we started playing around with the visual design and front-end development. Phil and Bobbie came by and we hammered out design principles, user journeys, and all that fun stuff.
It was really nice to work on a project where readability took centre stage. “Privilege the reading experience” was our motto.
Paul did some fantastic work, not just on creating a typographic system, but also creating a brand identity including what I think is a really great logo.
I started putting together a system of markup and CSS patterns, using the device lab to test them. Phil started implementing those patterns using Django. It all went very smoothly indeed.
Today is launch day. Matter is live. If you backed the project on Kickstarter, you’ve got mail. If not, you can buy the first issue for a mere 99 cents.
The first piece is a doozy. It’s called Do No Harm:
Why do some people want to amputate a perfectly healthy limb? And why would any doctor help them?
If this is indicative of the kind of work that Matter will be publishing, it will definitely live up to its ambitious promise:
MATTER commissions, crafts and publishes unmissable journalism about science, technology and the ideas shaping our future.