Mark writes...
How many times have you wanted to use a website, only to be asked to fill out an overwhelming and overcomplicated form before even getting in the door? We've all been there, and it sucks. If you're business has one of these sites, chances are you're missing a lot of opportunity to create, amoung other things, new and avid members.
One site that seems to do it right is Kayak, a one-stop travel service that lets you search and book flights from dozens of airlines and other sites. It's a great tool, a joy to use really, and here's why: they make my life easier, but not just in their service offering. Kayak found the soft spot in me recently: dead simple Web forms.
Here's what I mean:
I've been using Kayak for awhile now, but never ran into this until just last week. I had just done my second search in one visit, looking for a round-trip flight from San Jose, CA (SJC) to Milwaukee, WI (MKE). Having just arrived at my search results, this popup appeared. I could have just closed it and went on my way, but a few of things called out to me:
- The title: "Become a Kayak Member. It's FREE."
- A set of 1-2-3 features crafted to my current experience with the site
- Only three form fields to register
- A conversational tone that appealed to the Internet savant in me
While not the most glorious visual design, the fundamentals of this registration popup are sound as steel. The message is that Kayak wants to help me make my life easier, beyond just providing me with a one-stop travel service. They're looking to improve the experience I have on their site, not just with travel in general.
The 1-2-3 tells me they're not messing around—they have 3 great reasons for me to sign up, all centered around my searching experience. At this point, they crafted a unique registration form for me based on what I've done on their site. Now the follow through is on my end, and as I looked at those three simple forms, I was dedicated to the end. The best part, perhaps a fourth selling point, was that they've been paying attention: I fly out of San Jose a lot.
Kayak walks a fine line here, but really pulls it off. By watching which departing airport I search for most often, they've helped me kickstart my registration. All I had to do was give my email address and a password.
The conversational tone they used helped nudge me along, too. "Home Airport" and "Finish" are much better phrases than "Departing City" or "Register." They spark emotion and a feeling of completeness, something that will subtly help users glide through registering.
Take a lesson from Kayak: make it as easy as possible for new members to get in the door. Captchas, spam protection, and numerous security questions should be antiquated in favor of downright intuitiveness and ease-of-use.
How are you helping new members sign up and using your service?
Mark writes...
We at ZURB believe in using our time and efforts effectively in every facet of our work. This doesn't mean cheapening our services, but rather increasing our efficiency by allowing us to focus on more pressing matters such as higher level thinking and core implementation. To that end, here's a list of some key resources for designers and developers.
The World Wide Web Consortium offers up the epitomy of reference sites for CSS, HTML, XML, PHP, and much more. When all of us at ZURB started out coding, or when we need a little refresh on doctypes and the like, W3Schools bails us out.
The Happy Cog crew is widely renown for their ability to educate and present. ALA is the perfect resource for intelligent debates and unique insight on a vast set of design related topics.
37signals took off a few years ago when Ruby on Rails hit main stream with their killer apps, Basecamp, Campfire, Backpack, and more. Since then, they've gone full time with their products, but never stopped blogging and telling it like it is. Their minimalist styles have been quite popular amongst designers and inspired several new design trends.
Richard Rutter of Clearleft brings Robert Bringhurst's The Elements of Typographic Style to the Web. If you design on the Web, you need to have a solid understanding of the basics of typography.
Although Web typography plays a huge role in your online designs, having the right words to say your message are even more important. "Read, re-read, and re-read again" was always the rule going through high school and college. Don't forget it in your professional life.
Ever wonder how to create all those funky characters (», &, ©, etc)? The XHTML Character Entity Reference is a great (and stylish) resource for just about any character you'll need to create for your next website.
The best part about The Designer's Toolbox is that they offer a wide variety of free resources and references for just about everything we do as designers. From Web browser elements to proof reading marks, these guys have put together a great and easy to use resource.
Finding great links got easier when del.icio.us came onto the scene. With a tag-driven format, Delicious (it goes by it's non-geeky name these days) is a great way to surf the Tubes and get just what your want. As a side note, for those who love linking across several sites, be sure to give TinyURL a go, especially it you like to Rick Roll people.
List posts (like this one) have taken off and are kind of a big thing. Smashing Magazine offers up massive lists of resources in just about every post they write. Combined with monthly updates on old favs (like free fonts and wallpapers), they make for a good read any day.
For some of the best from one of the best, you really need to read UseIt.com, it doesn't get better than Jakob Nielsen's commentary on just about everything related to Web design. Usability, design, user studies, and much more can be found in his archives. Now if only he had an RSS feed.
"User Interface Engineering is a leading research, training, and consulting firm specializing in web site and product usability" led by Jared Spool. It's become a great resource and is always a good read.
Debugging IE6 is becoming more and more of a problem as the rest of the browser world keeps pushing forward with various CSS and JavaScript enhancements. Safari and Firefox lead the good fight today, but who knows what tomorrow will bring. When can we use CSS to code our wardrobe?
Luke W. of Yahoo! has been a strategic partner and advocate of ZURB for a long time now and never dissappoints with his user experience blog, Functioning Form. His latest book, Web Form Design, shows just how dedicated he is to the basic experiences we have on the Web.
As The Offspring so eloquently put it, music soothes even the savage beast. For us as designers, it gives us rhythym, focus, energy, and quick bursts of inspiration. For music in a pinch, we use Playlist.com, the fastest growing site on in the United States, and our favorite site for tunes wherever the Internet is available.
And those are just the start! We draw inspiration from all over and look to numerous sites and sources for solid design insight. Hopefully you have one more on your list, but if not, well, we see how it is.
So tell us: what are your favorite resources as a designer, developer, or Intertubes Surfing Extraordinaire (that means you)?
Mark writes...
If you're a designer, you're familiar with the concept of "selling your design." We go through the same process much of the time, pitching new or radical ideas to clients as we present our work. Along the way we've picked up on something big: you need to wow 'em.
But who's them? Your clients, your peers, your boss, and your girlfriend. OK, so maybe not your girlfriend, but definitely the others. Also, don't forget that you need to be excited. Excitement is contagious and if you haven't got the itch, you've got nothing to give. To get people jazzed about what you're doing, you need to be jazzed as well. To do that, you need something to wow people with.
Pitching a design can be as complex or simple as you make it, but it doesn't mean squat unless you've wowed your audience. In the early design phases—in our three step phase, those are the Define and Frame phases—it's easy to forget that. Don't. Great wow factors can be as simple as adding a cool new feature or taking a visual design to the next step.
Here's a tip: if you're coming up short on Wows, brainstorm at a whiteboard with someone for 10 minutes on "next steps." To make your brainstorm more interesting, ask yourself what you would like to see in the project. Whatever it is, just remember that your audience needs to be excited about what you're doing for any successful pitch.
It's the wow factor that seals the deal for every project that we've been involved in. Next time you're pitching a new design or idea, make sure you take it to the next step with a few "Wows." Find out how to get everyone involved excited and then carry that excitement through to the very end. Trust us, it'll pay off in the long run.
We draw things a lot. This isn't shocking--we're a design firm, right? And designers are virtuosos who create pretty pictures and gorgeous web designs.--isn't that the case? We think different.
Why does ZURB sketch? Really, we can't help ourselves. We're visual thinkers so we break problems down by asking lots of questions and build solutions up by experimenting with lots of solutions. Most get discarded quickly. Some survive to see another day. This is our design process at work. We use quick and cost-effective methods like sketching to solve big problems.
Sketching is a great low cost tactic for generating ideas, making decisions and driving things forward inside any business. Some of its benefits include:
-
Helps identify problems. Don't like what you see, how it reads or the interaction between a few pages or elements? Print them out, add notes and share them with your team. You'll be surprised by how little time and documentation it takes to identify problems and start seizing opportunities like this.
-
Quickly generates lots of ideas. You don't need high tech tools or lots of time, just pen and paper to rough out lots of solutions. It's actually hard to get too detailed if you keep it lo-fi and that's a good thing early in the design process. Get all those "what if..." possibilities out in the open.
- Makes it easy to filter out ideas you don't want. Early stage ideas can be tough to grasp when they're trapped in conversation. Quick sketching helps you to try them out a bit and then filter and edit down before taking anything too far into implementation. Leads to a lot of, "Oh, that won't work, what about this" moments.
-
Anybody can join in. Some of the best ideas we've seen start with somebody saying, "Don't make fun of me, I don't know how to draw." Sketching isn't about making pretty pictures, it's about explaining an idea so that other people can get it. It can get team members from any discipline within your company to participate.
-
Invites critique. Sketching is loose and messy and implies, "These are ideas we're trying out, but haven't been decided on yet." They're visual and so lo-fi that most people can feel comfortable contributing to them. There's less ego when there's less polish.
- Makes it easy to rework and refine the ideas you want. Since sketches don't take long to produce, they're extremely easy to reproduce. Through this process we can quickly refine on our ideas.
-
Helps tell stories. Words can only get you so far to convey an idea. Being comfortable sketching in front of other people is a powerful storytelling skill. It's particularly vital to interaction design because it can shed preconceptions and tie ideal user experiences together.
Sketching doesn't just mean putting pen to paper. It's a shift in thinking that gets you to be scrappy with your materials and nimble with your thinking. Rather than settling in to enjoy creating a masterpiece, your goal is to engage yourself and your team in energetic storytelling that solves problems for people. Sketching is at the heart of design thinking.
By getting lots of ideas on the table, getting teams to filter and then collaborate to refine them, ZURB is able to help companies quickly find the most worthwhile opportunities to build. This avoids costly implementation of unproven ideas and drives innovation in our clients' business.
Mark writes...
We're letting the cat out of the bag, folks. We're redesigning, and in a big way. We're overhauling our website, blog, extranet, and much more. As part of our redesign process, we needed to rethink how we approach our work and internal projects in a way that better facilicates activity. We needed a dashboard.
So we built one! From a late night team brainstorm before heading to Red Robin, Dashboard was born. Great name, huh? We think so. Our Dashboard acts as the pulse on everything we do on the Web, and is a unique look at our team's activities. Twitter feeds, del.icio.us links, ZURBword.com searches, and activity on the blog are all routed through Dashboard.
Act and React
From Dashboard, we do everything. We tweet, we link, we blog, we monitor, we create. Your typical dashboard is a jumping off point, a way to quickly and easily access data and actions from a central page. Here we've blown that model out to encompass several tools and sets of data. We're looking to keep an eye on everything we do so we can act, and more importantly, react.
For instance, when I finish this blog post, it'll show up in our Activity feed. The rest of the team will see my post and be able to jump right in to add their own comments and engage those of our readers. Just like a blog post, we're also notified of things like newsletter sign ups. Those numbers are encouraging and offer a unique look at our business that we otherwise wouldn't have.
As a side note, we considered e-mail updates for blog comments, but we decided against it in the end. Instead of e-mail updates for our team, we have a central repository for everything ZURB. This keeps our head in the game while we work, but still keeps us apprised of how we're doing. Also, e-mail is a bottleneck and acts like cold storage more than an heat lamp for activity.
The Big (Little) Reveal
Here's just a taste of what's to come. It's small, but we're keeping a lid on most of it for now. We're only a few weeks in, but is this baby handy.
Those blue boxes across the top are actual business stats, but for now, we're hush-hush on which is which. So why the blue boxes right in our faces? Well, as I mentioned earlier, the point of any great dashboard is to serve as a stepping stone to something else. For us, this means easy access to key drivers of our business, like blog comments and tweets between team members.
Most importantly though, we're encouraged to do more. Having important metrics and a single point of distribution for all our online content means we're activity engaged in moving content. Really, we're on top of it.
