I don’t write meta-posts often, but enough has happened this year that I wanted to give you a quick update on what’s going on. In an effort to make sure I don’t get too verbose, I’ll stick to a few short bullet points.

• We recently made some slight updates to Elezea’s design. We removed the texture, cleaned up some things, switched to Droid Sans, and made the primary color a bit more orange. Most importantly, the site is now mobile-first and sports a fancy new off-canvas menu. Once again, I’m indebted to Alex Maughan for his amazing design and development work. High five, Alex.
• This year I joined The Syndicate and AdPacks.com. I was quite worried about the response, but you guys have been awesome. It’s a testament to the quality of the audience (and the ads) that they are quite happy with the return they’re getting from advertising on Elezea. I have a love/hate relationship with ads, but I like the tasteful way these companies approach things, so it’s been a very good fit.
• I’m currently finishing up a book on Product Management that will hopefully be published around March/April next year. If you’d like to get updates on what’s going on with that, you can sign up for the newsletter.
• I’m quite impressed by Flipboard Magazines, and have recently started posting a lot of the articles that Elezea is based on (and things that don’t make it on here) to a companion magazine I imaginatively call Elezea Magazine. Please check it out, and share if you like it. It’s a really great platform.

I think that’s it. This has been a really cool year for Elezea, and I look forward to 2014. I feel privileged that you have chosen to take this hike with me. Thank you.

P.S. While we’re talking about other things, allow me to brag a little bit about where I live. I took this last week on an early morning run. If you haven’t been to Cape Town, you should definitely put it on your list.

Lisa Maria Martin gives some advice on What To Do With Those Dreaded FAQs:

These all underscore FAQs’ fatal flaw: they are content without context, delivered without regard for the larger experience of the website. You can hear the absurdity in the name itself: if users are asking the same questions so frequently, then there is an obvious gulf between their needs and the site content. (And if not, then we have a labeling problem.) Instead of sending users to a jumble of maybe-it’s-here-maybe-it’s-not questions, the answers to FAQs should be found naturally throughout a website. They are not separated, not isolated, not other. They are the content.

We’re definitely in agreement about that. A while I go I wrote this:

Most users don’t know what FAQ stands for, and besides, it’s bad practice to answer questions outside the context people want to ask them in. Figure out where in the process each question in your FAQ might come up, and provide the answer right there within the flow. Don’t expect people to click to a different page to find the information they need.

By the way, 24 ways is a collection of fantastic design and development articles and tutorials for advent. If it’s not part of your daily reading yet, make it so!

There are a few pieces on the topic of what makes a design good that jumped out at me recently. First, I like this approach from Uday Gajendar in What is good design?:

So what is “good design”? It’s an attitude of design-driven excellence (from strategy to delivery), a process of iteration and creativity, a mentality of enabling humanistic achievement for people, and a value system grounded in excellence of craft with a magnanimous bent towards what’s best for customers: appropriate, empowering, delightful.

Jon Bell talks about “Of Course” Design:

When people try to design magical interfaces, they’re often aspiring for the “wow” moment, but that’s the wrong focus. Designers should instead be focusing on “of course” moments, as in “of course it works like that.” Most product design should be so obvious it elicits no response.

Finally, Randy Hunt implores designers to Stop Trying To Be So Damned Clever:

During the design process, you can easily want to surprise and delight the user. So you create a design element — an interaction pattern, a naming scheme, a symbol, and so on — that is fresh and extremely inventive. However, the cleverness of your creation obscures the intent of the product. And the cleverness of that first impression doesn’t hold up over time — and I don’t mean over years; I mean over only the first few moments of use. After that first rush of newness, if the intended value of the product is not clear, or the functional intent isn’t obvious, the novel idea means nothing.

All three posts are worth reading in detail for their different points of view that point to similar definitions of good design.

Thanks to Pencils.com for sponsoring Elezea’s RSS feed this week!

At Pencils.com, we believe that creativity is the greatest of all virtues. And, with our selection of unique, high-quality pencils, notebooks, and creative tools, we’ve got everything you need to unleash yours.

Whether you’re a pencil nut who knows all the brands (Caran d’Ache, Blackwing, Faber-Castell, we stock them all), or a casual doodler looking for something to inspire you, there’s something for you on Pencils.com. Combine that with our legendary customer service and fast, reliable shipping, and you’ve got some serious creative potential.

So, go ahead and read the story of the $40 pencil, learn about the pencil company that has been around since the French Revolution, and find the perfect notebook to capture your ideas. If you’re in the giving mood, we also have gifts for artists, writers, musicians, and anyone else on your shopping list.

Above all else, stay creative.

Sponsorship by The Syndicate.

Tim Caynes’ on exposure is an honest and accurate depiction of what it’s like to work at a design agency:

if there’s one thing that really hits home in your first 3 months of transition, it’s the change in pace. and it’s not that the change in pace is a bad thing. it’s just that it feels like you don’t have enough time to think. which means you don’t have enough time to design. which is stressful and surprising and difficult and awkward. because you might not actually be able to do it. you might fail. and everyone will be able to say they told you so. and you’ll be exposed.

And this:

be under no illusion, when you work for an agency, your constraint is time. but your reputation is all about quality. so quality is, and should be, ruthlessly monitored, evaluated, and understood. and that’s why the integrity of design and design thinking is the first thing that you will get caught out on. well, apart from the pace thing. but it’s not personal. even though that’s what it feels like the first few times someone like me sits down with you, looks at your designs and pulls that horrible squinty patronising-but-really-caring face that tells you there’s something not quite right.

This post hit home for me in so many ways.

Fracture prints your photo in vivid color directly on glass. It’s a picture, frame, & mount all in one.

It’s a modern, elegant, and affordable way to print and display your favorite memories. Your print comes with everything you need to display your photo, right in the durable packaging.

Fractures come in a variety of sizes and prices, starting at just $12, with free shipping on orders of $100 or more.

Fracture prints make great Christmas gifts and are the perfect way to fill up empty walls in your new home or apartment. Check it out.

Sponsorship by The Syndicate.

As I saw the tweets about Jared Spool’s talk at Warm Gun fly by, I hoped that someone would do a write-up because it sounded really interesting. I didn’t expect Forbes to come to the rescue, but hey, hell froze over! Anthony Kosner does of good job of distilling Jared’s main points in How Design And User Experience Translates To The Bottom Line:

In UX Strategy Means Business, Spool clued a room full of designers and developers into the five business priorities that they must consider as the ultimate goals of their efforts. Yes, as a designer you must be the strong voice for aesthetics and some of the more subtle aspects of user experience, but your bosses need something more concrete to respond to.

And yes, you’ll have to click through (and dismiss the ad, ugh) to see those five business priorities.

The fifth and final Build Conf looks like it was, once again, a fantastic conference for web designers. The talks are still coming out, but so far there are two that really stood out for me. The first is Paul Soulellis’s Resistance — a fantastic essay on what an act of resistance looks like in design culture today:

I worry that this tendency to dismiss on the fly — as well as accumulating approval — might push us to make things for their ability to go viral. Designing for the showcase and rewarding smooth, easily digestible stories has become a kind of professional “code,” and I think this is where it gets dangerous.

Because some see it as permission to favor the quick fix of image-making over complex problem-solving. How many times have you been asked to build the site in a week. To design the logo in two days. To send files, right now. Somehow, we’re becoming a culture that values performance and instant product over presence.

Frank Chimero’s What Screens Want is another absolute must-read — one of the best essays of 2013. Frank goes on a journey to find the essence of digital design:

A designer’s work is not only about how the things look, but also their behaviors in response to interaction, and the adjustments they make between their fixed states. In fact, designing the way elements adapt and morph in the in-between moments is half of your work as a designer. You’re crafting the interstitials.

Both of these essays not only contain thought-provoking ideas, they’re also beautifully designed. Do yourself a favor and spend some time reading through both.

By now it’s been well drilled into our heads that web design starts with content, not with graphics. However, in practice, getting real content before the design process starts is challenging at the best of times, and it’s made even more difficult by the fact that we have to try to get to content parity across all types of devices.

So to deal with this complexity we come up with more pragmatic guidelines. Mark Boulton’s “Structure First. Content Always.” is certainly a more realistic approach:

You can create good experiences without knowing the content. What you can’t do is create good experiences without knowing your content structure. What is your content made from, not what your content is. An important distinction.

So you have to start with the structure not the words. […] How do we design around the fluidity? Well, we define structure; of our content, and the templates that content inhabits. We define the rules of the system to display the content in different ways (if we can) to help the reader understand the content better.

The problem with all these approaches has always been the same for me: It sounds awesome in theory, but I don’t know how to make it part of our workflow when we’re in the weeds with client work. So we tend to try to make physical things that help us get there1. First we created expanded customer journey maps to define a content plan based on user needs and personas.

That helped a lot, but on the next project we got stuck on content structure again — how do we create different page templates with different types of content, without getting into interaction design too soon? So we came up with the idea of Content Modules: diagrams that show the relative importance and length of different types of content, in a Mobile First context. Here’s an example:

This document has a few key components:

• Each block outline represent a distinct content chunk that can be used on any other page.
• The primary call to action is highlighted (in orange in the example above) so that we can easily check for consistency and impact across different pages.
• Some pages will have optional modules — those are also highlighted (in yellow in the example above).
• A gap in a column doesn’t mean there’s going to be empty space on the page. This is not a layout diagram. It just shows the relative importance of each chunk. It also allows one to easily compare which page templates have which types of content on the page. This lets you easily spot if there’s some missing content (or unneccesary duplication).
• Each page template looks like a mobile view. That’s by design. It helps us to move straight into designing mobile views first, using the content hierarchy defined in the document, and then scale that up to larger views.

Creating content modules was the missing step we needed to bridge the gap between the content plan in our expanded customer journey maps, and starting the interaction design / prototyping phase. I was constantly worried that we’d start projects with content at the centre, but then gradually backslide into old ways as the project progresses. This document helps us to move seamlessly from content planning to interaction design, confident that we’re designing on the right content-led foundation.

---

1. I’m really trying to avoid the word “deliverables”, but I’m struggling. ↩

Brad Frost’s article on the Techcrunch redesign is a great case study of a modern responsive design process. A few things stood out for me, and remain open questions that I wish I could ask Brad about.

First, there is no mention of user research. There was a kick-off meeting, with some Design Studio work, but how did they identify user needs, and why was there no user testing on their prototypes? That’s a bit perplexing.

Second, it’s really nice to see Brad take a more nuanced stance on the whole Post-PSD Era thing, and admit that comps can be useful under the right circumstances:

Believe it or not, we did indeed create a few full comps. Gasp! Horror!

But the difference between this and all the other projects I’ve ever worked on is that we didn’t lead with the comps. By the time Dan made some comps (for the homepage and featured article page), we had established many of our key molecules and organisms, and had an understanding of the systematic nature of our design.

That’s how we do it in our agency as well, so I’m glad to find out that we’re not completely insane.

And lastly, it would’ve been great to get a little more detail on how much backend developers were involved through the process. Brad mentions it briefly:

From the design end of things, Dan went through and created an incredibly detailed list of minor design tweaks that tightened things up and got things ready for final delivery to be implemented into their WordPress backend by the fine folks at 10up (who by the way were involved throughout the course of this process).

“Final delivery” and “were involved throughout” are two phrases that don’t sit very well together, so I wonder how that worked practically.

Don’t get me wrong — this is a great process, and they obviously got some impressive results. These are just some things I wondered about as I read through the case study.