Posts

Destroy the Web 2.0 look: Web design trends 2012

Have witnessed a de-shinification of the Web, with fewer glass buttons, beveled edges, reflections, special-offer badges, vulgar gradients with vibrant colors and diagonal background patterns. The transformation has been welcomed with relief by all but the most hardened gloss-enthusiasts. However, design and aesthetics work in mysterious ways, and no sooner does one Web design trend leave us before another appears.

The Symptoms

So, exactly what is this new epidemic? Well, let’s start by looking at some of the most common symptoms, many of which you have probably noticed. They are easy to spot, and as with many other conditions, they often appear in conjunction with each other. (This is why the contagion spreads so effectively — seemingly independent symptoms grow more infectious when combined with others.)

Please note: The following list appears in no particular order and does not indicate the level of infectiousness or severity, which seem to be stable across the board. Note also that the instances given often exhibit more than one symptom, making classification more difficult.

Stitching

Stitching appears gradually, often as a result of the designer playing too long with borders and lines, particularly of the dotted variety. A full-blown stitch is evidenced by the subtle shift from dots to dashes, augmented by drop shadows and other effects to give the impression of 3-D. The purpose of the stitch is somewhat elusive, but it seems to thrive in environments where certain textures are applied, most notably fabric and leather, but also generic graininess.

While determining the exact cause of stitching is difficult, scientists are certain that it belongs to a larger strain of the infection known as “Skeuomorphism.”

Collage of interfaces with stiches
Clockwise from top: The Journal of Min Tran; Dribbble shot by Mason Yarnell; Dribbble shot by Liam McCabe.

Zigzag Borders

Borders are common elements of Web design, and as such, they are difficult to avoid; luckily, they are usually harmless and often have a positive effect on the layout. However, for some reason, a particular type of border — the zigzag — has grown exponentially in the last few years and is now threatening the natural habitat of more benign border specimens. Exactly why this is happening is unknown, although some researchers claim that the pattern created by the repeating opposing diagonals has such an alluring effect on designers and clients alike that straight borders have somewhat lost their appeal.

Collage of interfaces with zigzag borders
Clockwise from top: You Know Who; Dribbble shot by Christopher Paul; Dribbble shot by Meagan Fisher.

Forked Ribbons

Like borders, ribbons have long existed in various forms. What we’re seeing now, though, is the near dominance of a particular style of ribbon, easily identified by a fork at one or both ends. Some ribbons are also folded over twice, creating a faux effect of depth and reinforcing the diagonal lines in the fork. Whether the fork is related to the zigzag effect is unknown, but it seems that diagonal lines are the key to the ribbon’s survival, along with its ability to evoke memories of times past.

The danger of the ribbon lies mainly in its ability to exist independent of other symptoms (although it thrives in the company of vintage typography), meaning that it could date your design long after the epidemic ends, even if the symptom itself appears dormant. In many ways, this is reminiscent of the “special offers” badge of the Web 2.0 look.

Forked ribbons
Clockwise from top: Ryan O’Rourke; Cabedge; Jake Przespo

Textures

In the age of all things digital, it’s a conundrum that textures should dominate our illustrations and backgrounds, and yet they are indeed one of the most common symptoms on our list. Manifested by subtle grain, dirt and scratches, paper-esque surfaces and fold marks, they seem to embrace the spirit of the handmade. But ironically, they’re often the complete opposite: computer-generated effects or Photoshop brushes.

Possible explanations for the widespread use of textures include a yearning for tactile media (especially considering the emergence of touchscreens) or envy towards print designers, who have a much richer palette of materials and surfaces to play with.

Textures
Clockwise from top: Gerren Lamson; Zero; Amazee Labs.

Letterpress

The simple effect has gone from strength to strength and is now a household technique for sprucing up typography online. A relatively harmless symptom, letterpress might also have infected designers through other digital interfaces, such as operating systems and games, as early as the turn of the millennium, indicating a very long incubation period.

Scientists disagree over whether the incubation period is due to the infection needing a critical mass before emerging from dormancy or whether the infection simply needed the right conditions — CSS3 text shadows, to be specific — for symptoms to appear.

Letterpress
Clockwise from top: Billy Tamplin; Dribbble shot by Phillip Marriot; Remix.

19th-Century Illustration

After being released from copyright quarantine, this symptom, favoured by fashionable ladies and gentlemen, was nearly eliminated during the last epidemic due to its inability to cope well with gloss and shine. But in this new vintage-friendly environment, it has found its way back into our visual repertoire. For better or worse, the 19th-century illustration will most likely hang around for a while, emerging stronger from time to time like a flu virus.

19th Century Illustration
Clockwise from top: Killian Muster; Dribbble shot by Trent Walton; Simon Collison.

Muted Tones

After a long period of vibrancy, the average online color scheme seems to have been somewhat desaturated across the board. We’re seeing widespread use of browns, earthy greens and mustards and a general leaning towards “impure” colors, although this is generally thought to be a minor symptom of the epidemic. Some scientists will even argue that muted tones are, in fact, not a symptom themselves but rather a side effect of other symptoms, in the way that sweating is a natural response to a fever.

Muted colours
Clockwise from top: Dribble shot by Dave Ruiz; Cognition; Web Standards Sherpa.

Justified or Centered Typography (JCT)

This symptom is nothing new; in fact, it was pretty much the standard for the first 500 years of typography, until Tschichold and the New Typography showed up and quarantined it on the grounds that it was old fashioned, difficult to read and inefficient. Although we’re not sure at this point, this link with history might be what has made JCT reappear so vigorously under the umbrella of vintage symptoms. We do know that overall reading habits among humans have not changed in recent years (most Westerners still read left to right), and there is no plausible argument that JCT improves legibility; so, whatever the cause of the outbreak, we know it’s rooted in subjective emotion rather than rational thought.

Justified or centered typography
Clockwise from top: Grip Limited; Tommy; Visual Republic.

Circular Script Logotypes (SCL)

A circle is a basic shape and, in isolation, is no more a symptom of an epidemic than a triangle. However, if you repeat enough triangles in a line, you get a zigzag. Similarly, if you include a circle in your logotype, you end up with a circular logotype. And if that logotype happens to be set in a script font, you’ll get — that’s right! — a Circular Script Logotype (SCL). Not that SCL is lethal or anything, but it is relatively contagious and can be highly detrimental when enough hosts have been infected.

Circular script logos
Clockwise from top: Trent Walton; Mercy; Dribbble shot by James Seymor-Lock.

Skeuomorphic Features

Skeuomorphic features — i.e. ornamentation or design features on an object that are copied from the object’s form in another medium — are rife, particularly in mobile applications, and this symptom is one of the defining indicators of the epidemic. Possibly a mutant cancerous strain of mildly skeuomorphic features such as stitches and letterpress, it can sometimes grow to overtake an entire interface, bloating it with redundant visual references to physical objects and materials. However, due to the labor involved in preparing the graphics and the heavy reliance on image resources, some researchers argue that we’re unlikely to see full-blown skeuomorphism dominate our desktop browsers any time soon.

In fact, most scientists regard the phenomenon as a curiosity and predict that some virtual metaphors for physical attributes will prove useful (as tabs have) and some won’t. Interestingly, while Apple has embraced and continues to pioneer the technique, Google seems to some degree to resist the urge to mimic physical reality in its interfaces. Perhaps it has developed a vaccine?

Skeuopmorphic
Clockwise from top: iBooks; Dribbble shot by skorky; Dribbble shot by Igor Shkarin.

How Did It Start?

Pinpointing the epicentre of a design epidemic (read: trend) is always hard, especially given the myriad of symptoms and the contagious nature of the Internet. Identifying Patient Zero is virtually impossible, and, to be pragmatic, doing so would serve no purpose. What we can say is that we’re most likely experiencing a reaction to the Web 2.0 aesthetic — a craving for textured surfaces and retro imagery, something tactile and natural-looking, as an antidote to the shiny impersonality of the past — and that this is both healthy and necessary for pushing the design industry forward. Whatever the sources of trends, they often start with applying smart design to solve a particular problem or, indeed, to counter another trend.

Let’s say that everyone used sans-serif fonts, strong contrasting colors and crisp white backgrounds as a rule. Imagine, in this environment, if a designer went against the grain by using Clarendon or some other warm serif to infuse some personality into their website (which happens to be selling “Grandma’s homemade jam”), and then complemented the personality of their font selection with earthy colors and some brown paper textures. The result would inevitably stand out from the crowd: beautiful, emotional, different.

Incidentally, this aesthetic inspires another designer who happens to be working on a website with a global audience, exposing the new approach to a whole generation of designers who, in turn, apply it at will (often without considering the context). A trend is born. And yet, paradoxically, the potency of the epidemic is under constant threat. The more people get infected, the less differentiated the symptoms appear; and once the infection reaches a critical mass, the symptoms begin to work against themselves. Infusing personality into your visuals is meaningless if everything looks the same.

Is It Dangerous?

In today’s open collaborative world, avoiding an epidemic of this scale is difficult; so, in a sense, everyone is affected to some degree. The symptoms listed above are not restricted to small-scale up-and-coming designers, but affect even the elite of the design community. This means that even though some symptoms are harmless — like a light fever or a runny nose from a flu infection — the viral onslaught of trendy features puts constant pressure on our immune system to protect our creativity, and staying vigilant is important to maintaining a healthy dose of original thought.

If you’re displaying a handful of symptoms, it’s really nothing to worry about — catching a cold that’s going around is not hard, but recovering from it is also easy. If, on the other hand, you display most or all of these symptoms, then there’s reason to be extra cautious in your next project. Using all of a trend’s identifiers as cornerstones of your work might make your portfolio look oh so contemporary, but in a way this practice is no different than passing off the work of your favorite designer, artist or musician as your own. Granted, symptoms with no identifiable origin are not protected by copyright, but that’s beside the point — you should be worried not about legal implications, but rather about the creative integrity of your output. The danger is not only that your work will be seen as a passing fad, a popular aesthetic that will look dated in a couple of years’ time, but that you will lose the respect of your peers when they catch on to you.

While nothing is original, we all need to respect the difference between inspiration and imitation. As Jean Luc Goddard said, “It’s not where you take things from — it’s where you take them to.” And if you don’t take them anywhere, what’s the point?

Worse perhaps than the loss of respect and integrity is the effect that epidemics have on clients and, in turn, the design community as a whole. The more designers are infected and the more symptoms they show of the same disease, the less your clients will believe that you’re capable of solving real business problems. Eventually they’ll exclude you from the early stages (where all the real design thinking takes place) and employ your services merely to skin their wireframes, in the process reducing the whole profession to an army of decorators.

What Can You Do About It?

Now that we’ve seen how detrimental trends can be, how does one avoid them? Is this even possible? Trends, by definition, are popular, and arguably nothing is wrong with tapping into that popularity to increase the exposure of your product. Convincing a client to accept a design that is off-trend can be difficult, and you run the risk of alienating the audience by going completely against the trend just for the sake of it. On the other hand, blindly following others is never a good idea, and you could severely stifle your creativity, integrity and client base by accepting what’s “in” as a given and copying it without purpose.

So, what’s the right thing to do? Trends are intrinsic to our society, whether in politics, culture, design or even religion, and as the consensus sways in one direction or another, so will your opinion (or “taste”) — to some degree, at least. Alas, avoiding trends altogether seems an impossible and pointless undertaking, but that doesn’t leave you powerless. In fact, you can do a host of things to combat the lemming syndrome.

Ask Why

Always question your design decisions (and make sure they are your own), and keep asking the magic question, Why am I doing this? Am I doing this simply because it looks cool or because it suits the message I’m trying to communicate? Why am I using this ribbon? Does the zigzag border add to or detract from the personality of the website? What does this leather texture have to do with the finance app I’m designing? The moment you stop asking questions, you fall prey to the epidemic.

Put Some Effort In

In his article “The Dying Art of Design” Francisco Inchauste asserts, among other things, that inspiration requires perspiration, and I couldn’t agree more. I was lucky enough to attend a college where no computers were allowed in the first year, which meant we had to use physical tools to express ourselves — tracing letters by hand, drawing our photography, stocking up on Pantone pens (remember those?), abusing the copier. Not only did our creativity grow, but we learned an important lesson: good design is not effortless, and the best results come from your own experimentation.

Try Something Different

Remember that being distinctive is, for the most part, a good thing. Most great artists in history, regardless of their field, stood out enough for the world to take notice. Who painted melting clocks before Dali? Who would have thought to build a huge wall on stage before Pink Floyd? While mimicking what’s popular might be comfortable and might secure short-term victories, long-term success requires a unique, memorable approach.

Diversify Your Inspiration

In order to remain creative, staying curious and looking for inspiration all around you is crucial, not just in the latest showcase of fashionable WordPress themes. Read a book, perform a scientific experiment, listen to music you haven’t heard before, walk through a new neighborhood, or experience a foreign culture. Widening your horizons beyond your favorite websites and finding more than one source of inspiration is critical to making original, lasting designs.

Focus on the Basics

Finally and most importantly, study the underlying principles of design in order to understand what is and isn’t defined by style. Grid systems, contrast, legibility, juxtaposing imagery, well-written copy — these are the key components of successful design, yet they are entirely independent of fads and styles.

At the end of the day, design is not so much about style as it is about communication, and all style, imagery and typography should be inspired by the content, functionality and personality of the product, not by what simply looks cool at the moment.

No matter how cool something looks, it too shall pass.

Ideas how to create fluid content and design

The words and pictures depend on each other for completeness. Web designers can employ the same complementary dependence of graphic and text in their own work. It encourages a sense of belonging and can create strong first impressions, which are often essential to effective Web design. Because Web design is not confined to page-by-page display as storybooks are, we’ve got no excuse for neglecting Curt Cloninger’s assertions that a design “has to somehow be relevant to the content, accurately representing its purposes in the medium,” and that “the content has to be useful to the site’s audience.”

This post explains four strategies for improving fluidity of content and design, and we’ll gauge the effectiveness with which several websites use these strategies, taking special note of what we can learn from Sendak’s Where the Wild Things Are.

With Graphics As Your Witness

When editing critical papers during my undergrad, I was constantly mindful of backing up every claim I made in writing. Describing a protagonist as “yearning for a return to childhood” wasn’t enough to convince a professor unless I could refer to a passage where this was suggested.

Though published way back in 1997, Jakob Nielsen’s analysis in “How Users Read the Web” still offers a storehouse of relevant advice about how users gauge legitimacy online. He suggests that when businesses use promotional language online, they create “cognitive burdens” on their users, slowing down their experience with the website, triggering a filter by which they weigh fact against fiction.

Instead, use design to complement or convey self-promotion, easing user skepticism from the get-go.

Makr Carry Goods effectively “backs up” its content with graphics to convince users of the “news”-worthiness of its work. In the example below, the visual promotion of the products complements the text: without having to scroll over the images, we see the products themselves as being the news.

Mark Home

Scrolling over the images on top reveals the textual “news”:

Mark hover

From there, users can carry on their visual journey through the Mark Carry catalogue, enticed to read on by the persistent connection between the product and the news section, a connection that compels users to explore further.

Key to this graphic-textual connection is the visual quality of the products themselves. Without the clean white presentation and professional style, the visuals here might fail to suggest a connection with the news. But the products have been presented to impress.

Without engaging visual confirmation, content will often fail to persuade.

Take Mark Hobbs’ professional website:

Mark Hobbs

He claims that he’s “not normal.” He’s “extraordinary… adaptable, loyal, ambitious and an Eagle Scout,” and he’s “like a sponge” (among other things). If he were getting points for descriptiveness, Hobbs would take first place. But he’s got no visual evidence of any of these claims. No hint at this lack of normalcy.

Besides, as Nielsen’s studies suggest, users generally dislike “marketese”: writing that is boastful, self-promotional and full of subjective claims. Then again, should claiming not to be normal be considered a boast?

Mark’s claims could have been justified by an impressive and immediate visual display of his past work. Engaging users with the strict facts of his expertise could have reinforced his textual claims.

Consider the home page of Rally Interactive:

Let's Go Rally

It is “here to help you build digital things.” We know this because of the two immediate examples of its work, presented in triangles that recall other projects that required exceptional skill: the pyramids.

Rally’s folio effectively demonstrates a strategy of fluid content and design. The firm backs up its claim and provides users with an immediately useful and positive association. The visual and verbal prompts coalesce to convince users of Rally’s expertise.

Going back to Where the Wild Things Are, if Sendak hadn’t included visuals of Max’s misdoings, what sympathy could we gain for him as his mother sends him up to bed? We can interpret his “mischief” any way we choose, but Sendak’s visual direction helps us gauge what kind of protagonist (or antagonist) Max will be for the remainder of the story. Verbal prompts simply wouldn’t cut it.

Fluid content and design reduce the user’s search time and, in this case, justify the claims made textually. Users don’t have the time or willingness to hunker down and read, particularly when looking for a service. Fluid content and design convince users of the truth of a claim before they even begin to question it.

Tighten Up

Once you’ve eliminated any refutable claims, you might find your content looking a bit sparse. In fact, you want it naked: easy to scan and to the point.

Christine Anameier’s article “Improving Your Content’s Signal-to-Noise Ratio” points us in the right direction for creating tight content that isn’t afraid to depend on suggestive design to share the workload.  There will always be information that the user cannot process visually. So, what should you put in text?

Anameier suggests segmentation, prioritization and clear labeling to make the most of your content.

Segmentation

Segmentation entails sectioning content on the page according to audience or task.

The home page for Jessica Hische’s design portfolio does this effectively:

Jessica Hische

The home page targets the specific needs of users. Hische has divided the links to her services according to what particular users will be looking for, sparing us long descriptions of each service.

Hische also spares us a textual description of the quality of her service, instead pairing tight layout of text with sprawling, confident design. We can gather from the background a sense that she has clean organization. The orange ribbon font “welcomes” us and puts us at ease so that the text doesn’t have to.

Prioritization

Prioritization, as Anameier says, requires that you “understand your audiences and their tasks, and decide what your website is trying to do.” Structure your website to reflect these tasks, removing any content that strays from the path. Hische’s home page demonstrates a comprehension of her users’ purpose for visiting the website, and it wastes no words.

Content and design fluidity entails deciding what should be explained textually and what should be demonstrated graphically. Hische does not verbally boast about her quality of service. The design does that for her, conveying an array of positive attributes, from classic taste to proficient organization.

Hische recognizes that the first priority of users is not whether she’s any good, but whether she offers what they need. Once that is clarified, users will look into the quality. Keyword: look.

Creating those fluid user experiences in which content and design cohere requires, as Mark Boulton states in “A Richer Canvas,” “text that feels connected to the physical form in a binding manner that should make it invisible.” Anameier herself says that incorporating “specific and accurate link text, page titles and headings” gives users the luxury of perusing graphic elements on the page without being disrupted by navigation obstacles.

Labeling

Labeling that is structured with the user’s goals in mind will be trim and to the point, “invisible,” as Boulton suggests, so that the visual showcase enjoys some attention, too.

Tight content that follows Anameier’s guidelines will visually suggest your service’s qualities and attributes strongly. The description of the service itself will rely heavily on text, but what sets your service apart from others can be conveyed visually. Creating cohesive visual and textual discovery paths for users replicates that same sense of control that users get from the storybook.

Doodle Pad superbly utilizes segmentation, prioritization and clear labeling on its “About” page:

Doodle Pad

Carrying over the sketch-book theme to its visuals, Doodle Pad sets down user goals with clarity, displaying information directed at clients and creative professionals.

The labelling is clear and styled with familiar doodling motifs that show the user where to look for what they need. Key questions are answered, and the word count is not too shabby for a software concept.

Impressively, Doodle Pad connects the imagery and layout to the overall concept without over-informing or weighing down users with elaborate language. It gives us notebook-style notes for a notebook concept: tight and user-friendly.

Check The Narrative Voice

t

Curt Cloninger’s article “A Case for Web Storytelling” argues for narrative voice as being an essential consideration for Web designers who want to create engaging user experiences.

Designers are at a great advantage when it comes to synthesizing text with graphics. We can create a rich narrative tone that convinces and directs users. We are able to explore and experiment with the Web’s possibilities, going beyond Where the Wild Things Are and celebrating non-linear narratives, incorporating several kinds of interactive media.

With Web design, narrative voice need not stay put in the text. It’s more flexible that in storybooks, and Cloninger encourages us to play with that.

For instance, look at the layout for MailChimp 5.2. Toying with slogans that would look out of date on another Web page, the designers evoke nostalgia with their use of background images, color and typography, elements ripe with narrative potential:

Mailchimp Retro

Viewers interpret the slogans the right way because of the text’s ironic connection to the design. The “real people behind all those email addresses,” is a wink from the designers, because the viewers recognize that the “real people” in the background don’t look very “real” at all.

Users will commit to a fluid narrative online if the design fully commits to the content. And as Cloninger says, using narrative voice through Web design presents countless possibilities for exploration.

MailChimp explores one such possibility with its demo video, complete with more “wholesome” design and content:

Mailchimp Retro 2

Users can expect to be led on this retro journey through the other formats for narrative voice, as the video suggests with its old-school film-reel introduction.

The narrative voice is so woven into the content and design that MailChimp 5.2 could offer all kinds of 1950s-terrific claims and users would be moved to follow along.

MailChimp 5.2 experiments with tailoring content and design to a narrative voice, but it is effective because of its consistency. If it hadn’t committed to a particular narrative style, then the escapist spell of this user experience would have been broken.

Greentea Design

Green Tea Design has chosen a watery, traditional Japanese-inspired design for its website. A geisha shades herself with an umbrella, looking down meekly, making for a quiet non-confrontational effect. But look at the aggressive text: “We don’t design wimpy websites that get sand kicked in their face by the competition.” The text goes on the offence, but the design doesn’t align with or enhance the narrative voice.

Try this: choose one adjective with which you’d like users to describe your website. Affix a sticky note of this adjective to the top of your monitor, and measure every sentence on your website against this adjective. Ask yourself whether the content aligns with the adjective. Now pour over your design and assess it by the same measure. We’re looking for matching sensibilities. Does your content and design align with how you want users to feel about the website?

In Where the Wild Things Are, the narrative tone is the anchor in Max’s hectic journey. Consistent, calm and matter of fact, even when Max is off dancing with the wild things, the voice elicits the reader’s trust as it sees the protagonist back to safety.

Readers settle into this consistency the way Max settles into his boat for “in and out of weeks / and almost over a year / to where the wild things are,” and again “back over a year / and in and out of weeks / and through a day.” It steadies the commotion in Max’s imagination.

Here, readers recognize the tension between the consistent content and the disruptive visuals as the mark of a superbly imaginative journey, where anything can happen, but where eventually everyone must return home.

The narrative commits to this tension until the end, when Max gets back to his room, where dinner is waiting for him, “and it was still hot.”

As a children’s storybook, Where the Wild Things Are doesn’t employ multiple forms of narrative expression. But it is an effective example of the co-dependence of playful and experimental text and visuals, in which the narrative voice incites chaos and calms the senses at the same time.

One last example of a committed narrative voice:

Forefathers

Recalling Gold Rush-era drama and Victorian carnival sights with its effective design elements, Forefathers maintains an adventurous tone, employing text that is consistent, descriptively appropriate and authentic.

Be Mindful Of The User Experience

As Elizabeth McGuane and Randall Snare state in “Making Up Stories: Perception, Language and the Web,” as Web users scan pages, they are “filling in the gaps-making inferences, whether they’re based on past experience… or elaborate associations drawn from our imaginations.”

Trust the user to connect the graphics and text, and expect them to want to. Cloninger says that “the more power a user has to control the narrative himself, the more a visitor will ‘own’ that narrative.”

Keep the descriptions visual. The acts of “mischief” in Where the Wild Things Are are graphic. The connection is made when both elements are harmonized into one idea. The user will be willing to read the text and view the corresponding image if both elements are compelling.

Looking at Jonathan Patterson’s effective online portfolio, we can see he has maintained a fluidity of content and design by basing the user’s experience on the motif of “fresh meat”:

Jonathan Patterson

Patterson’s “About” page looks like a steakhouse menu. The text on the first page hints at a description of a meal, while suggesting the page’s function. The website can be flipped through like a menu, giving the user choice and control. The text is simple and linear, mirroring the sequence of appetizer, main course and dessert in a restaurant menu. Fluid text and design help Patterson to create a particular experience with his portfolio.

Maurice Sendak employs similar tactics in Where the Wild Things Are, encouraging readers to expand their gaze to match Max’s ever-growing visual landscape. As Max moves out of his room and onto the sea, the content on the right-hand pages (otherwise bordered in thick white space) creeps over gradually, thrusting more colors onto the facing page. At one point, a sea monster appears on the left-hand page, which was otherwise reserved for text and white space.

Here is the user experience at its most polished. The change comes quietly, invisibly, but the reader is aware that something is different. The protagonist’s growth has been connected with the reader’s experience of the narrative through the placement and cohesion of text and image.

Another polished example of fluidity in content and design can be found in an actual restaurant’s website layout:

Denny's Home

Yes, Denny’s. Look familiar? Replicating the experience of perusing a Denny’s menu, this layout shows how, in Patrick Lynch’s words, “visual design and user research can work together to create better user experiences on the Web: experiences that balance the practicalities of navigation with aesthetic interfaces that delight the eye and the brain.”

Denny's menu

The user controls the narrative here, with fluid navigation options that maintain the menu-like aspect of the layout, and a pleasing visual presentation that, as Lynch says, “enhances usability.” Filling in the gaps between glancing over a Denny’s menu and browsing the website, users feel encouraged to control their experience.

Conclusion

Fluidity of content and design requires that you trust users to make connections. By making the tone consistent, backing up your claims, tightening the text and being sensitive to the user’s experience, you can be assured that users will draw the conclusions you want them to draw. Designers of promotional Web projects can learn these lessons in part from storybooks such as Where the Wild Things Are, which demonstrates the essential elements of user control and delight. Trust your inner child; it won’t steer you wrong.

Why wait for the opportunity? create your own!

As many people who work in a creative field like design and development may already know, sometimes our clients just do not understand what it is that we are trying to achieve. The boundaries that we are seeking to push are not ones they approve of for their project, so our creative ideas get backburnered until we can find an appropriate project as well as an agreeable client where you can flex these creative muscles freely. In fact, the standard business processes, especially the ones we allow ourselves to be strapped into, tend to work against us in this aspect.

Allow me to elaborate. For most creatives, the most genuine and innovative ideas can often come without provocation. Which is unfortunate, because that tends to relegate these ideas to one of two categories. The personal project category that we get to whenever we find the time to break away from our work plates to snack on something different. Or to the professional project pool where we wait on that client who will allow us the freedom to incorporate this idea into their project. At other times, the ideas we have tend to be in response to the client, their business or something they have laid down — some sort of foundation — for us to build upon. These ideas are somewhat prompted.

Aces
Don’t just wait for the aces! Image by fitzsean

Now this is not to say that the prompted ideas are any less potent or powerful than the ones that we arrived at alone, only that the ones we get to by ourselves tend to be more imaginative and exciting in our eyes as those are the ones we feel unencumbered by the clients rules or specs. Which also means that they are the ones that we get to work less on due to the fact that we have to pay the bills, and in most cases, that means some kind of compromise on the part of the creative mind. We can say that we think outside the box on every project, but we have to admit that when a client comes to us, they have one or two ideas in the bucket ready and those specs can be considered somewhat of a box that we must work in.

That Is Just How Business Works

Now I know that there are some who are scratching their heads, knowing that this is just the way how business works, and they are confused at to what exactly we are asking them to consider. And yes, we understand that this is the standard way by which this game is played. Businesses have needs — they turn to other experts or specialists to have these needs met. They explain exactly what it is they are looking for, and the experts comply, delivering the experience that hopefully surpasses the client’s expectations. But what if we could change the standard rules of gameplay here on a much wider scale, affording this much freer approach to any designer or developer who wished to truly work unhindered.

Think outside of the box
Think outside the box! Image by west.m

Just a quick note: this article is not trying to say that working with all clients is a dull, innovation adjacent venture, or even trying to say that you will never have to work under these more standard rules of gameplay. But we usually have ideas of our own — ideas that we would love to see through without having to compromise or consult with a client or anyone else for that matter to approve what we are doing.

Think of it like the difference in a movie director working independently on a film rather than working for a major studio. They have much more freedom to make the film as they see fit, without any interference from above. For a while this was an approach that not many designers or developers have thought to not be feasible, but that is all changing.

Thanks, by and large, to the avenues being created by and granted access to by the Web.

The Game Changer

Before now, and in some ways still, we have always had to take our ideas to someone else in order to help us make them happen. We had to reach beyond ourselves to find those with the means and know-hows to reach further than we had access in order to get our idea out to the masses and have it connect with the audience. Essentially, we had to sell our idea to someone else in order to get distribution and manufacturing. However, the Web is granting creatives the chances to write their own opportunities, and make things happen for themselves, without having to depend on someone else.

Understanding that the term “sellout” tends to carry negative connotations, but what I mean is that we have to pitch the idea and someone has to buy in order for it to happen. When they buy, that tends to put them in the controlling seat. They hold the final say over the outcome of the project, or even where the project ends up. For some creatives, that compromise alone can take a lot of the fun and excitement out of the equation. But without those buyers, the project would tend to remain an unrealized effort. So there has been an underlying coercion for creatives to play the game and compromise their ideas when necessary in order to connect with the masses.

Strategic game
Plan your game – several moves ahead. Image by DoubleM2

Enter the Web, and services like Kickstarter, communities like YouTube and Vimeo, and suddenly the middle men that we needed to make our innovative ideas a reality, are not as much of a necessity as they once were. There is a great article by Ryan Carson that highlighted two examples of just how those in creative fields who are no longer waiting for opportunity to knock, instead create those opportunities for themselves. And in these cases, what remains important is that they remain the ones calling the shots.

Now I know there are those who think that this is approach is a complete waste of time. However, already today there are creatives who are just as equally excited about this evolved approach which allows them to completely take the reigns of their creative projects. So below we have taken a look at both the benefits offered and challenges posed by this new gameplay structure to help better see what exactly this approach means and entails.

The Benefits

First, we are going to look at the pros to taking charge of our creations and marching forward with them on our own as the masters of our own destiny. If you are one of those who is on the fence about this whole issue, or even if you are standing firmly against it, perhaps this section will have you rethinking things and getting you to come down on the side for it.

Shot-Caller

This has already been mentioned in the article; however, given its weight, it deserves a deeper examination of just what makes it so important. For most of us in the design and development fields, we have had to work with a client whose lack of understanding of the field can negatively impact the resulting project once their uncompromising input has been implemented. This can hugely effect our resulting takeaway and perspective with which we begin to view our chosen fields. Especially, if we find project after project that comes with compromise after compromise. This can effectively end up sapping our excitement and stifling our creative energy.

Defining targets differently
You’re your own boss and choose your own target. Image by HikingArtist.com

Another side effect these compromises can have is that we end up having to lose some truly innovative element of the project because of the client’s wishes, and our work can somewhat reflect a staleness on our parts as a result. When users see the final design and interact with it, they only see the compromised end result. They do not see the processes or the decisions and conditions that ultimately led to a creation that could essentially be much less than its potential. And it is this end result that is looked upon as the limits of our abilities. Client’s input is useful and necessary, but sometimes it’s not exactly what is best for our users. And yes, design is not art, but a medium for delivering messages across, but as designers we are often quite restricted by the decisions made for us, not with us.

But when we are the one who is calling all of the shots, our creative energy can flow freely, and our imaginations are subject to no one’s approval or standards. And there are those who would say that using a service like Kickstarter, where you outline a project and potential investors commit to contributions to fund your creative venture, does not put you in the driver’s seat per se, as you are still having to “sell” your idea. However, the big difference is that the sponsors and investors you get via Kickstarter do not expect to be able to provide some kind of creative input. You are the one in control.

This also means that you are the one in control of the timeline for when and if the project sees the light of day. This can be key, as there are times in the design and development fields when those elements are out of our hands and they end up derailing the project far from its potential or intended destinations. There are times when we work so hard on a project and have put so much into it until we have molded it to what we feel is perfection, only to turn it over and have it altered or never see the light of day. Consequently, there are times when we feel (for whatever reason) that a project just will not come together and should be abandoned, but we can’t drop it, so the end result is a sub-par product that nobody is actually happy with. In this field of play, those calls are all ours.

In Short:

  • You have to deal with less compromises that sap your enthusiasm and excitement for both the project and your field.
  • Your reputation does not suffer from compromises the client forced us to make.
  • You do not have to worry about outside interference, our imagination is not subject to approval.
  • Your project outcome is completely in your hands, and your hands alone.

Time and Money Saver

It may seem like somewhat of a contradiction that this approach could actually save time and money, but when you look at the first example of designer Frank Chimero and his design book that he now can completely finance via Kickstarter, you can see how this approach can do just that. More often than not, in order to get a book published and distributed within what is commonly seen as the mainstream, you would first have to spend weeks, possibly months, writing and rewriting both the outline for the book and the book proposal (not to mention the numerous e-mails, phone calls and meetings with possible publishers). All of which is done without any guarantee of being published and distributed.

Kickstarter
Frank Chimero’s project “The Shape of Design” on Kickstarter.

In the end, all of the time that is taken to write up these proposals and outlines for the books take away from the time we spend on billable work. And in some cases, the entire book or some parts of it must first be written before we are able to get any interest from publishers or distributors. So that time has to be accounted for as well. But by harnessing the Web and social media, we can now find the means to publish and distribute the book on our own — without consuming much time and often the costly process of seeking out and involving the proverbial middle men in the project. For instance, Smashing Magazine produces printed books independently, without the middle man, and so can you.

This is a big step forward, and helps to connect the potential investors directly to the creative individuals, without the compromised hands of the mainstream middle men getting into the project, which simply feels more conducive to innovation. Compromised decisions can end up hurting the project’s potential. This can also mean that we will end up with less forced input which can lead to time consuming revision after time consuming revision which could end up compromising the overall impact of the message. Which might further translate into lost sales. Therefore, we can see huge savings in both time and costs by opting for this new paradigm.

In Short:

  • We can save a lot of time, which tends to equal money, in both the initial and final project stages via this route.
  • Taps potential investors directly into the source of ideas, without any agendas or middle men getting in the way.

Smoother Sailing in the Client Pool

Now, one possible benefit that we could see spring forth from this approach is the higher chances of landing dream clients. This may seem a bit far fetched, but if there were more designers and developers writing their own opportunities and launching their own projects then that is going to create interest in the client pool, right? Essentially, going the route, you can effectively choose between working on a client’s project or creating your own which you could put in your portfolio or even gain some exposure with and consequently connect with some potential clients.

Besides, since you are engaging your heart and soul into your project, you are more likely to produce a remarkable product — a product that will help you gain new insights, learn new creative fields and leave a mark in the design community. You can also create a well-respected name for yourself. And it’s certainly worth trying.

Profit-Sharing

One of the biggest problems that anyone working in any creative field faces, is the undervaluing of their time and talents. This can come either in the guise of those who simply do not see the value of what we do, or in the form of those who capitalize on our creativity without having contributed to the creative process in any way. Whatever form it may take, it means that someone is profiting off of your creativity.

Now, there are cases when there is a service attached to it that we could not handle ourselves. Back in the day, distribution was one of the main incentives that creative persons had to aligning themselves with this model in which they create the product, and do not get to see the majority of the profits from the project. Designers and developers have been signing on with company that provided them with the space and tools they need to do the work for years because of the sheer cost it saves them. Only to sacrifice shares of the profits from their work, not to mention the ability to do the work that they necessarily want the way they want it. But again, this is not the only paradigm on the market anymore.

You want to organize a design conference and sell tickets for it? There are services for you. You’d like to build up a shop from ground up? Again, there are tools for you. You don’t have to rely on anybody, but instead you can just put together everything you need and leverage the potential of social media to back up your projects.

Natashawescoat.com
Natasha Westcoat creates live online paintings. She saves herself the percentages that galleries, art dealers and online intermediaries, might charge if she sold the work through them.

With no middle men to have to share the profits with, this new approach can also allow us to get the bulk of the revenues generated from the projects that we have created. In the example provided in Ryan’s article, Natasha Westcoat’s live online paintings, not only does she save herself the time and effort of seeking a gallery show to find buyers, she saves herself the percentages that galleries, art dealers and online intermediaries, might charge if she sold the work through them. Here, she controls the profits. So it is exciting to see that the old profit share piggyback model is not the only path in which designers and developers find themselves in these days given the reach and access afforded to them by the Web.

In Short:

  • With this new model, the person who is generating and creating the idea is the one who will reap the majority of the rewards from their work, as it should be.
  • No longer do we have to share the majority of our profits with those who offer us services that help spread the word — not create it.
  • With the middle men gone, the revenues can be more evenly and fairly distributed.

The Challenges

Anyone who is seriously considering taking on the “independent” route, needs to understand that there might be some challenges in the road ahead. These are serious considerations that should be made before moving forward.

Weight of the World

Most of the time that we take on a project, there are going to be some elements of that cause us some bit of stress. Be it the timeline, those we are working with or compromises made. But we tend to be somewhat compartmentalized in the project and therefore our stress levels tend to be as well. If there is stress involved in the project, we can bet that we are only experiencing a fraction of that stress through the buffers provided by the numerous rungs in the ladder above us. Also, because we are usually stacked somewhere in a hierarchy, the instigators of the stress are somewhat abstracts to us. For example, if we are working with a big company, we tend to not have to interact with the client or public directly, it is done through a series of intermediaries. So when they are upset, we get hints of that, but not necessarily the brunt of it.

A pints a pound the world around
No matter where, the burden is the same. Image by Kristian Bjornard

This is not the case when we are stepping up as the masters of our projects. We have no buffers or barriers which allow us to compartmentalize any of it. We are baring the full weight of this world on our shoulders, and are not shielded from the reactions of the public. It all rests on us. Every cog in the process, from creation to marketing, from production to distribution is our responsibility. Either we have to handle it ourselves, or we have to find the right people to put into those roles to ensure that it all goes smoothly and according to plan. If it doesn’t, the blame will fall on you and your reputation — no one else’s. Also, we need to makke certain decisions that we don’t necessarily know much about: e.g. if you decide to print a book, what about fulfillment and support?

This can admittedly be a terrifying step to take, especially when you have never worked through all aspects of the project process before. If you are not strong in marketing, or have never actually overseen the production step by step, doing these tasks for the first time can seem overwhelming. And it is easy to see why many would rather play it safer instead of working on a more demanding and involved approach. For many of us, no benefit is enough to willingly accept the entire weight of the project on our shoulders.

In Short:

  • If you pick the “independent” route, you are responsible for everything, and you alone will own each of the project’s successes and failures.
  • No matter where your strengths are lacking, you have to find ways to fill those gaps and pick up that slack to ensure the project succeeds.
  • You have no buffers to the reactions and fallouts from the project — you have to deal with it all directly.

Confidence Factor

Another consideration that must be understood is that you are not selling the idea alone, you are also promoting yourself. Which is where confidence comes into play pretty heavily. It is easy to have faith in an idea and be able to get others to sign on and ascribe to that idea through the confidence that you are reflecting in it. However, when you are the head of the pyramid, it is not just faith in the idea that all parties involved need, everybody needs to have faith in the main person behind it.

That faith in oneself is harder to project with enough confidence to necessarily have others clamoring at your heels wanting to throw in on the proverbial backing bandwagon. And given that many of us might not be used to having to promote ourselves and effectively market ourselves in order to make a project happen, this could be a necessary adjustment. It is one thing to effectively market ourselves into a job, where we are pitted against other individuals, but in this case, we are marketing ourselves against an entire, well, market. It is not just about the idea, but about our ability to make it real. Whereas now we are competing with what can be seen as more financially stable companies, not just the ideas they are pitching.

As part of a company, when we go forth with an idea, there is a reputation behind us, more than just our own. When we do it alone — not so much. So once again it is easy to understand how this could act as a deterrent. On the other side, it might as well be an area that not deters you, but vividly alerts you to something that you are going to need to work on before you move ahead.

In Short:

  • It is not just the idea under scrutiny, but your ability to make it happen as well.
  • You must be able to effectively position and market yourself and your project against the rest of the market.
  • You do not have any other reputation backing the project other than your own.

No End in Sight

Finally, you must consider that if you are going to try and create your own opportunities and run with them, you will be running for a long, long time. When you are the one spearheading the entire project, and overseeing all facets of the process, there is no end of the line where you just get to hand it over and then move on to the next project. You have to stick with this project and ride it out for the entire reach and life of the project. No matter where it leads, you have signed on to following, and that could prove to be a very long haul indeed. Somewhere, that road could potentially keep going, always requiring some level of dedication, if not participation, on your part.

Can you picture what will be the end
Can you picture the end? Image by N3T1O

This could effectively undo any of the time saved benefit that got you looking favorably at this idea in the first place. So you have to look reasonably at the long term time investments and consider how much time the project could require to completely determine if the project will be worthwhile to pursue. Keep in mind that the project will eventually endure beyond their initial projected commitments, althought the exact details depend on the project itself. And it would be better to realize this before beginning and getting others to commit, so that the project does not fall short of its potential because you actually underestimated your own project.

In Short:

  • You may have to be willing to commit to it for however long the project survives to maintain its integrity.
  • There is no point at which you should be expecting to be able to just cut and run from the project without seeing it through to the absolute end.

In the End

Doing things on your own is risky but worthwhile. There is certainly some merit to creating your own opportunities. The tools are available; the medium for connecting with friends, colleagues and like-minded people is available; and you can freely explore your creativity and skills using both of them. I honestly believe that this new culture we observe today might change the rules of the game and I anxiously wait to see what interesting new developments spring up as a result. Please share your opinion in the comments section below.

How job seekers can use today’s digital market

The 2011 job market is ending on a positive note. With unemployment shrinking to a mere 8.6% — its lowest level since May 2008 — and a steadily growing economy, businesses are planning on hiring and recruiting even more as their confidence in customer demand builds.

How Job seekers can use today's digital market

In this new, growing market, those seeking their next dream job should cultivate their presence and contacts strategically in places where employers will be on the lookout for the best talent. According to the MSU survey [PDF] of more than 3,000 companies conducted last month, social media has flourished as a burgeoning recruitment strategy, becoming a more mainstream approach for companies of all sizes and industries, even the most conservative. For job seekers, social media platforms such as Facebook, LinkedIn, Google+ and Twitter have established new ways getting discovered by employers, as well as directly reaching recruiters and hiring managers.

Here’s the scoop on what job seekers should know in order to be successful in today’s digital job market.

Your Social Media Profiles Are as Important Your Resume (If Not More Important)

The MSU report asserts that 36% of companies surveyed are using social media for recruiting. In today’s competitive market, recruiters look for the most current information on candidates, which is readily and easily available on social networks. Job seekers should actively include links to their complete and up-to-date Facebook, LinkedIn, Google+ and Twitter profiles in their applications. When creating your profiles, do not just import your resume — it often contains too much detailed information. Rather, build your profile from scratch with a concise description of your prior experience to grab a recruiter’s attention. To make yourself more discoverable, search engine optimize your title and skills.

Be sure to use social news streams as a dynamic extension of your traditional resume. Employers are interested in candidates who are passionate about their work. Job hopefuls should share interesting and relevant news about your industries and areas of expertise, demonstrating their knowledge and establishing yourself as an essential player in the fields. While the social news dialogue ought to maintain a professional tone, you should also reveal yourself to be a fun, authentic individual.

80% of Success is Showing up

Social media enables us to stand out, to be more noticeable, to differentiate ourselves from the masses and to tell the whole story behind and beyond a one-page resume. When contributing to your news streams and profiles, choose current topics of interest, start participating in discussions about your professional field and industry trends, and share your own hands-on tricks of the trade. Many companies are now making use of Facebook Pages that are dedicated exclusively to careers and hiring. These pages are generally run by recruiters and talent acquisition professionals that are looking to attract and hire candidates. Savvy job seekers should make use of these pages and proactively ask questions about job openings, the specifics of a company’s interview process, or any upcoming career events. Responses are generally instantaneous, and you will quickly establish connections within the company.

Additionally, every field has its own industry thought leaders broadcasting on Twitter. You should follow the influencers in your field, contribute to the discussion and share it with others who might be interested. Take advantage of @-mention feature to keep participants engaged and include hashtags to increase the visibility of your tweets.

You should also join LinkedIn Groups related to your field or moderated by a company you are interested in. Since hiring managers are always on the lookout for team players, you should establish a reputation by sharing your opinion, answering questions and offering advice in the group discussion forums. Join specific company groups to gain additional insight and keep up on the latest hiring news. Recruiters are very active in these groups, and taking steps to establish a positive LinkedIn presence will help to assure that you get a call.

Social Networks Enable Direct Interaction

There was a time when contacting recruiters on job sites and boards was difficult, and proactively reaching out to hiring managers was nearly impossible. Social media has created a culture of openness, and has all but eliminated the ‘black hole’ that resumes have fallen into for decades. Many companies even highlight their recruiters on job postings; not only can you contact a recruiter directly, but you can often view recruiters’ and hiring managers’ social media profiles before contacting them.

Job seekers need to connect to recruiters who are hiring in their field and location. If you don’t know them directly, subscribe to them on Facebook or follow them on Twitter to stay current on all job openings, and work towards developing a positive relationship with them.

Your Networks Help You Find Jobs (and Help Employers Find You)

More companies than ever are cutting their job advertising budgets, opting to channel their recruiting efforts through referral hiring. The MSU report indicates that 44% of companies use referral hiring, and 49% tap into alumni networks in order to recruit. Companies are drawing on their employee’s social networks to share jobs and attract the most qualified candidates. The more extensive your personal network is, the greater your odds of encountering these unadvertised job opportunities.

Grow your networks by reaching out and connecting to people with whom you have either professional or personal relationships. If you don’t know the person well, begin by subscribing to their feed or ask a friend for an introduction. As in real life, opportunities can arise from any connection — a co-worker, a friend, a neighbor, etc. Many companies publish their job openings and career events on their Facebook Pages, so connect to the pages of companies that are of interest to you to start receiving active job openings in your news feed with little effort.

With the economy on the mend and hiring rates rising, job seekers should not hesitate to break into the social media sphere. Facebook, LinkedIn, Google+ and Twitter offer an abundance of ways to connect with companies, foster your professional reputation, gain exposure to job postings, and ultimately, realize your professional aspirations. Establish your online professional brand and presence now. Your dream job is waiting for you.

Feedback is key to keeping clients happy

Feedback is key to keeping clients happy

Hardly anyone likes asking for comments on their work, but the process is critical to career development and good results.

Designers are incredibly egotistical. They’re pretty sure we have all the answers, the best skills and the keenest eye. That’s good for pushing things forward, but it shouldn’t get in the way of creating the best solutions, and good solutions require feedback. As creatives, they don’t know everything, even if it’s sometimes their job to work as though they do. Criticism is key to improving craft and keeping clients happy and invested.

This external evaluation is a crucial element of design and implementation, yet one that’s sometimes overlooked and often misunderstood. It’s a complete nightmare if you have nitpicky or ill-informed customers – it can blow projects out so that they run way beyond scope, and can even lead to hostile client relationships. The key is knowing when to get opinions, how to ask for them and what to do with them.

Timing and method

If you’re concerned about people’s comments, you might be tempted to leave it as long as you can to ask for them: “I’ll wait till I’m almost finished, so that if there’s feedback, it’s too late, and I don’t have to worry about it.” If you follow this rule, you’re doing a disservice not only to your client and your company, but also to yourself.

Ask for assessments early, and often. If you’re working on a new site or application, start getting comments as soon as there’s material to be looked at; this will mitigate trouble down the road, and improve your design sense and skills to boot.

One of the main reasons for feedback being neglected is that it so often leads to problems. Part of the issue is understanding how to request opinions. Ask for exactly what you’re looking for. Open-ended questions such as, “What do you think of this?” broaden the discussion too far. If you’re getting feedback in person, have an outline ready. If it’s over email, make sure to give context and frame the conversation.

Choose who you want to approach. There are times when colleagues are ideal, and situations when clients are better. Plan for the responses you want, and don’t be afraid to shut people out – unsolicited input can too easily be unproductive.

Don’t look for or accept feedback just to tick it off the list; the goal is to improve and move forward. It’s easy to get too much or too little criticism, or comments that don’t move things forward. Getting constructive results is an art form, and it takes practice, both from those asking for them as well as those giving them. Try approaching people at multiple stages of your projects. You’ll find there are valuable opinions to be had on everything from sketches to code.

Dealing with responses

Now that you’ve asked for and received feedback, what do you do with it? Acting on comments can be the most challenging aspect of design, but also the most rewarding.

Don’t blindly implement all changes, especially in client relationships. It’s your job to determine what will lead to a better final product. And don’t ignore feedback. In many cases, it can be easy to, especially when it goes against your design, beliefs or ego. Balance your own artistic sense and skills against those of the person who gave you criticism, and stay humble. There’s almost always something to learn and work on. Look for it, and show that you’ve listened.

Practice asking for and acting on people’s opinions frequently, so that you can learn when and how to ask for them, and what to do with them. We’ll always think we’re right – the right designs, the right copy, the right interactions, the right code. Feedback helps us be correct, and stay so, while learning more about our craft and the people we work with. Don’t be afraid to face up to it; your ego will be just fine.