I love this back and forth between Brad and Jonathon. I think they’ve both got some good ideas:
- I agree with Brad that you can start marking up these kind of patterns before you’ve got visual designs.
- I agree with Jonathon that it’s often better to have a generic wrapper element to avoid making assumptions about which elements will be used.
The story of Science Hack Day …as told in the Proceedings of the National Academy of Sciences of the United States of America!
(a PDF version is also available)
The life cycle of a Service Worker—with all its events and states—is the one bit that I’ve never paid that much attention to. My eyes just glaze over when it comes to installation, registration, and activation. But this post explains the whole process really clearly. Now it’s starting to make sense to me.
I think Tyler’s onto something here:
I noticed three qualities that recurred in different combinations. Without at least two, the projects seemed doomed to failure.
I certainly think there’s a difference in how you approach a pattern library intended as a deliverable (something we do a lot of at Clearleft) compared to building a pattern library for an ongoing ever-evolving product.
Story of my life:
I have to confess I had no idea what a technical leader really does. I figured it out, eventually.
Seriously, this resonates a lot with what I find myself doing at Clearleft these days.
This beautiful poster could be the ideal decoration for your home or office.
You can download the original size (DIN A3) and print it to hang it on the walls in your office or wherever you want.
From twenty years ago, a look back at the origins of the internet, written by its creators.
I really like this list. I might make a similar one for the Clearleft office so what’s implicit is made explicit.
It’s ok to:
- say “I don’t know”
- ask for more clarity
- stay at home when you feel ill
- say you don’t understand
- ask what acronyms stand for
- ask why, and why not
- forget things
A lovely interactive demonstration of evolution, based on the original code Richard Dawkins used for Climbing Mount Improbable.
I know exactly how Tim feels. It’s hard not to feel guilty when you’re reading something instead of spending the time doing “real work”, but it always ends up being time well spent:
Reading time can be hard to justify, even to oneself. There is no deadline. It’s not going to move any immediate projects forward (most likely). And it often feels like a waste of time, especially if your interests are diverse. But it’s important. Most great work is the product of collaborative thinking.
Jessman5 on Twitter: “I made a poster from @adactio’s talk about Resilience. :) This took me way too long…”
I love this illustration that Jess made of my Resilience talk at the Render conference.
A brief history of lunar sci-fi.
No matter how much we want the science fiction dream to come true – and personally I would love it – the reality is that a lunar colony is very unlikely to ever be financially viable. It would be no surprise if we saw more expeditions to the moon, but all those wonderful visions of the high frontier recreated in space are more likely to apply to destinations with a better long-term future, like Mars, rather than the moon.
A new publication from MIT. It deliberately avoids the jargon that’s often part and parcel of peer-reviewed papers, and all of the articles are published under a Creative Commons attribution licence.
The first issue is dedicated to Marvin Minsky and features these superb articles, all of which are independently excellent but together form an even greater whole…
When the cybernetics movement began, the focus of science and engineering was on things like guiding a ballistic missile or controlling the temperature in an office. These problems were squarely in the man-made domain and were simple enough to apply the traditional divide-and-conquer method of scientific inquiry.
Science and engineering today, however, is focused on things like synthetic biology or artificial intelligence, where the problems are massively complex. These problems exceed our ability to stay within the domain of the artificial, and make it nearly impossible for us to divide them into existing disciplines.
This essay proposes a map for four domains of creative exploration—Science, Engineering, Design and Art—in an attempt to represent the antidisciplinary hypothesis: that knowledge can no longer be ascribed to, or produced within, disciplinary boundaries, but is entirely entangled.
The designers of complex adaptive systems are not strictly designing systems themselves. They are hinting those systems towards anticipated outcomes, from an array of existing interrelated systems. These are designers that do not understand themselves to be in the center of the system. Rather, they understand themselves to be participants, shaping the systems that interact with other forces, ideas, events and other designers. This essay is an exploration of what it means to participate.
As our technological and institutional creations have become more complex, our relationship to them has changed. We now relate to them as we once related to nature. Instead of being masters of our creations, we have learned to bargain with them, cajoling and guiding them in the general direction of our goals. We have built our own jungle, and it has a life of its own.
There is one truism that has been constant throughout my career on the web, and it’s this: naming things is hard.
Trent talks about the strategies out there for naming things. He makes specific mention of Atomic Design, which as Brad is always at pains to point out, is just one way of naming things: atoms, molecules, organisms, etc.
In some situations, having that pre-made vocabulary is perfect. In other situations, I’ve seen it cause all sorts of problems. It all depends on the project and the people.
Personally, I like the vocabulary to emerge from the domain knowledge of the people on the project. Building a newspaper website? Use journalism-related terms. Making a website about bicycles? Use bike-related terms.
Continuing the topic of public speaking, Jenn has a really good technique for figuring out how to arrange the pieces of your talk without getting bogged down in designing slides.
Lena’s in-depth run-down of how she puts together a conference talk. If you’re new to public speaking, this is well worth reading.
Bootstrap is a product of Twitter. If you want your team to work like Twitter’s team, then by all means use Bootstrap. Pick up their design language. Their tool chain. Their decisions. Don’t be surprised when it feels off every time you use it. It will.
The same goes for Material Design. Foundation. These are all products built by other teams to work for their process. Their structure.
Finding the right tool is not what I am advocating for. Making it is.
This is useful if you’re making the switch to HTTPS: choose your web server software and version to generate a configuration file.
Here’s an interesting approach to making comments more meaningful:
Instead of blindly publishing whatever people submit, we first ask them to rate the quality and civility on 3 randomly-selected comments, as well as their own. It’s a bit more work for the commenter, but the end result is a community built on trust and respect, not harassment and abuse.
A superb illustration of why playing the numbers game and dismissing even a small percentage of your potential audience could be disastrous.
Dividing the world in two.
Hillary, legendary for being the first to scale Mount Everest with teammate Tenzing Norgay, was on board, and Armstrong was, too, saying he was curious to see what the North Pole looked like from ground level, as he’d only seen it from the moon. Astronaut problems.
A beautiful bit of design fiction.
Marc and I have chatted before about the challenges involved in arranging the flow of talks at a conference. It’s great that he’s sharing his thoughts here.
Sounds like a cute idea, right?
In fact it’s the best thing you’re ever likely to read on Peruvian ursine immigration.
A vision of humanity’s exploration of our solar system.
Continuous partial City And The City, courtesy of James.
Those of us who reside on the “right” side of fixed, physical borders seem to cross the electromagnetic border every day, whether overtly, by entering the right passwords and credit card numbers, or covertly, as when using VPNs to watch TV programs viewable only in other territories. Those on the “wrong” side are subjected to a different but analogous battery of tests, intensifying at the physical border but often carried out far from it, in networked enclaves or foreign transit zones or aboard floating teleconference platforms in international waters.
It’s impossible to predict the creations that will spring forth when people gather in the spirit of participation, collaboration, and benign anarchy at the next Science Hack Day, but the results are certain to be inspired, and inspiring.
Beautiful visualisations of science and nature.
Made with love by a designer with a molecular biology degree.
I share the concerns expressed here about the “sizes” attribute that’s part of the new turbo-powered img element (or “the picture element and its associates”, if you prefer). Putting style or layout information into HTML smells bad.
This is a concern that Matt Wilcox has raised:
Change the design and those breakpoints are likely to be wrong. So you’ll need to change all of the client-side mark-up that references images.
I can give you a current use-case: right here on adactio.com, you can change the stylesheet …so I can’t embed breakpoints or sizes into my img elements because—quite rightly—there’s a separation between the structural HTML layer and the presentational CSS layer.
Wonderfully creative use of CSS gradients, borders, box-shadows, and generated content.
If you picked up the Guardian this weekend, you’ll have seen some brilliant work by Kyle on the cover (and inside) the magazine section.
Well, this is nice: the Line-mode browser hack has been nominated in the Best Collaborative Project in the Net awards.
But 24 Ways has also been nominated, and let’s face it, that really is the best collaborative project.
Lovely little graphics inspired by New York architecture.
Here’s a heartwarming tale. It starts out as a description of processing.js project for Code Club (which is already a great story) and then morphs into a description of how anyone can contribute to make a codebase better …resulting in a lovely pull request on Github.
Some examples to illustrate the UK Border Agency’s latest campaign.
This is quite remarkable. Now that the Galaxy Zoo project from Zooniverse has successfully classified all its data (already a remarkable achievement), its volunteers are now collaborating on writing a scientific paper.
There’s something going on here. This isn’t just a “cool” or “cute” link—this is the first stirring of something entirely new that is made possible by network technology.
Jason pulls together some of the themes that emerged at An Event Apart DC this week.
A beautiful eulogy for Doug Engelbart by Bret Viktor, not celebrating the laundry list of his inventions, but celebrating his intent in making the world a better place.
Engelbart had an intent, a goal, a mission. He stated it clearly and in depth. He intended to augment human intellect. He intended to boost collective intelligence and enable knowledge workers to think in powerful new ways, to collectively solve urgent global problems.
A really nice piece on Robert McCall, who was artist-in-residence at NASA and worked as conceptual artist on Kubrick and Clarke’s 2001: A Space Odyssey.
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.
This is the full text of Owen’s talk at the Responsive Day Out. It makes for a terrific read!
The latest Clearleft product will be like having an intensive set of discovery, collaboration, and exploration workshops in a box. Perfect for startups and other small businesses short on time or budget.
It starts in Spring but you can register your interest now.
The slides from Owen’s magnificent talk at the Responsive Day Out …but you really had to be there.
A collaborative writing tool built by a dream team. I’ve been using it for a while now and it’s very nice indeed.
James’s notes from the most recent Hack Farm show that, even without a finished product, there were a lot of benefits.
A really nice piece on scale, ratio and rhythms in web design.
Organized Wonder | Curated documentaries, interviews, short films, and other top videos from around the web.
This is like a video version of Huffduffer (without the timeshifting). It’s very nicely done.
This is so lovely! The story of Jessica and Russ’s romance, illustrated by fifteen of their friends.
Magazine covers created by Tom Southwell for background scenes in Blade Runner.
This is wonderfully random: illustrations used to illustrate patent applications but without the context.
Inspired by the recent .net magazine article on “20 leading web designers’ desks for your inspiration”, here’s a blog dedicated to the place where the real web design magic happens: the designer’s poostation.
These lovely doodles from Carla give me Fernweh for Germany.
Anton is a fantastic artist. Therefore, this graphic novel will be fantastic. Therefore, you should back the hell out of it.
This really is a ridiculously smart way of keeping third-party videos scalable in responsive layouts. I’ve just implemented it on this year’s dConstruct site.
How designing in the browser works for rapid iteration.
Yet another fantastic citizen science project from Zooniverse: Whale.fm.
You can help marine researchers understand what whales are saying. Listen to the large sound and find the small one that matches it best.
A responsively designed comic. Yeah, you heard me right. Responsive. Comic!
A very honest post from Meagan that I can relate to (and Jessica too, I suspect).
Now this looks like a fascinating project …and there’s a symposium happening in Florida at the end of September with Jill Tartar, Stewart Brand and more. I want to go to there.
What a great way to sell a book with “explorations” in the title—play around with the font size, leading, alignment (and browser window size).
Here’s one to add to Instapaper or Readability to savour at your leisure: Aaron Straup Cope’s talk at Museums and the Web 2010:
This paper examines the act of association, the art of framing and the participatory nature of robots in creating artifacts and story-telling in projects like Flickr Galleries, the API-based Suggestify project (which provides the ability to suggest locations for other people’s photos) and the increasing number of bespoke (and often paper-based) curatorial productions.
A handy little tool for quickly generating ratios (like the golden section) from a number.
This dovetails nicely with my recent post about the spirit of distributed collaboration. Here’s a great little bit of near-history spelunking from Paul, all about styling new HTML5 elements in pesky older versions of Internet Explorer.
A great way of supporting the best podcast on the planet: a limited set of prints by five designers, illustrators and artists. Grab yours quick before they’re all gone.
An excellent design technique from Samantha that allows you to nail down a visual vocabulary without using something as wishy-washy as a mood board or as rigid as a fully-blown comp. Brilliant!
The style tile is not a literal translation of what the website is going to be, but a starting point for the designer and the client to have a conversation and establish a common visual language.
Each weekday I find a headline on a major news site, and illustrate it without reading a word of the story.
I love watching an artist at work. Right after watching the accompanying video, I ordered a robot postcard from Anton.
Brendan giving one of the “inspired sessions” at last year’s Flash On The Beach one evening in the Brighton Dome.
An excellent piece of writing on the fundamental question of the web: Why Wasn’t I Consulted?
A well-written account of a disgraceful situation. "We all go down together, horses looming above us, baton blows still coming down on our heads and shoulders. I am genuinely afraid that I might be about to die, and begin to thumb in my parents' mobile numbers on my phone to send them a message of love."
A nifty idea to help you people save on postage by clubbing together to make a single Amazon purchase.
We need to make sure that Shaun Inman never discovers this site.
Stephen Johnson wrote a book. Frank Chimero did a doodle.
Colly shows the results of his dConstruct workshop: great stuff!
That unicorn is such a jerk.
Burnout is a bitch.
Matt Ridley's new book sounds like a corker.
An exercise in collaboration and perspective: let another designer touch your website while you touch theirs.
A beautiful call to arms against engineerism in design. Software cries out for love.
The companion website to Kevin Hoffman's IA Summit talk, this is a hugely valuable resource for an often-overlooked part of the design process: the kick-off meeting.
A web comic written by a 5 year old (illustrated by his father).
I want to frame this and mount it on my wall so I will see it every day.
I don't agree with everything in these vignettes but they make for an good, thought-provoking read.
A beautifully presented site wherein Ben and Frank endeavour to answer your design-related questions.
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.
"Messages in bottles, smoke signals, letters written in the sand; the modern equivalents are the funny, sad, beautiful, hopeful, hopeless, poetic posts on Missed Connections websites. Every day hundreds of strangers reach out to other strangers on the strength of a glance, a smile or a blue hat. Their messages have the lifespan of a butterfly. I'm trying to pin a few of them down."
All the chairs in Pixar's The Incredibles.
Ficlets is back ...as Ficly. Take that, AOL: this site is just too good to roll over and die.
An excellent piece by Stan in which he questions (without rejecting out of hand) applying proportion-based rules to the web, a medium with inherently fluid proportions.
An online animated spaceship and experimental aircraft art magazine. Gorgeous.