5 Interactive Design Tips


As some of you may know, I have been involved almost exclusively in Interactive Design for the past two and half years. In that time, I have unavoidably run across some very useful tips that have affected how I approach designing everything I touch — whether print or interactive. I believe these little nuggets of knowledge have made me a better designer, so hopefully you will find something that might help you in the future. So, in no particular order – here they are:

1. Plan ahead
In interactive design, this would involve putting a lot of attention to information architecture, although it also applies heavily to print design. You should always research what it is you’re designing for – who your target audience is, what the ultimate communication objective of the piece will be, and what’s the most efficient way of displaying that message.

I strongly suggest going back to pen and paper when you’re going through this process. Sketch things out. Make brain-maps, get together with colleagues and see what they have to say. Try to find someone who’s as close to your target audience as possible and ask them their opinions.

The planning stage is easily the most important, and most overlooked phase in any project. The advent of computers has made it way to easy to take 10 minutes for planning and jump directly to whatever flavor of design program you prefer and hammer something out. And while you may come up with something “cool,” chances of it solving the design problem will be slim to none (that kind of thing only happens once or twice in a designer’s lifetime).

2. Choose your fonts carefully
This is not rocket science, and yet there are sooo many designers out there who insist on using illegible fonts in the name of “coolness!” My first suggestion to you is to pick up Robert Bringhurst’s Elements of Typographic Style and read as much of it as you can handle. Admittedly, Bringhurst is a hard-core purist – and he can get pretty long-winded at times…but the points he makes are invaluable to any serious designer.

Pay close attention to correct punctuation, nice titling figures, ligatures, and all the other minutia that make fonts beautiful. They will make your work that much more impressive and professional.

3. Pay attention to your copy!
Most designers I know (including me sometimes) will complain about clients adding more of that “other fuzzy stuff” on the page but remember that “fuzzy” stuff is essential to your message. It IS the message. Without strong copywriting, your design is essentially useless. If time and budget permits, hire a professional writer and bounce ideas of them – you will be surprised at how quickly your design can go from mediocre to fantastic!

Also, be sure to explore your own writing skills. Read books, magazines, articles unrelated to design. They will broaden your horizons and make you a better-rounded designer. You will find that you will be able to not only speak more eloquently, but your brain will start using all that extra information to “suggest” new ideas and concepts for your design problems.

When dealing with interactive media specifically, keep in mind that people glance through copy! Keep your message short, concise, and focused. Organize it well and use white space to let the user rest their eyes and mind when looking through your design.

4. Design for the right medium.
I can’t tell you how many times I’ve heard this one: “I want the design of the home page to be above the fold.” This, of course, refers to the bottom of the screen – so if your screen is 800×600, the “fold” would be at the 600px mark.

This is perhaps the most ridiculous request I encounter while designing for the web. First of all, the medium you’re designing for is not a book, so there’s no such thing as the “fold.” And secondly, the idea that all the content of a site should be visible from such a limited amount of screen real-estate is ludicrous and counter-productive! Of course, don’t go blurting that stuff out to your client – it’s rude and innappropriate. Instead, use it as an opportunity to educate them and position yourself in a more strategic situation.

5. Flash Gooood?
As a long-time advocate for Flash, I have to admit that it does have serious limitations that need to be taken into consideration before starting any interactive project. And although many of the Flash’s limitations can be taken care of in one way or the other, it adds to your development budget in a big way.

What are these alleged limitations you ask? Well, how about printing for starters? In order to print in Flash, you have to specifically add a print object and tell it how to behave. And if you have scrolling copy on the page, well…you’re pretty much out of luck unless you’re willing to add another 10 minutes to work out some kind of hack. HTML on the other hand, doesn’t need to worry about this because browsers already have this functionality built in – and it works perfectly 9 times out of 10.

Another big one is search engine optimization. I have mixed feelings about this one though. I believe the whole search engine paradigm needs to shift a bit anyways – but in the meantime, it is still an important tool to many of your clients. And with more people sticking to web standards (thank goodness), the horizon is full of opportunities!

Finally, there’s the issue of maintenance. No matter how good you are at Actionscript, it will take you twice as long to build a custom management system for your Flash site than it will for an HTML site. Flash does play quite nicely with PHP and Javascript these days, but it’s still an extra step to develop for. And then you have the issue that all the good Actionscript developers are already taken – so you end up with people like me who are designers by trade, and yet we’re required to wear the developer hat because we like to see things move.

So when you’re looking at starting your next interactive project…think twice, and even three times before suggesting to your client that their site should be an all Flash endeavour. Instead, look at leveraging Flash for what it does best – adds interactivity to otherwise static boring sites.