Showing posts with label design. Show all posts
Showing posts with label design. Show all posts

Tuesday, February 1, 2011

Do one thing right

I love this post about file storage service Dropbox:

Well, let's take a step back and think about the sync problem and what the ideal solution for it would do:

  1. There would be a folder.
  2. You'd put your stuff in it.
  3. It would sync.

They built that.

Why didn't anyone else build that? I have no idea.

"But," you may ask, "so much more you could do! What about task management, calendaring, customized dashboards, virtual white boarding. More than just folders and files!"

No, shut up. People don't use that crap. They just want a folder. A folder that syncs.

"But," you may say, "this is valuable data...certainly users will feel more comfortable tying their data to Windows Live, Apple Mobile Me, or a name they already know."

No, shut up. Not a single person on Earth wakes up in the morning worried about deriving more value from their Windows Live login. People already trust folders. And Dropbox looks just like a folder. One that syncs.

"But," you may say, "folders are so 1995. why not leverage the full power of the web? With HTML 5 you can drag and drop files, you can build intergalactic dashboards of stats showing how much storage you are using, you can publish your files as RSS feeds and tweets, and you can add your company logo!"

No, shut up. Most of the world doesn't sit in front of their browser all day. If they do, it is IE 6 at work that they are not allowed to upgrade. Browsers suck for these kinds of things. Their stuff is already in folders. They just want a folder. That syncs.

That is what it does.

This is the same kind of thing the folks at Signal v. Noise have been talking about for years.

People who have never designed complex commercial websites may not realize the headache-inducing number of special considerations you need to take into account. For any given product there may be a million unusual scenarios you have to plan for -- and many projects get bogged down with the vast majority of time and energy being spent on fixing issues that may affect fewer than 5% of visitors. Think about that -- spending only a small portion of time on a project for the part that affects 95% of people! Few things frustrate me more than realizing I've fallen into that particular rabbit hole.

The Dropbox tale is a good reminder of how simplification at every level is ultimately much more successful than trying to accomplish every possible goal for every possible customer. Dropbox was willing to say, "we are not the product for the person who wants a corporate-skinned RSS feed of multi-folder data backups." And they beat the competition by a mile.

Monday, January 25, 2010

New work up: JohnCorvino.com


http://www.johncorvino.com/

I met John Corvino in person several months ago, and after learning his partner worked in the same company as I did (albeit in the Detroit branch), we stayed in touch, and he asked me to take a look at working on his website. John is a prominent speaker/writer/lecturer on moral issues surrounding gay rights (hence the moniker "The Gay Moralist"). In fact, he debated Maggie Gallagher, president of the National Organization for Marriage, just last week.

For his site, he wanted to not only give it a clean, vibrant visual makeover, but also make it easy to update and provide an automated way to sign up for an email newsletter. I've found that virtually all clients at this point want the ability to update their sites themselves, and it can be tricky to build a site with a content management system that does not require any coding knowledge on the part of the person doing the updates.

For this execution, I did a slight restructure of the information architecture, and then used WordPress (which I also used for my 2k50 site) for the implementation. I wrote a visual theme for it from scratch and used the "Pages" and "Categories" features to organize the content. I also figured out a few other cool things -- I managed to sync up an RSS feed of the columns John writes for 365gay.com so they appear on his site automatically (and in the proper category). I also used a combination of WordPress plugins and Feedburner to build a free, automated email newsletter for him -- all within the same admin interface as updating site content.

I am finding that WordPress has a lot of benefits (although there are some unfortunate issues that require workarounds), and will probably continue using the service for similar clients in the future.

Check out John's site at http://www.johncorvino.com/.

Friday, December 25, 2009

2k50: An Experimental Project



I've been working on a personal side project called "2k50: The 50 Best Songs of the Decade," which just went up a few days ago. I spent weeks compiling my 50 favorite songs of 2000-2009, and am now posting 5 more every day until December 30 (50-26 are up as of this writing). This project also served as an opportunity to further explore Wordpress as a site management solution. It worked wonderfully, and has given me a lot of insight into how to build sites that clients can update themselves even if they don't know how to code. Furthermore, I even learned a new thing or two about CSS layouts. This may not mean much to those who don't know coding, but I was able to design the site using solely text and CSS-scripted boxes of color -- this is a great technique in general as it not only makes pages load faster, but improves searchability.

Check it out: 2k50: The 50 Best Songs of the Decade

Tuesday, November 24, 2009

Removing ego from design

One of the most difficult aspects of any web design project is reconciling the goals of the designer with the goals of the audience. (And by "designer," I am including everyone involved in the design process, including the client, the design agency, etc.) This is so difficult because the goals of the designer include so many facets -- the client wants to get more money coming in, the agency wants to please the client to get more work in the future, the creative director wants to wow other creative types with his/her vision and maybe win an award, etc. And amidst all of that as well are political power plays, internal arguments, and some "selective hearing" when it comes to research and statistics that don't support their individual goals. (I speak of no particular agency or experience here -- these are accumulated observations.)

The whole rigmarole can be a bit exhausting and it is very easy to get caught up in the "designer" side of things. It all seems quite serious - to step back and think about the fact that people can get into shouting matches over a single word on a website (I've seen it happen) - I don't know, it seems like the perspective is off. People take these battles very personally, and fight for things because they want them, or because it means something to them, and it's easy to forget that all that really matters is whether or not somebody going to your website is going to have a good experience.

This is why I've found it so valuable, in my own work, to start viewing the work I do as completely separate from who I am. Much of what I design is based on research - knowing what works and what doesn't - but there is not enough research in the world to make every decision foolproof. If something was a subjective call, or I designed based on a hunch, and someone takes issue, I'll explain my viewpoint but recognize that if I don't have an empirical study to back it up, it's really just an opinion.

In addition, when working in a group environment, letting go of ego can make the brainstorming and overall creative process a lot more open. An idea prefaced with "this may be stupid, but..." could end up being the best idea of the day, while one that someone thinks is surefire could be quickly tossed out as the details are thought out further. When ego is involved, the initial "stupid" idea might never be brought up for fear of a negative reaction, while the "surefire" idea might be fought for tooth-and-nail to the detriment of better options. Letting go of ego - where you perceive comments about your idea as a comments about you - switches the emphasis to the ideas, not the people.

This ends up being quite liberating in the long run, because not only does it make it easier to edit and adapt your design as more learnings come in, it also makes you focus more on what will best serve the end user. And in the end, that's really the truest measure of a successful design.

Monday, June 29, 2009

Typical can be good

Anyone working in a creative field will feel, from time to time, a little bored. It may feel like you've done the same thing before, and it feels like you're going through the motions. "This just feels so typical." So you try to shake things up by doing things differently, by starting from scratch, deliberately avoiding the way you've done things before.

That's good, right?

Well... not necessarily, particularly in web design.

While creative people may get bored, most people -- your consumers -- tend to resist change. Change is uncomfortable and unexpected. We operate on muscle memory a lot -- most web visitors know to click a logo for the home page. Most people know how tabs work. Most people understand a dropdown menu.

When you start changing those fundamentals, you're forcing people to learn something new, you're breaking well-entrenched habits, and you are putting your visitor in a position of unfamiliarity.

You can try to push past the typical in many aspects of design, just don't forget that the visitor is probably coming to your site to get something done, and they will accomplish that better if, at least at the interaction level, the design follows standards they are familiar with and have used before. Typical is often actually the best way to go.

Wednesday, March 11, 2009

One great logo



This is apparently a few months old, but I just spotted it for the first time this past week. Boston has long struggled to make the Downtown Crossing area into a nicer shopping area/pedestrian mall, and their efforts have largely been met with a "meh."

If this logo is any indication, they are moving in the right direction. I generally think overly clever logos with overlapping words just end up looking confusing and overwrought, but in this instance the words overlap brilliantly and the T-as-cross really fits perfectly with the "Crossing" aspect.

I haven't been this impressed by a logo in a long time!

Pointless "innovation" (the new iPod Shuffle)


Before I began this blog, I attempted a different style of blogging elsewhere that was intended to focus more on good/bad examples of design. My first example of good design was the iPod Shuffle. The multi-colored clip-on items were only a little bigger than a postage stamp and I loved them. They were perfect for the gym, or if I wanted to ride the subway in town for a night out without having to stuff my pockets with an iPod.

Today Apple announced the new version of the Shuffle. It is not all that drastic a change, and there are some new features I like, such as the ability to hear the song/artist name spoken to you while listening and the addition of controls to the headphones.

But most of the other changes seem either pointless or actually negative.
  • The Shuffle is now even physically smaller than before -- but was anyone even asking for this? The previous Shuffle was tiny as it was -- it weighed less than an ounce already. I can see the benefit in reducing weight with slightly larger objects, even something as small as a cell phone can benefit from being a few ounces lighter. But when you are changing something to be tenths of an ounce lighter, will anyone care?
  • There are now no buttons on the Shuffle itself. The idea of adding inline buttons to the earphones is great -- but making that the ONLY way to interact with the device is a mistake. You are now requiring your audience to use only specially designed earphones with the device.
  • The size of the storage has increased to 4GB. There really isn't any harm in adding more storage, but for many people the 1GB (or 2GB) was probably sufficient. And the new 4GB is over 60% more expensive than the old 1GB. Is that price increase worth a memory jump that many may not need? For now, the old 1GB version is still available, but it will undoubtedly be phased out.
  • This is purely cosmetic, but -- why only silver/dark gray options for colors? Apple has an affection for clean lines, which I love, but when your object is about half the size of your pinky finger with no buttons or interface on most of the surface, you risk going from "sleek" to "lifeless." A little color would at least allow some personality.
I have to wonder, why did Apple bother? The voice reading of tracks was a very nice touch, but otherwise there is little innovative here. In terms of convenience, the size of the Shuffle was no longer an issue. The area probably most asking for innovation is the headphones now -- wires still get tangled, they are aesthetically unpleasing sometimes, and can get caught on things. Why not focus their innovative efforts on something like making wireless earphones standard? And if that is a difficult goal, why even bother at all with tweaking something that was already extremely effective as is?

Tuesday, March 10, 2009

Trust and faith in design

It's a cliche to make fun of older generations and their discomfort with technology, but that stereotypical technophobia is really just an extreme version of something all of us probably feel at some point or another: a lack of trust and faith in the system we are using.

What does this button do?
I remember having someone ask me, "What do I do to submit the form? Do I press the submit button?" The answer, to most of us, is "yes, duh." But what if the question is less clear? Navigational terms don't match what you thought you'd find. Something you thought was a free trial asks for your credit card and doesn't explain why. A link that seemed obvious takes you to a completely unexpected page or site. In each case, the design is playing fast and loose with the user's trust and faith, and as a result, is probably failing the user's needs.

Anticipate the next step
Good design anticipates what the user will want. On your homepage, offer links to the things your visitors most likely will want. Look at the search terms people use to find things on your site, and make sure your navigational terms match them. Whenever you ask a user for information, explain why you want it and how it will be used.

Explain yourself
One place that I frequently see abused is the "contact us" page -- many sites will ask for name, address, phone number, email, sometimes even fax number and company, and in worst-case scenarios, they'll even tack on some "survey" type questions -- even if all you wanted to do was maybe email them to ask about the release date of an upcoming product. In that scenario, literally the only piece of information the company actually needs is your email address. So why ask for the moon? Is it because your designer just used a "contact us" template and didn't really think about what that means for the user? Is it because you are adding me to a database you are going to sell to third parties? And even if all you do ask for is my email address, will you start sending me unwanted email newsletters without asking? Tell the user up front, and let them make the informed decision. (Even better, in this scenario, you could save the user and yourself time by having just clearly listed the product release date on your site in the first place.)

Expect questions, and provide answers
One thing I try to do when starting any project is just write down a list of questions I think a user/visitor may have, based on the type of site/product and the customer base. I try not to get overly specific but the questions should not just be the broad ones either -- for example, on a shoe site, I wouldn't write out questions about a particular pair of shoes, but I might write out questions about broader types of shoes, or questions that might apply to any individual pair of shoes.

Prioritize and group logically
From there, I try to group the questions logically, and see if they align to particular terms. If possible, prioritize the questions as well, and make it easier to find the answers to those more essential questions. This is also where some statistical data can come in handy -- search terms used, frequency of visits to particular areas of a site, volume of support emails/calls about particular topics. Maybe half the visitors to your site are just trying to find your address, and already know all about your product/service. You could have a beautiful, highly usable presentation of your product line, but if that address is hard to find, you are failing half your audience from the start.

I've found that structuring a website around this is a good way to meet user's needs, and a lot of this work can inform other decisions down the line, and make it easier to work in changes/new ideas -- just follow a mini-version of these steps (asking questions, grouping them, working out logical answers) and see if your architecture already accommodates these changes or if you need to restructure.

By anticipating everything the user will want, and providing easy answers to key questions and presenting them at logical points, you build that trust and faith. You're more likely to have a happy customer, and you reduce anxiety.

Monday, February 2, 2009

michaelhisten.com 3.0



It wasn't that long ago that I did a redesign of my portfolio website, www.michaelhisten.com. It was not a very dramatic change, it mostly focused on enhancing the content and involved adding my beloved color switcher. But as I started writing more in this blog, I realized I wasn't listening to a lot of my own advice when it came to my own site.

I was concerned about a few things -- one, the level of simplicity of the old site was so extreme that I was worried people would assume that's all I could do. To make up for that, I've ditched the "no graphics" concept and used some imagery and gradients, including using the font FD Helwoodica, an all-lowercase distressed take on my favorite font, Helvetica.

But perhaps my biggest issue with my site was that I was falling victim to that perennial trap -- thinking my content was more interesting than it was. Some site statistics bore this out, but basically, people didn't bother reading much of any of the content pages and just went straight for the portfolio section. To top it off, my portfolio examples did not have thumbnail imagery to give you a preview until you clicked on the name of a project. This, combined with some research into how other designers out there are presenting their profiles, led me to embrace the idea of a one-page website.

Yup, just one page, there's nothing more than what you see when you land there. Of course, clicking thumbnails gives you larger views (much larger than before -- more than twice as large, in fact) of each project, but now all those projects are front and center. I think the end result is that people will get a quick glimpse of what I can do, and they can then read a little bit in the area at the bottom of the page, and then I encourage them to contact me for more. If they want to read more about me and my design philosophy, the blog is right here. All in all, I'm very happy with the update.

Oh, and that color switcher is still there -- I still love the idea of giving visitors a little interactivity!

Wednesday, January 21, 2009

"In a perfect world..."

Most design agencies are structured into silos, with people specialized in different aspects of the design and management. I wrote about some of the problems this can create in an earlier post, but there's another aspect to specialization: we expect people in later stages of the process to be able to fully realize the ideas we have as designers earlier on in the process.

I have seen too many times an idea get implemented either without the interaction/design fully realized, or just plain implemented wrong. The results are almost always disappointing, and sometimes that seemingly small difference between well-polished and rough-around-the-edges is the difference between easy and frustrating. A poorly-implemented great idea is often worse than a well-implemented mediocre idea.

This is a tough situation to deal with, because often you won't know if the idea fails in implementation until it has actually been implemented, and at that point it may be too late to try an alternate approach. And even if you know it is risky, sometimes it is worth the risk. My best suggestions?

Make a sample version/functional prototype
Try to create a mini version of your big idea. Problems may rear their head that you didn't expect, while things you expected to be difficult may work out smoothly after all. In either case, it should tell you if it is worth exploring further or abandoning.

Do it yourself
You can't always do this in a large agency (in fact, you probably rarely can), but one of the benefits of working small or being an all-in-one freelancer is that you know fully the skills and knowledge of every one at every step -- because it might be you in every role. You may not know every single aspect of how to create something in advance, but it's important that you at least know how to learn everything needed, and that you can do it within the scope of your project.

Have a well-thought-out Plan B
Sometimes your Plan B may just be an earlier brainstorm that wasn't fully realized, but just as you should design for user failure, you should design for designer failure too. Unexpected obstacles are common, and the more ready you are with an alternate approach, the more likely your end result will be successful. Trying to patch up a sinking ship that has been battered and bruised may be a mistake -- sometimes you just need to scratch that ship and build another one. If you've got the blueprints for the second ship available already, you'll have a head start.

I've half-joked before that I want to become a "reality consultant" -- someone who can look at all the big ideas and plans and offer some cold hard reality about what is or isn't achievable, what will be simple or difficult, and ultimately where energy should be spent to really ensure something good in the end. But until that is a real job, we can all be our own reality consultants and be ready to adapt if our "perfect world" vision doesn't come to fruition.

Friday, October 17, 2008

Objectivity is a dying art

It's hard not to notice, as the US moves into the final days of election season, how increasingly polarized a lot of people are. Making an objective assessment of anything seems to have gone out of style, and I think it's to our great detriment.

This blog isn't about politics, but I think this concept of turning every decision into a battle has carried over into many aspects of our lives, including management and design. Take, for example, a designer who believes strongly in simplicity and reducing clutter (as I do). You'd think the best way to put together a recommended design in that instance would be to analyze what's needed and suggest a minimalist design that still offers all the necessary functionality. But I've seen situations where, expecting push back from a client to add more, the minimalist-leaning designer ends up recommending something that is even more scaled back than they believe it should be. If their design were approved right off the bat, it wouldn't even be what they want. They expect an equally opposing force to fight them, and hope that they land somewhere that looks like their actual recommendation.

The end result is that rather than working as teams to accomplish the best work possible, each faction takes the core of their suggested beliefs and recommends an "extremist" version of it, believing that it will be watered down over the iteration process to hopefully land somewhere close to what they really think is best. Everyone becomes an advocate for a particular strong viewpoint, and the end result is not so much a happy compromise as it is a series of concessions. We deliberately don't look at things objectively because we think, "well, if I'm objective, and the other person isn't, I'll lose so much ground that my stance will be lost." We turn off our objectivity, and sometimes don't even know why we're fighting for things anymore, except that it seems like it's the side we should be on. Sometimes the other side does have a good idea -- a better one than you had -- and we should embrace those as learning opportunities rather than as "giving in."

This process doesn't usually end with a happy solution. It ends with something everyone feels moderately comfortable enough not to continue fighting over.

I don't have any particular proposition for how to change this, beyond just trying to foster objectivity more in your own work. I try to look at my own designs and ask, "is this really the best way?" Sometimes I'll do a full design on something and scrap the whole thing because, after stepping back, I realize my initial assumptions about the best design were off track. I try to listen to critical feedback and objectively accept when that feedback is right. If I love something, but everyone who sees it is confused by it, it's irresponsible of me to ignore that -- I try to figure out why my instinct was off and how I can adjust to avoid making that mistake again.

I'm not perfect at this by any means, but I do value objectivity and think it's to everyone's benefit to be a little more willing to stand back and take a critical look through someone else's eyes. You might see something you never thought of before.

Sunday, October 12, 2008

Widescreens in motion

With widescreens and browsers on the mind, I noticed a nice way to use some of that "extra" space browser windows may provide on larger screens. As I updated my Flash player, I noticed that the "Search" box was located on the far right of the screen, despite there being no other content that far over.



I suspected that changing the size of the browser window would trigger some alternative layout that realigns the search box in relation to the top links. My suspicion was confirmed:



The search box remains right-aligned, but is now placed above the top navigation links rather than next to them.

It's an interesting and well-executed approach, and it should be noted, is not even that difficult to do.

Monday, October 6, 2008

Our widescreen future (and present)

You'd think we'd have this figured out by now, but the ever-changing nature of the internet, computers, monitors, and design has made "How big of a screen should we design for?" a question at the start of every web design project.

The super quick answer to that has changed over the years, from 640x480 WAY back in the mid-90s to 800x600 to the current "safe" standard of 1024x768. Basically, subtract about 25 or so pixels from the width to cover the size of the scrollbar and you should be safe.

But, if you look at trends in monitor sizes -- and many clients do -- you'll notice that the widescreen monitor is becoming more and more prevalent. The screen I'm looking at right now is 1680x1050, and there are plenty of monitors out there with even wider resolution. W3Schools lists the % of people using screen resolutions of "higher" than 1024x768 at 38% as of January 2008 -- which is an increase from 26% the year before. A similar jump would put fully half of monitors at higher than 1024x768 by January 2009 (I think it's time for them to start breaking out that "or higher" group).

For the most part, however, virtually all sites have stopped themselves from designing for anything wider than 1024, even though statistics would suggest that you are serving up unused real estate to about half your visitors. Why not design for larger?

Well, there's a good reason -- as screen resolutions get larger, people are less inclined to maximize their browsers to full screen. But that starts to be a sort of chicken and the egg question -- are users not maximizing their browsers because of the "wasted" space, or is the way we use our computers shifting such that we prefer seeing multiple windows at once?

It would be interesting to see a site take full advantage of wider browser windows -- it is sometimes being done (look at Clear Left or this Particletree example and change the size of the browser window, and you'll see the content adapt), but I think a lot of heavily-trafficked commercial sites are missing out on an opportunity here. There may be a fundamental shift in the thinking behind site design in the not-too-distant future as our viewing area gets increasingly wider and (thus relatively) shorter.

Some additional interesthing thoughts on the subject are at 456 Berea Street.

Tuesday, September 16, 2008

Introducing the color switcher


I've just relaunched my portfolio website, and one of the main new features is the color switcher (pictured above). I realized a few things about my site as I was considering a redesign:
  • My site has a very simple color pallette - black, white, and green - but the green was chosen somewhat arbitrarily. Why not a different color?
  • My site should be more than just a place to show images of my work, it should show some of my coding ability as well.
  • Some of the best design firm/portfolio sites I've seen add a level of interactivity that engages the visitor.
Those three concepts tied together quite well in the concept of the color switcher. I used the code from this helpful tutorial at A List Apart and removed all color declarations from my primary CSS style sheet (sorry if this is a bit codey for the non-coders), and then created seven style sheets that dealt only with colors. It also creates a cookie which remembers what color you last chose when you return to the site.

All in all, it is a fairly simple concept that can be executed in larger ways for other sites, such as changing font sizes or allowing re-skinning for users, and can extend well beyond colors into entirely reformatting the visual structure. CSS Zen Garden is a good example of this taken to the extreme, although unlike CSS Zen Garden, my color switcher requires no page refresh.

Pretty neat, huh?

Monday, August 25, 2008

Learning to be self-aware

Jumping off of a concept from my last post about common sense usability, one of the most important things a good designer (particularly in the usability field) needs to be is self-aware. In general, people are extremely un-self-aware. Concepts of time are often way off (anecdotally, I remember my mother, in 2007, referring to Princess Diana's death as having been "a couple years ago," when in fact it had been ten years), and we tend to conflate memories into events that either didn't happen or occurred in separate times and places.

This is particularly an issue when working on web design. Very few people stop to ask of themselves the kinds of questions that are absolutely vital for good design. Where does my eye go first? This can help you organize the layout via information hierarchy. Am I moving my mouse to follow my eye? This may suggest good places to have hover states. Do I quickly click from page to page until I find what I want or do I scan a page fully before making my first click? This could inform your approach to site navigation. How many seconds does it REALLY take for me before I get annoyed at not finding what I want? This may determine whether a long-loading Flash module or graphics-heavy page is worth the sacrifice in loading time it may cost.

As important as it is to do proper testing and remember that, as the designer, you are rarely the intended audience, and you certainly know far more about the site than the average visitor will, you can still glean a lot of information just by carefully noting your own reactions -- even reactions to sites that have nothing to do with the one you are working on.

This is also helpful for someone who is not in design, but may need to work with a designer on a project. Are you working at a small organization that needs a better website? You'll be better able to get a top-notch end product if you are able to articulate clearly what your needs are, and you'll be better able to stand up for good usability practices if you end up working with a designer who has a great eye but perhaps a poor sense of usability. Think about your own site. Are there places you (or your visitors) frequently go to on your site that are buried? Is valuable home page real estate being devoted to unsupported or barely visited portions of your site? What aspects of your own site or your competitors' sites frustrate you and what do you find pleasing?

Asking these questions and being aware of your emotional state (by which I mean, happy, annoyed, indifferent, etc.) while browsing can help you pinpoint the design aspects that work and those that don't. So next time you find yourself frustrated by a website, stop for a second and think about what exactly is bothering you, and maybe even write it down. Similarly, next time you enter a site and find the information you want right away, think about what they did right -- this is often just as important or more important than finding the negatives, and frequently we don't even notice when something is done right.

But even when trying these exercises, keep in mind that there will undoubtedly be things you are doing that you are not realizing. It may sharpen your instincts, but for any larger scale project, you'll still need to take that critical look and apply it to other users to truly find underlying patterns and problems.

Tuesday, July 15, 2008

The Hurdle of Visuals

You've worked your heart out on a project, coming up with a great site structure, smart placement of content on each page, and a solid outer shell of basic fonts and colors, and you present the work to your client. What's the first thing you hear? "I don't like the photos." Many of us have been there before. After all your hard work, the only thing the client can see are the images (which usually they have provided and you have no control over). How do you get people to look at the right things?

One of the biggest challenges facing anyone in the field of information architecture/interaction design/usability (etc.) is the careful line of visual fidelity. Human beings are naturally extremely visual people. Look at the stats for most product sites, and you'll probably find that the most visited portions are photo galleries and other high-visual/low-text areas.

Unfortunately, strictly speaking, much of the work in this field is not particularly visual. Yes, a good information architect lays out where things lay on the page, but in many (most?) situations they are not the ones creating the graphics files, choosing colors and fonts, writing copy, taking (and choosing) photographs, etc. One of my favorite sayings comes from the field of film, and basically states, "a good editor has done his job when nobody notices his work." The point being, a bad editing job is going to be obvious and annoying, but a good editing job is going to be completely overlooked as the viewer is immersed in the film itself rather than the editing. The same goes for many user experiences. People notice when it's frustrating, but a seamless, intuitive experience lets the user focus on the content, not the process.

I bring this topic up now because I am wrestling with the best way to present work, both at an internal wireframe level and at a client-facing presentation level. I remember a project at my last job where five members of my team were independently presenting wireframes to a client -- the idea was to treat it almost like a pitch meeting as if we were different firms rather than just members of the same team. It was a fun challenge as we all got along well, but the differences in our approaches were stark. Some of us made ultra-simple wireframes, just black and white boxes with Arial text. Others added a layer of polish with gradients, nicer fonts, and drop-shadows. Some used photographs, others used representative "silhouette" images, some just used placeholder boxes. Before our client presentation, our boss looked across our examples and decided we shouldn't be biasing the client toward or against any design based on the fidelity of the wireframes. Let the IA speak for itself.

This posed a problem for me -- my design was very sparse, and was intended to highlight the imagery of the product itself by minimizing navigation and text. Removing images meant that there were large areas of blank space now in my presentation. Would the client be able to "project" the imagery in their own mind and see how it looked? Would she end up preferring a presentation that was heavy on text and navigation because there was no imagery competing for visual attention?

It's a tricky question. My boss could have suggested the opposite -- everyone HAD to add photos and gloss up their wireframes. But then would the client focus on images chosen rather than the IA? How do you make a client look at the right things? And on that note, how do you get your co-workers to even look at the right things when presenting internally?

The answer all depends largely on who your audience is. You could have a super-savvy client who can envision the finished product just from a wireframe, or you could have a client who sees a wireframe and dismisses the work entirely because it doesn't look like the polished, finished sites they're used to seeing. And on an internal level, particularly in firms where different people work on different aspects of sites -- such as an IA building wireframes and a designer creating the actual visuals -- you can find yourself stepping on toes. Does a high-fidelity wireframe make the designer feel like you're dictating their job? Conversely, does a low-fidelity wireframe make you look sloppy? Can you make something that projects a polished, dynamic end product while still respecting that technically, the visual polish is someone else's job?

In general, I think I tend to over-design wireframes and under-design comps. Most of my wireframing is in an agency environment, where it helps to have nice fonts and clean lines, but inserting sample imagery and venturing into the land of colors and graphics are going too far. Meanwhile, as a freelance designer, clients often can't see the finished product if they don't have imagery in place as well, although I think it's best to use different imagery from what they might see on their live site today, just to underscore that the imagery may change frequently but the structure and visual design will be constant.

Monday, July 7, 2008

Desiging for iPhones

At my last job, for quite some time the place was abuzz with the word "mobile." Mobile apps, mobile this, mobile that. Every client wanted to have some sort of mobile aspect to their sites, and they threw the word out often with little regard for how mobile would be used and whether their visitors even had any need or desire for it.

Somewhat oddly, this seemed to have largely been triggered by the launch of the iPhone, which doesn't actually require any special "mobile" version -- it can access sites just as any computer can. Some folks internally thought that, as things continued moving in a "computer in the palm of your hand" direction, the distinction between mobile and desktop versions of sites would become a moot point.

But a year after the iPhone launched I think it's clear that you can't just plan for the iPhone version of the site to be the same. I don't own an iPhone myself, but I remember using a friend's iPhone last summer to check my Gmail. The process was clunky, and although Google tends to have fairly lightweight sites, it still was rather slow, probably due to the AJAX going on. Recently I borrowed a friend's iPhone and realized that Google had created an iPhone-specific version of Gmail, which showed a marked improvement. I've seen other sites create iPhone versions with far less success -- Fandango tries to get it right, but their decision to spread showtimes for a single movie theater over multiple pages, rather than just keeping them on one scrollable page, was a serious misstep ("scroll fear" really needs to be ditched completely) -- it made me have to memorize showtimes from one page to the next if I wanted to compare multiple movies, and slowed things down by requiring the iPhone to load multiple pages.

All this got me wondering about what sites are worth making iPhone versions available? What sites are users most likely to visit when a regular computer is not available? A few things come to mind -- email, maps, movie times, cafes and restaurants -- the sorts of things where you might want to get a little information about a place while you are out and about.

I don't have any statistics to back those things up -- they are based on guesses and about the kinds of things I think people might want to find when not near a computer. But I think it's important that whenever a company is looking at their own website that they think strategically about what their iPhone users might need. Do they really need an alternate version of the site? Can you design your site in such a way so that it works without needing separate versions for the iPhone? Are there particular tools that iPhone users may be more apt to use (i.e., a Starbucks.com iPhone visitor may need a store locator but not care at all about company info)? And since, to my knowledge, iPhones still do not support Flash, are you making sure to have your site available in a non-Flash version?

I'll be curious to see how sites evolve as the iPhone age soldiers on, and if the upcoming 3G iPhone will have any design ramifications. It is key, however, to remember to view any new web aspect -- whether it is iPhones or social networking or RSS feeds -- in light of your particular company's needs. A poorly executed (or unnecessary) implementation of features often do far more harm than leaving those features out and waiting until there is a clear need for them.

Wednesday, July 2, 2008

Dominant Design

One of the most interesting concepts in design that I've come across covers all sorts of media, and that's the concept of dominant design. My understanding, in short, is that something is a "dominant design" when it becomes so ubiquitous that it is virtually impossible to replace it with an alternative. A good example is the QWERTY keyboard. There was certainly logic behind its creation (although the rumor that part of the design was based around being able to type the word "typewriter" using only the top line of keys is sure to make any usability person frown), but I've heard that testing other layouts has shown that there are, in fact, better ways to arrange the keys. But if you try to sell a computer with a non-QWERTY keyboard, you will fail. The design is too omnipresent to be challenged.

I find this issue particularly interesting lately because it seems a lot of things long considered dominant design are being challenged. The most compelling example I can think of is how the standard gasoline-powered car engine is now being challenged mightily by hybird, electric, and fuel-cell alternatives. The whole "green" movement is having an impact on dominant designs in a number of other fields too, from architecture to food to energy production (one of the most fascinating stories I've heard is how some engineers are attempting to collect the energy generated by footsteps in a building's lobby and use it for power -- a wonderful example of conservation, if it is achievable).

In the world of design, trying to "break the rules" is a perennial goal of many designers. Tell a designer something has to be a certain way and they almost always will want to do it a different way. I met many creative folks at my last job who were always trying to come up with new and "exciting" ways to handle website interactions - a headache for me from a UI perspective as generally "new and exciting" translates to "confusing and annoying" to users. Designers may love change but most people hate it, and many actions are so ingrained that trying to break those habits is generally not worthwhile.

But that doesn't mean that challenging a "dominant design" is a bad idea. It's just important to make sure it's being done in a way that doesn't put off users, and that the impetus for change is coming from the point of view of "there's a better way to do this" rather than "I just want to be different."

Designs often become dominant for very good reasons, and in a pinch, it's generally safe to assume that if everybody else is doing something a certain way, it's fine to follow suit. But stepping back and heading to the drawing board from scratch occasionally is definitely a worthwhile exercise. You may end up realizing that the "standard" way is the best way after all, but it's worth making the occasional challenge to dominant design. You may just end up finding a better way after all.