Posts Tagged ‘digital design


Effective Web Design: Sliding Into the Psyche

In the last few decades, the design aspect of consumer electronics has taken on more and more importance. Today, people buy their technogear as much for its look as any real understanding of what’s going on inside. That’s not surprising really, considering that’s how most people get into relationships and have for countless centuries—all those volumes of chicklit to the contrary.

So in a world more dominated by looks than ever before, it’s hard to understand the discrepancy that occurs so often, between the design of a product and the design of the Web site built to sell it.

“Submitted for your approval,” as the man used to say, are two contrasting sites: and The site developed for Beats is well synchronized with the style of the products themselves, whose clean lines derive from geometric shapes, softened with a biomorphic aesthetic appeal. The flat digital design complements product design nearly perfectly and leaves plenty of light and air for copy to work its motivating magic. That image and text both have room to breathe on what is, essentially, an e-tail site, is an understated triumph I can only wish would be more broadly imitated across the Web.

That this wish of mine is likely to remain in the provenance of magic lamps and the genies who inhabit them is borne out by the site developed for Bose speakers. Ironically, here is a product many people would agree achieves a high watermark in design and technological efficacy. And yet its Web site design harkens back to the deep dark ages of supermarket circulars.

Grabby hands.
Splattered with price bursts, slathered with iridescent colors and embedded in one of the cheesiest background images I’ve seen in a decade, you’d think Bose products were, in fact, the cheap knock-off version of some other brand. In a prime example of the devastation wrought by Marketing Anxiety, the image on the left depicts the arm and hand of a sedate listener, enjoying a game of scrabble over a glass of wine—while the image on the right depicts a cartoony “bopper,” looking for all the world as if she just stepped off the set of the ’60s TV show The Mod Squad.

Thank you, Bose, for reminding us that the world is diverse, i.e., full of sedate white people and people of color who love to rock out, even at the risk of traumatic neck compression.

The only thing missing here is the “Why Pay More” sticker or “The Perfect Gift for the Holidays,” although the latter is fairly well covered by the unsubtle subliminal snowflake bursts. Red snowflakes, at that.

Now, even if you were to conclude that this is a matter of taste, you’d have to concede that the Bose site suffers from metastasising visual clutter. It’s the classic example of a site that makes users say “Better come back later when I have more time.” And it’s easy to see why. A user’s eyes are drawn nowhere, precisely because they’re drawn everywhere.

Pushy talk.
To look at the Bose site is to instantly lose a bit of faith in the quality of the product. This is irrational but true—even for someone like me who actually owns and likes a pair of Bose speakers. A site so heavily layered in cheese makes me wonder if I’ve made the right choice.

Why? Because advertising design of any kind, but especially the digital variety, that’s so jam-packed with marketing messages, is inherently manipulative. The site says “Hey, why don’t YOU buy a product, ANY product from us RIGHT NOW?

Instead of giving me a reason to fall in love with the brand, the brand is reaching for my wallet on the first date. Even in today’s “benefit” oriented dating culture, this is not anybody’s idea of a smooth come on.
And that’s the gross error Bose’s marketers have made.

Know that if you shove me against a wall and say, “You want a speaker. Come on, you know you want it,” you’re not getting the sale, even if your product’s all sparkly and shiny.

But if you create an environment where I feel safe discussing my speaker needs openly and without shame, I just might grow to think you’re the best speaker company in the world. I might even come over and help you rework your Web site.

That’s because—hello, pleased to meet you—I’m a person, not a consumer. And until brands get this into their heads, we’ll see more of this garish, loud and demeaning approach, as we slide into the next half-decade of “the millennium.”


Flat Design & The Way Forward

Over time, in an attempt to keep up with shifting Web design trends, advances in programming have often been adopted under the aegis of a more-is-better philosophy. That is, without regard to the most important issue: How these changes in design parameters affect the site’s ability to communicate effectively with consumers.

As a result, we have seen the proliferation of visual clutter compounded by a desperate, aimless engagement strategy, based on the premise that “something” on the home page ought to grab the attention of any given user.

By contrast, I see in the recent trend toward so-called “flat design” protocols, the potential to make Web design less mechanical and, by corollary, more effective. Furthermore, flat design delivers an effective way to communicate across the multiple access points—just as an increasing number of users take for granted as they glide unselfconsciously between desk- and laptop, tablet, and the device we still quaintly refer to as a “phone.”

If you’re unfamiliar with the concept of flat design, the overview available at Awwwards and Webdesigner Depot will give you all the orientation you need for the moment.

Examples of flat design on view at Design Razzi offer an unscientific sample that nevertheless illustrate its potential to improve digital communication across the board. To be clear, underlying this purely visual point of departure is an equally important shift in communication strategy. That is, toward an effortless rolling out of content that allows the brand’s deep message to speak for itself at a measured pace.

A few examples are enough to illustrate the positive principles at work here.

 Uncluttered, elegant, succeeds due to careful attention to proportion, spacing and line lengths. Additionally, it translates effortlessly to mobile display, enabling the on-the-fly decision making that, as I see it, has emerged as the centerpiece of 21st century popular culture.

 Just as important, the design calls attention to the offerings, not to itself. You get the feeling you’ve arrived at the right place for intriguing dining without any intermediary artifice required to “welcome” you there.

Considering this is also an e-tail site, I see it as a definitive step in the right direction. Here, online shopping continues the brand narrative, driving the deep message all the way home—again without needing an extra layer of promotional metacommunication.

Overriding these accomplishments, see how flat design, by doing away with conventional grid structures, allows language to flow according to its own principles, instead of being treated as merely another design element—and a pesky one at that—whose irregular contours threaten to make a hash of the most carefully planned pixel-width metrics.

The elegant branded experience created by bicycle manufacturer Archie Wilkenson stands out for way it focuses its attention on the product—as opposed to promotional clutter. With text an image set out in a spacious array, features and benefits speak for themselves.

Naturally, in such a niche market context, you might assume simplicity is easier to achieve, because the impetus to include “no money down” sales talk is largely absent. In fact, however, there’s no reason to assume that limited promotional incentives could not be easily integrated into this site. It would simply be done without star bursts, flickering arrows, or jiggly banners.

Finally, a site like shows how flat design integrates video (scroll down) into a coherent visual flow. Video is available as an option you can access at your own pace—absent coercive promotional lingo, or moronically redundant instructional copy.

Here again, the site makes an easy transition to mobile, even on a 5” screen. especially important in this context, as the services offered target people too busy to deal with everyday life in real time.

And in clear refutation of the claim “people don’t read online,” this site’s response is unmistakable: “they will if the text is actually allowed to flow naturally as language, rather than confined to design-regulated copy blocks.”

Sure, you can adapt the length, style, the tone, the vocabulary the pacing, the rhythm of the text to match any audience model. But if you want consumers to read your content, you must display it in a legible format. As I see it, this aspect of flat design in the broadest sense offers a way forward to a far more effective and memorable Web experience.

From the most practical book-your-hotel functionality to the most elegant niche marketing scenarios, the improvement these protocols make in clarity and speed of communication have arrived just in time to meet the current rapid shift toward mobile computing. More to the point, they succeed by creating the first truly digital visual vocabulary in a way that humanizes digital communication for the first time.


Walking Away from the Grid and the Rail

In 2013, when the Internet is still routinely force-fit to specs made for print, out-of-home, retail or broadcast, it’s easy to fall asleep every night believing a Web site is simply an electronic newspaper.

Excuse me, but what a waste.

As CPUs muscle up, pixel densities climb, sound systems deliver stadium acoustics and the promise of artificial intelligence looms on the horizon, digital space is going through a reality change. As these ramped-up technologies converge on our touchscreens, we now have the opportunity to walk away from mechanical grid-plus-right-rail formats—and evolve an inherently digital idiom.

Ironically, the same consumers we’ve convinced to trade-in their traditional worldview for a digital screenview are now more immersed in digital communication than we are. While we continue to crank out flat arrays of boxes, consumers are swiping from screen to screen with a grace reminiscent of simian brachiation. And lest we forget, gamers around the world are now logging billions of hours battling boredom with ‘bots. As I see it, that leaves between 90 to 95% of all Web sites woefully behind the curve.

Viewscreen: On.
How do we address this mismatch between the idioms users respond to and the idioms we speak in? As I see it, we must develop a new visual vocabulary in which text, image, animation and video would narrate the brand story in a series of engaging experiences.

So, if the marketing team at Volvo (as of 5-24-13) wants to tell consumers their product is “designed around you” they might think to demonstrate what that means, and not expect consumers to “see for yourself” by stumbling into the showroom. At the moment, the intriguing idea of a car designed around consumers merely serves as a lead-in to a dissertation about “Dynamic Stability and Traction Control (DSTC).”

Posting documentary-style videos on a You Tube channel is not enough, not least because users have to leave the site to find them. Besides this site-hopping message deployment merely adds remote boxes to the standard grid. A Facebook page, when linked to from a Web page, is still just one more carton of promo for users to ignore.

What if, instead, Volvo illustrated that thought in an immersive digital environment? The story behind “Designed Around You” would help users appreciate the engineering, aesthetic and social challenges that drive the process of building a car—and help them grasp why Volvo adds value to their lives.

Bullets in abeyance.
Now, this approach in no way obviates the display of factoids or order buttons. But the site would be oriented toward creating a seamless, dovetailing branded experience with multiple access points.

One thing this approach does obviate: throwaway copy devoted to promotional nonsense. In a branded experience environment such copy is a distraction—a little like the advertising vignettes broadcasters wove into the first generation of TV sitcoms.

Besides, times have changed. In a tight economy, the phrase “Don’t Wait—Order Now” continually begs the question “Why?” If you think the answer is a series of bullet points, you’re on your way to another digital makeover and another parade of customers who arrive at your showroom with no idea why you’re better than the competition.

Not, mind you, because they don’t have enough facts, but because you’ve failed to endow your brand with memorable emotional resonance. And that resonance, in today’s world, is what a growing swath of Americans associate with immersive, digital entertainment.

Encouraging trends.
You can already see baby steps in the adoption of a new digital idiom. Certainly the goings on at OK Studios suggest a point of departure. Here flash programming helps ratchet up the engagement level—but that’s not the whole story.

The site also delivers pages composed of surprising imagery and loose-limbed copy, working in concert to create a branded mood / voice. And while you could argue OK Studio isn’t hemmed in by the necessity to hawk merchandise, it’s easy to see how an e-tail component could be handled in this idiom.

As a cursory Google search will tell you, these are trends and tendencies explored by a number of adventuresome Web designers, including, unfortunately, cartoonish “3D” approaches that interfere with consumer engagement by adding extraneous layers of “realism” to the interface.

But enough. At issue here is not what programming technique to use. The point is to find a way to communicate in digital space that’s truly idiomatic to the medium. It’s something that needs to evolve at its own pace, but does require one inciting incident: The decision to walk away from the Grid and the Rail.

Mark Laporta

Writer, Creative Consultant
New York, NY



Enter your email address to receive notification of new posts.

Top Marketing Sites
Blogarama - The Blog Directory
Marketing Blogs - BlogCatalog Blog Directory
Alltop, all the top stories
HE Blog Directory
Subscribe in Bloglines
Add to Google Reader or Homepage