Machines of unknown intent

Around six years’ ago we worked with a client who, as part of the project brief, asked for a website that would “still look great in 5 years”. No doubt there was an element of thriftiness in the request (and perhaps a degree of mischief), but fair play to them. It was a hell of a challenge to set a design team.

Aiming low

So how did we do? Well for one the website is still there (and no, I won’t supply the URL…). While it doesn’t look terrible, it certainly displays all of the traits of having been designed six years ago. The giveaway is the 760 pixel width, catering for the large percentage of users then still with monitor resolutions of 800 x 600 pixels. We interpreted the request as having an influence only on the style of the site, while blindly fixing its dimensions to the standard of the time. Using the same flawed logic, we would now be designing sites with a 320 pixel width to suit the lowest resolutions accessing the site.

Post-PC

The fact is there are very few ways of future-proofing a design, particularly when basing it on a style-only agenda. But our chances of success in this challenge were much better at the time our client made their forward-looking request when web access was almost exclusively PC-based. Steve Jobs has recently repeatedly proclaimed that we are living in a ‘post-PC era’. It’s not the fact that Jobs says this that makes it significant. It’s significant because it’s true.

Knowing the unknown

Although we’ve known they were coming for a long time, web-enabled devices are changing the landscape irrevocably. In the past week for instance, it was discovered that Barnes & Nobles’ Nook eBook reader has a browser embedded in it, waiting to be switched on. How could we possibly have designed or tested for this or any of the myriad of new web-enabled devices hitting the market each day, each with their own particular optimal settings for viewing websites? Quite simply through a more forward-looking approach.

Hard sell

The deluge of blog posts heralding the advent of responsive design was something I’ll admit to greeting with cynicism. If someone tells me I “need” to do something, my initial reaction will be to ask what is in it for them. What are they trying to sell me – a conference? a book? In some cases the answer is both, but that doesn’t change the central truth. The argument in favour of an adaptive approach to web-based design is now overwhelming. It’s early days yet, but this is a shift, not a trend.

No-brainer

This doesn’t require signing up to some new dogma, it simply means assessing each project individually on its requirement to adapt to multiple devices. Put like that, doesn’t it sound like pure common sense, if not an essential part of any professional design process? The approach doesn’t guarantee that a website’s visual design won’t look dated in a number of years time, but it will ensure its credible appearance on browsers of all types for a significant period of time, even those yet to be released.

Future machines

With an adaptive design, we can design for the future. Literally. We can prepare designs and layouts for still-to-be-invented machines and devices whose purpose we simply cannot even begin to guess. But they will access the web. And we can design for them.

Isn’t that fantastic?

A less precise art

There have been a number of natural ebbs and flows in the history of online UI design, times when designers may have felt that full control was coming back to us only to see it move away again.

Shock of the new

Moving to the web from print in the late nineties was like a slap in the face. “You mean… I can’t control what’s going on here? There are different browsers that do what???” etc. Designing for the web was imperfect, approximate and maddeningly unpredictable. Or, from a print designer’s perspective, “hell”.

Workarounds

But we moved on and gradually clawed back some degree of control. Tables became the designer’s saviour; by chopping graphics and wringing every last drop of functionality from tables, we were able to lay out content how we wanted it. Bloated markup, unorthodox layouts and clunky designs were the result, but they were a means to an end: control over the design.

Denial

Emerging W3C standards and increasingly ubiquitous CSS put the spotlight on the folly of reliance on tables, and the boundaries were moving once again. As a designer in these circumstances you either accept or go mad, stuck with the misguided delusion that YOUR vision is more important than any constraints.

Comfort zones

Graphic designers prior to this generation had been used to constancy. If a new printing technique emerged, or new paper stock came out it would likely be integrated into the process with little or no impact on working practices or design approach for that matter.

Change = good

But this is exactly why UI design for the web can be so exhilarating. Rarely do such new possibilities and challenges to learn and re-learn emerge with such regularity in other mediums. Online, regular developments in markup or software enable us to conquer new challenges in completely new ways.

No going back

Responsive design ensures that websites will appear elegantly on web-enabled devices, regardless of the viewport size; progressive enhancement means that the more advanced the browser environment, the better rendered the design will be. Neither of these principles however results in (or attempts to achieve) full, pixel-perfect control on-screen. And that is where the game has changed irrevocably for designers in the space of a decade.

Conclusion

Ours is an imperfect art, with countless variables and as-yet unknown methods of consumption; one in which we need to surrender to the medium, not master it. For many, many designers I believe that would be too uncomfortable to live with. For those now entering the industry now however it has another name: normality.

Responsive design: don’t stifle debate with dogma

The responsive design debate was set in motion around a year ago, but seems to have reached something of a crescendo of late. Some commentary borders on the totalitarian, others’ input is philosophical, while some contributions attempt to navigate a practical way forward. Fact is, there is a veritable scramble to coin the phrases that will become tomorrow’s industry-standard vocabulary.

Designers are just plain excited about responsive design, and it’s easy to see why. We have arrived at one of those industry-defining moments which precipitates huge leaps forward in practice – think HTML 3.2 & 4, CSS2. You can perhaps forgive the piousness of some commentators. As new practices bed in, you can always rely on designers to get sanctimonious about how inadequate our practices were up until a day or so ago.

Get up, stand up

Exciting as it is, there is also a huge challenge for designers to step up, not something we have always distinguished ourselves by. As the mass-market web came into being, designers (by and large) stood idly by waiting for someone to make it easy for them, instead of just getting in there, learning some basic markup and meaningfully engaging with a new communications medium.

A shared future

Things couldn’t be more different today; a new generation of designers are falling over each other to experiment, test, share and move the practice of online UI design forward into a new era. This time the catalyst is not a new markup specification, but advances in hardware: a critical mass in use of web-enabled devices has been reached. The rules of the game have changed. Mobile access is no longer an afterthought, or a box to tick, it has parity with desktop and laptop access.

Papa don’t preach

The volume of the debate is rising, but those preaching too loudly or broadcasting their opinions on who is or isn’t doing it ‘right’ are demeaning themselves, and missing the point. We are all in this together. Our internal industry dialogue will continue and something will emerge from all this, almost certainly not in the form of a single proposal or approach. Thought leaders will get us in the general vicinity, but best practice emerges from the efforts of many, and continues to evolve, as we evolve both as designers and as a community.

The new reality

Subscribing to new thinking is one thing, but deploying it on a relevant, commercial project is another. I’ll readily admit to being right at the start of the transition and pursuing a trail-and-error approach; much preferable to breathlessly following anyone who screams they have ‘the answer’. Plus, attempting to stay ahead of the curve on this issue looks like the path to madness when even the originator of the term ‘responsive design’ has identified somewhat inevitable grey areas.

In conclusion

This is as fresh a challenge as we could hope for in our industry, and these are exciting times. The least helpful contributions to a discussion tend to be the most vociferous, but we’re off and running, on the road to best practice and the community will win. Let’s enjoy the ride and look forward to what emerges on the other side.

Sometimes wireframes won’t work

Wireframes are a pillar of best practice in any interface process, but what happens when they get in the way?

What happens when say, the client has no interest in them, or doesn’t feel empowered to take decisions based on what they see, what then? Should a principled designer hold firm until the client sees the ‘error’ of their ways… or alternatively, do we graciously step down from our pedestal and move on, acknowledging that adherence to an idealistic idea of best practice can occasionally get in the way of progress?

A quick reality check: clients know their business best, and will care most about that. They are not hugely concerned with what constitutes best practice for designers; they simply want effective results. In at least one recent project, wireframes became either a barrier to progress or a literal waste of time, completely failing to elicit the responses and decisions they were designed to achieve. And yet the “client education” card is played all too often by elements of the design community as the fix-all solution to allow us to work the way we would like.

Having have long since accepted that designers are not artists, and rightly so, we should accept also that we are not surgeons, or nuclear engineers. Call it ‘agile’ if it makes you feel better, but the fact is that our processes should be mature enough to accommodate a degree of compromise, and still produce effective outputs.

If wireframes can lead to a more effective end solution, then their benefits will be apparent to all and their use a formality. If not, then maybe, just maybe, they are not appropriate or required.

Investment in design services is a huge leap of faith for so many clients. While the ROI on considered and well-executed design might be a given to those of us in the industry, it remains a significant outlay for clients who already have budgets stretched to breaking point by many other aspects of their project. Heard through that filter, the sound of a designer labouring the benefits of wireframing might easily sound like “that’s just how we do things around here, although of course you wouldn’t know this stuff, being a client and all that”.

From experience, winning confidence is the most effective path to what we sometimes rather demeaningly term client education – and has far more value than that. Ditch the designer vocabulary and pretensions and earn the trust of your client. Once achieved, rather than having made your client feel slightly patronised, any project is guaranteed to run more smoothly.

Wireframes or no wireframes.

Redefining the homepage

There was a time in the history of web design when the homepage would receive almost all of the designer’s attention.

Naïve though it may sound now, it was as if the homepage was the site’s only chance to win over the user. After all, homepages won web design awards, homepages were featured on portfolios, and homepages alone bore the weight of expectation for the project. An inordinate amount of time was spent creating homepages that were self-indulgent and self-serving. I know. I was there, and I was as guilty as anyone.

Clients are understandably keen to have something which objectifies their aspirations for the project; the homepage is usually presented by the designers as the key evidence that the design process is on track. Sign-off for the homepage can be protracted, but when achieved it quite often represents the client’s approval for the overall design direction.

But there is a definition of the homepage that made the penny drop for me. It’s plain, it’s simple and it is self-explanatory:

The homepage is the first step of a user journey.

It is a launch-pad for any one of a number of user journeys, depending on the users being catered for. Not a destination in itself. If the homepage successfully serves its purpose as the first step on the journey for your key users, then it is successful. If not, then no amount of embellishment, enhancement or deft application of branding is going to make a difference.

It can not be the designer’s goal to produce a ‘killer’ homepage. That is the realm of designers who see their contribution as more important than the goals of the users they are trying to serve. The homepage is not an end in itself, it is a beginning.

So what do you want to empower the user to do? Where do you need to take them? Make sure the answer is on the homepage.