Archive for the ‘design’ Category

dConstruct 09 in review

Monday, September 7th, 2009

After you build forty or fifty websites there really isn’t any magic in it.

dConstruct’s comfortable niche as the thinking person’s web conference was quickly disrupted by Adam Greenfield’s early remarks. Decrying web and UX design is a risky strategy in a room made largely of web designers and developers, yet it was a thought entirely consistent with our theme of Designing For Tomorrow. The phrase wrapped topics that have been of recent interest to us Clearlefties: ubicomp, gestural interfaces, networked devices and what lies beyond our familiar digital horizons.

Adam Greenfield

Adam led us into a world where information is omnipresent and persistent, where actions stick to identities and the presentation of self is a largely forgotten luxury. A world where objects become services, shared not owned, implies a post-capitalist swing perhaps alluded to by recent economic events. As a recent and voracious reader of Everyware, I was thrilled by Adam’s talk. I’m sure the imminent podcast will reward careful re-evaluation.

Mike Migurksi provided a practical counterpoint with a case history of Stamen’s information design work, with subsequent colour commentary by Ben Cerveny. Ben’s dense, rapid idea stream was perhaps a step too far after such an analytical opening; although Stamen’s work is undeniably excellent, many felt a gap between the metaphysics and the design output, and some of Ben’s more elaborate statements seemed hard to grasp.

Brian Fling explored the mobile field with characteristic flair and pace. Focusing on the future lives of the post-millenials native to the digital age, Brian proposed that history will judge the mobile (and the iPhone in particular) as the flying car we have been waiting for. We are living through a second industrial revolution, based on the portable, personal power of bringing people closer through technology.

domeroofNext up, an elaborate Gaia theory of sci-fi and interaction from Nathan Shedroff and Chris Noessel. In an entertaining presentation, the over-used Minority Report example was only (multi)touched upon once, and Jurassic Park’s ridiculous UNIX scene was rightly used for cheap laughs. Of particular interest was the pair’s evidence that anthropomorphism can exist at non-visual levels (consider R2D2′s bleeps and Amazon 1-click servant), although, like Ben before, some other claims seemed rather hazier.

Robin Hunicke, known for her work on “the Maslow’s Hierarchy game known as The Sims”, unfortunately alienated her audience with a spoiler (albeit well meaning) for a film still on general release, and struggled to recover favour. Her West Coast bubbliness sat awkwardly at odds with her academic subject matter, which was coincidentally recapped by August De Los Reyes. Any Microsoft speaker knows he has an uphill battle to win over a sceptical audience; fortunately August’s self-deprecating humour was an instant hit. We imbue objects with intelligence (slide rules, other technological tools), so why not emotion too? Heartbroken families insist on the repair, not replacement, of their Roombas – can we conjure similarly powerful dynamics in the systems we create? August closed with Office Labs’ concept video, a surprisingly rousing vision that raised hairs on necks across the Dome.

dconstruct-robotThe stage was set for a wonderful denouement from Russell Davies, who produced a performance straight from the traditions of British music hall. Russell predicted that digital buildings will give us “Blade Runner brought to you by the makers of Cillit Bang”, and that as technology matures the only way we will escape cliché is to redomain, appropriating ideas from other fields. Russell provided a marvellous reminder that, despite the intelligent contributions of the day, as an industry we are prone to hubris. We’d be daft to disregard the marvellous infrastructure our media predecessors have created.

At its best, the fifth dConstruct was simply outstanding. In its rare low points, it disappointed. As such, it’s at a crossroads. The trend has certainly been cerebral, and this year’s theme certainly encouraged abstract exploration. Early feedback says our audience is happy with this, and that the differentiation from other conferences is an important part of dConstruct’s appeal. Yet there’s always a danger of vanishing into pretension, and the conference must of course appeal to 700+ attendees.

I’m sure Clearleft won’t be taking any snap decisions. dConstruct has become part of the fabric of our company and hopefully the annual schedule, and, in line with our chosen theme for the year, we’ll be thinking carefully about what happens next. I’d love to hear your thoughts on the day and your preferred direction for dConstruct 2010.

Photos: Matt Biddulph, FriiSpray, Tom Jenkins.

Posted in conferences, design, mobile | 5 Comments »

Sweating the small stuff

Thursday, August 27th, 2009

Outrage. Ikea recently switched corporate typeface, moving from Futura to Verdana across all their marketing, including their printed catalogue and ads.

IKEAgrab-1-1

To typography enthusiasts, this is like Mozart announcing a kazoo concerto. Futura is a type classic, skilfully designed by a master craftsman and demonstrating real artistry. It’s excellent for distinctive identity and brand work – so much so that Ikea had practically made it their own until now.

Verdana was created to act as body text on low resolution computer monitors. And it’s well designed for that purpose, but it doesn’t suit print work or any size above petite. At large sizes it looks plain fugly, with characters that appear juvenile at best. Use of Verdana in this way definitely constitutes bad typography.

The slight is all the greater coming from a company that has, to an extent, brought design into the lives of many people who previously believed it was the domain of turtlenecked pseuds.

Ikea’s reason was ostensibly to ensure consistent use of fonts across web and print platforms, and to ensure global compatibility across all languages. A strange choice, given that Verdana has notable deficiencies in its character set. However, it’s possible that Ikea isn’t as naive as we think. My colleague Paul Lloyd hypothesises that the switch is a deliberate ploy to make the company appear less expensive. It’s an old strategy: cheapen the aesthetic and the perception of price goes down. Plausible, at least.

By all means we can point, laugh and lament the lack of design skill at the company. However, some of the outrage has been ridiculous, particularly since we can never truly know the reasons behind the choice. Hell, there’s even a petition to reverse the change.

I believe that if companies make bad design choices that’s their prerogative. If I worked for Ikea, I would have fought tooth and nail to dissuade them from this choice – but no, I won’t sign a petition. Let them eat cake, and if design is as important as we say it is, the market will prove their mistake.

Herein lies my bemusement at the design community’s reaction. Behind the indignation, does any of us really believe that this typographic gaffe will affect Ikea’s sales? Is it really as egregious an error as we make out? Or are we merely acting out the stereotype designers fight so hard to shake off: the aforementioned turtlenecked pseud complaining that their soup isn’t hot enough?

Typography matters. Used well, it can elevate communication in astonishing ways. But, as Aegir points out, there are bigger design challenges facing Ikea and indeed the global manufacturing industry than choice of corporate typeface.

Design is about sweating the big stuff; hopefully even changing the world. Often that involves the small stuff too, but focus solely on the trivia and it’s hard to avoid becoming trivial yourself.

Posted in design, typography | 1 Comment »

Blank canvas

Wednesday, July 8th, 2009

New Clearleft officeWe’ve been busy. Not only have we taken on ‘leftie number nine, but we’ve also moved into larger studio. Obviously this means higher overheads, which takes careful thought in the middle of a recession, but it also means (amongst other things) we finally have wall space.

A blank wall is an invitation to a designer. As soon as the paint dries, I’m sure we’ll drown in post it notes and poorly-taped flipchart sheets. Heated debates will be held at the sharp end of a marker pen. The war room of my most recent project featured 20′ of whiteboard, which became a great way to sketch and walk through design concepts before stepping into prototyping. Drawing on the walls has thus become a minor fetish. It’s highly visible, and thus brilliantly suited to critique. It keeps you moving and alert, rather than immobile in your chair. And it also has the marvellous appeal of finally being able to do something you never could as a kid.

I hope to to share some of our scribblings in due course.

Posted in creativity, design | No Comments »

Architecture of the stadium

Tuesday, March 3rd, 2009

People are often surprised to hear I’m a devoted football fan and Cardiff City supporter. Perhaps it doesn’t gel well with people’s perceptions of me (whatever those may be); however, I find football gives me an exciting break from daily concerns, and a chance to be part of the tribal culture inherent within us all. It’s a way to feel friendship with total strangers, an outlet for anger, joy and happiness, and an opportunity to mix with a wider cross-section of people than my limited horizons otherwise offer.

New Cardiff City stadiumI also have a huge love for the stadiums and they remain one of the reasons I prefer to follow Cardiff at away games.

Stadium architecture has a clear effect on the physical presence of the club and atmosphere at games. The psychological effects on fans, referees and players are well-documented, but home advantage is also believed to give a genuine physical edge, hypothesised to be caused by testosterone increases in players. This effect is especially strong in defenders and goalkeepers, for whom the battle is particularly territorial.

Stadiums must also have logistics and facilities for up to 80,000 visitors (around the population of Shrewsbury), hundreds of police, stewards and officials, media and players. The range of requirements is pretty astonishing.

Clubs are known by the reputation of their grounds and the atmosphere they inspire. Some teams are known for poor support and quiet games (the “prawn sandwich” brigade). Cardiff, on the other hand, have a reputation as a very intimidating club. There are many reasons for this: passionate fans, unfortunate hooliganism, and the constant battle to be noticed against Wales’ supposed national sport of rugby. However, the stadium plays a huge part too.

Ninian Park

Ninian Park is a classic ‘old style’ stadium, well beyond its useful life yet still possessing the hallmarks of bygone eras: terracing, woeful facilities, and some intangible ‘character’. High among Cardiff fans’ many concerns for the future is the worry that atmosphere and indeed a piece of the club’s identity will be lost as we move into our new stadium (at top) in May.

On my travels with Cardiff I’ve been to some dismal grounds, and loved them all (a foggy January week night in Mansfield where you couldn’t even see the other end of the pitch comes to mind). Below, Watford’s stadium: ugly and an easy target for ridicule, but possessing far more character than many other grounds I’ve visited.

Laughable stand

And then there’s always the rare occasion when your team performs and suddenly you find yourselves part of something huge:

Cup Final

This is my best shot from last year’s FA Cup Final, which Cardiff pretty much fluked our way into. Wembley is of course enormous, and again the atmosphere is shaped by the architecture. Expensive facilities and location make for expensive tickets. This (and the sponsorship derived from TV coverage) means money spare for banners, flags and other paraphenalia. Huge crowds make for huge expectations, high ceremony and lengthy big build-ups, but they also make co-ordinating singing impossible. Many Cardiff fans said they didn’t get the same sense of atmosphere as at a traditional away game, since the noisiest fans were spread across the ground rather than, as is common, concentrated in a group.

The nosebleed-inducing height also changes one’s experience of the match. From here you can see the sweep of the game, like a general, but not the blood and sweat of the touchline.

This post is clearly an excuse for me to indulge a slight stadium fetish; however, I do think they provide great examples for how our identities, attitudes and actions can be shaped by the built environment. A branding exercise writ large in brick, if you will.

Posted in design, personal, psychology | 2 Comments »

The making of Tourdust

Monday, February 9th, 2009

Tourdust.com screenshot

A few weeks ago, a new travel startup called Tourdust quietly slipped into public release. It was my first major project for Clearleft, so I’d like to explain a little about the design process, challenges and decisions involved in its development.

Information architecture

The Tourdust proposition is a classic exploration of the long tail: linking offbeat, authentic tour experiences with travel geeks across the world. Think olive oil tours or bear watching, not package deals; a shared platform for small operations that may not even have websites of their own.

Since the site intends to house thousands of travel experiences, IA was a primary concern from the outset. Holidays involve a broad information space, with extensive metadata: duration, location, activity, organiser, price, availability, cost, and so on. Slicing through this data could be a daunting challenge for users, so an early task was to focus on how people understand and find travel experiences.

After design research, personas, scenarios and considerable thought, we concluded that the two critical factors in choosing an ‘active’ holiday (as opposed to a week sunbathing) were what the activity is and where it happens. It’s therefore no accident that these two variables are featured prominently on the site, as both navigation and headings. For a while, I even pressed (gently) for the site to be called everythingineverywhere.com.

Navigation

Since what and where operate independently of each other, they lend themselves well to faceted navigation. However, many faceted systems aren’t good at conveying their function, so we made the decision to split these two key variables off and turn them into primary navigation by means of dual nav bars, part breadcrumb and part hierarchical menu.

Breadcrumb navigation from tourdust.com

The other metadata is mostly taken care of by a “refine bar”. I believe it’s far better to show many results (particularly so in the early days when product numbers are low) and allow the user to trim the scope, than to create a bulky and elaborate “advanced search” feature that could confuse and easily return no results.

Refine bar from tourdust.com

Unusual controls like these can be a risk; they’ll only be successful if users understand what they do, and how. The designer has to quickly suggest and demonstrate their operation through affordance and example. The affordance is largely visual: arrows, 3d overlap, and the behaviour of the menus as new options are selected. Demonstration by example occurs when a product is selected, possibly off the homepage. The dual nav is updated to show the intersection of activity and location (eg. “Cycling in Germany”), quickly establishing an understanding of how the controls work independently.

Of course, since these were uncommon controls, the proof was in the user testing. Paper prototypes were the order of the day here, mostly for budgetary reasons. Had more time been available we would have undoubtedly created HTML prototypes using Polypage to be watertight in our conclusions. However, they tested well for an unusual UI element and we felt confident this approach would allow for simple yet powerful navigation through this complex array of products.

Visual language

Another factor we agreed early on is that visual impact plays a huge role in the travel industry (not a massive leap of imagination, given the glossy large photographs seen in printed brochures). It was therefore very important for us to make the products as visually exciting as possible.

Large skiing picture from Tourdust.com

My early sketches involved very large, widescreen photos, and this detail was carried all the way into the final product. The widescreen format allows for some great detail of landscapes and panoramas, without the vertical overhead.

It also involves some tricky cropping mechanics. Most cameras take pictures with a 4×3 ratio (landscape) or 3×4 (portrait). The site halves the short side and instead uses an 8×3 ratio. Therefore, when a user—in this case, a tour operator—uploads an image, the system prompts them to crop the photo to show the top, middle or bottom half (the Maths is more complex for portrait shots). This cropping is initially done by clever CSS, repositioning the image vertically behind the 8×3 slot. Once a choice is made, the crop is made server-side for improved performance.

Process

We designed and built Tourdust as an Agile project, in collaboration with our Rails dev partners, New Bamboo. I’ve discussed the challenges of Agile design on A List Apart, but I believe that despite a few teething problems mid-project (mostly a cause of us not allowing enough lead time for design), the site is better than we could have created under waterfall methods.

In particular, since the clients were still exploring the business space whilst the site was being built, the business model changed halfway through development. With waterfall, this would have been beyond the point of no return, but with Agile’s flexibility we were able to accommodate the new requirements with only modest difficulty.

We also found ourselves fulfilling a strategic role as well as just designing the site experience. Frequently this involved reaching into the realms of service design, advising on features, functionality and proposition. One of the outcomes of this liaison was that great swathes of functionality were cut en route. “Worry about it when you need to worry about it” became a useful answer for many scalability questions. I think taking these bold decisions gives Tourdust more focus and a better user experience.

Endgame

Lest I paint too glowing a picture, the site isn’t perfect. Had we had more time, there are dozens of tweaks we’d have made. Imperfection is usually a tricky proposition for designers, particularly so at Clearleft: we do believe the devil is in the details, and our work is usually subjected to high scrutiny. Despite this, we’re proud of what was achieved on a modest budget, and hope we’ve given Anna and Ben the best platform to make Tourdust a success.

Of course, it’s a potentially difficult time to launch a startup. The recession is likely to dent the high-end, luxury travel market, meaning the site’s primary focus is currently on local, UK-based tours. But I do think, if the range is broad enough to gain traction, Tourdust can emerge on the other side in a strong position. I also couldn’t think of better people to take on this challenge than Anna and Ben. People who’ve put everything on the line to follow their dream are an inspiration, and it was a pleasure working with them. They’re true travel geeks and I think their confidence and love for the field will stand them in great stead.

Of course, it’s also down to the users, so I’d encourage you to have a play and I’d love to hear any comments you have about the site.

Posted in design, user experience, web | 2 Comments »

Why “best practice” must die

Wednesday, February 4th, 2009

Traffic light showing redAnyone who’s worked in the web is aware of the “best practice” cult. To me, it’s a lazy creed that exhorts us to switch off and plunder others’ work, and the time has come to rebel.

Firstly, there’s the pure language involved. “Best” implies something that cannot be improved upon. A world of best practice gives us creationism, chariots, and gramophones. It negates progress.

There’s also a more sinister side, which is when it’s wheeled out as an argument in design projects that are heading off the rails:

“Ah, but that’s not how eBay do it”.

The unspoken implication is that eBay know better than I, and therefore I should defer to their wisdom. It’s an argument that I find misguided more than insulting. The web runs on the basis of meritocracy in a way that many other industries cannot. “That’s not how eBay do it” is industrial, corporate thinking, entirely irrelevant to the 21st century. For the truth is that large companies often don’t have a clue about design. One’s skill and knowledge are entirely independent of the size of your employer: I’m confident I know as much about my profession as the employees at any large company.

The best practice trump card also fails because it doesn’t understand the nature of practical design. It’s not a transferable commodity: you can’t just screw a design solution into place. Good design must be appropriate and relevant to the particular problem. The factors involved—technological, strategic, sociological—are far too complex and variable for a plug and play approach. To say “Well, a dropdown worked here…” is to ignore factors that can actually work in your favour. A company that rejects the easy route and takes the time to understand technology, strategy and users can offer designs that makes it stand out from the rest.

I’m not advocating isolating oneself from the surrounding environment. For instance, at Clearleft, we regularly perform competitor analysis at the start of a project. It’s useful to see where others’ strengths and weaknesses lie, and helps us understand the landscape. However, not once has it given me the answer to a design problem. That always comes later, with thought, with detail, and after many failed attempts.

So let’s not allow the enforced limitation and unvoiced threats of “best practice” to pollute our thinking. It’s harder work, sure, but standing out and being better always is.

Posted in creativity, design, web | 8 Comments »

Intern position at Clearleft

Monday, January 5th, 2009

Clearleft logoThe time has rolled round again when Clearleft fancies having a fresh face in the office, so we’re currently looking for a Design/Front End Development Intern.

It’d suit someone with talent and enthusiasm (or, better, passion) for web design, UX and standards-based development, but who maybe lacks the commercial experience and wants to take a strong step forward into the industry. As Andy has commented, it’s a fairly challenging role, because we’re known for having opinions about stuff. So the sort of person we’re after has opinions too. Someone who reads, comments, blogs, tweets and generally likes to be a part of the conversation would fit in brilliantly.

Unlike many intern programmes, this one’s actually paid, and of course the right person would stand to learn an enormous amount from the likes of Natalie and Jeremy. Personally, I’ve learnt more in six months of working here than in any other position, so the rewards are definitely there.

The internment internship runs for ten weeks this Spring. See clearleft.com/jobs to find out more.

Posted in design, user experience, web | No Comments »

Getting real about Agile design

Tuesday, December 2nd, 2008

Thrilled to see my article Getting real about Agile design published on A List Apart today. Hopefully it’ll stimulate some lively discussion about a subject that I feel has often been treated rather shallowly. If you have any thoughts on the article I’d love to hear them in the “Join the discussion” section (but please go easy on my pun/neologism “user-scented design”, of which I’m embarrassingly proud).

If you find the topic of particular interest, you may like to know that I’m running a half-day workshop on Agile user-centred design at UX London next year. Alternatively, if you find me of particular interest (I suppose someone must), you’re very welcome to say hello on Twitter or grab my RSS feed.

Many thanks to the ALA team, with whom it’s been a pleasure to work, Clearleft of course, and Johanna for the research help.

Posted in design, personal, user experience | 1 Comment »