Learning new things takes time. When our industry shifted from table-based layouts to using CSS for layouts, a large chunk of that discussion was devoted to increasing project timelines (and budgets). It wasn’t that CSS took longer; it’s just that we didn’t know as much about it. Ask those same people today to build a table-based layout, and they’ll tell you that it’ll take twice as long. We make time to accommodate learning what we don’t know; it’s only natural.
The same thing is happening now as our industry shifts towards building responsive sites by default. It’s not that responsive design inherently takes longer; we just don’t know as much about the nuances like performance and image sizes and resolution-independent graphics… yet.
For those of us serving clients, we defer the impact to the client. They deal with longer timelines and inflated budgets, all in the name of us learning how to build better sites for them. Though noble, it’s a bit unfair. In my own work, I’m continually looking for ways to lessen the impact for my clients. Part of that means looking for ways to be faster without sacrificing quality.
I put a lot of effort into the process of art direction & design. I think a lot of responsive design looks like responsive design, because people and agencies are currently struggling with this. A great first step is to abstract the question; rather than trying to figure out what a site should look like as the major output of a design phase, focus instead on what a site should feel like. As we abstract the question, we innately abstract our deliverables. Full-page comps are designed to solve the question, "What should this site look like?" To solve the more abstract question, "What should this site feel like?" I’m pleased to see that we’re turning to abstract deliverables like style tiles, style prototypes, or—my personal favorite—element collages. But this stuff takes time too.
In an attempt to find something that was both faster to create and more quickly show a client, I realized that the process of creation from scratch was where most my time went, because it was the most difficult. This is how the Visual Inventory was born.
Established conventions are a crucial part of design that’s easy for people to interact with. Sure, there’s certainly opportunity to create something unique and unfamiliar, but a lot of the problems we deal with from project to project have been solved before, sometimes by you and sometimes by others. That’s why frameworks are so popular; they’re at their most useful when you come up against the same exact problem the framework’s designer encountered. Why not take the opportunity to inform your clients about how others have solved similar problems? At worst, you’re taking stock of the rest of the industry is doing, and at best, you might even find influence for a solution that otherwise wouldn’t have occurred to you.
Any seasoned designer will tell you that the first round of designs are intended to raise more questions than provide answers. What if I could cut straight to the questions? Pairing those questions with visual aids could certainly help to reinforce the point.
When kicking off with a new client, a big part of my personal notes focus questions I’m eager to explore with them. A lot of these are questions about design: colors, typography, conceptual direction, and more. Within a day or two, I can collect these questions into a format that gets the conversation about design started.
Last year, SuperFriendly did some work with our friend Garrett Dimon to help him establish a new design direction for Sifter, his issue-tracking product (new site coming soon). Here’s the visual inventory we sent over to him:
We asked questions like, "Could case studies be the driving metaphor for the site?" and "Is Sifter’s brand strong enough to support a monochromatic approach?"
Garrett, being the smart and thoughtful guy he was, gave great feedback like…
One day and two Basecamp comments later, we had a conceptual direction and a visual range to explore. That kind of actionable output has previously taken me three weeks and three concepts to get to, two of which would have been thrown out. I’ll still do multiple concepts now, but they’ll more likely be iterations and variations of each other that actually encourage “frankensteining” rather than being wildly different and independent.
Of course, getting valuable—and, more importantly, actionable output from this kind of process is dependent upon both parties trusting each other enough to have honest communication. I’m sure some naysayers will say that some clients don’t have the capacity to understand this kind of abstraction, but that’s a problem of choosing the right clients, not one of proper deliverables.
If you’re interested in moving more nimbly in your design process, I encourage you to give a Visual Inventory a try. You can download the simple template to get you started in creating one for your clients, but do take some liberties and make it your own.
And please report back with your findings if you do decide to try it. I’d love to know where you end up.
By downloading, you accept these terms.
Short version: you can use this for personal and commercial use, but you can’t resell it nor can you blame me if anything goes wrong.
Article Info