FOWD - Designing a web app with character

Continuing my Future of Web Design 2007 notes. Please welcome on stage Denise Wilton of moo.com.

Designing a web app with character

So, what is your character?

Why character? Well if you're like me, you design and develop a website, then you enter lots of nice copy. But is it really nice? How do you want people to feel? Make sure all informative copy is in 'character'.

The tone of your text says a lot more about your web app then your poncy graphics or xhtml validation.

flickr loves you

People love flickr. Not just because it's functional, but because it's nice to them - it has character and personality. Making people feel welcome and keeping them informed in whatever ways they are using the app.

Say what you're saying

Your typeface says a lot about you. Don't use large jagged red letters, unless you are doing a scary site!

Break it down

No matter how simple your app is - break it down into easy steps. Newbies will find all applications daunting to start with.

Functionality first

Use conventions - don't be afraid of these. Character should come second to functionality/usability.

What is it we're designing?

Don't get caught up with the design. Who are you trying to impress? In other words, "don't show off!".

Our work here is done... isn't it?

Once your design is finished, wait for the code, and be sure to apply liberal amounts of tweaking and refining before you move on to your next project. Don't launch a site then forget about it - bug fixing is all part of the process. Don't feel afraid to change stuff and remember, people engaging and sending email is a good thing.

FOWD - Designing for Web Apps

Ryan Singer of 37signals in Chicago, has helped create such celebrated products such as Basecamp, Backpack and Campfire. Not only is he a good designer, he is also a great speaker and I enjoyed his Future of Web Design presentation.

Ten tips for better signup forms

Making stuff up is hard

Ask easy questions first, this helps build momentum. Asking for a name is easy, asking for them to create a username is not.

Username is taken, try this…

Use AJAX to do live checking on usernames. e.g. Rockstar1966 is taken…

Keep it simple

Design the form with the minimum amount of information possible. Disregard passwords at this stage.

Words are your friends

Keep it friendly and conversational. i.e. "Which room would you like to reserve?"

Form Validation

(262) 914 - 5802 and 262 914 5802; are the same number. Make it easy to enter information in any format.

Muse Me

Show examples beneath form fields. i.e. beneath a "Company" form field, you could have "Apple, HP, BMW" .

Tell me what I'm gonna get

Remind people of why they sign up.

Kind Error Handling

Do not use BIG RED CAPITAL LETTERS, instead try this:
Please check the following:
Your NI Number.

A Warm Welcome

The whole experience should be comfortable, the first time a user signs in, they should get a special welcoming page. i.e. "Thank you for signing up".

Just give me the keys

Generate a brief sign up email, then move the getting started guide to the app.

Conclusions

Momentum, think about users, signup doesn't stop at submit, users don't worry about the tool, they just want to do their "thing" — let them get on with it.

Future of Web Design - Brendan Dawes

Halfway through the Future of Web Design Conference in Kensington. I am sitting outside, the sun is shining and I haven't seen so much as any html code. I was hoping for a bit of a brain storming session of best practices and solutions for creating better websites, and by that criteria, I am pretty happy. No, I haven't had to examine doc types, DOM or anything else remotely techie, but instead the focus has been on the user experience. How can we add value to what we already do? Here are some of my notes that I have made on the conference.

Brendan Dawes - Finding your creative vein

Magnetic North

I have had the pleasure of witnessing Brendan talk before, at a Flash Forward Conference a few years ago. Then he talked about design, from some observations he made about his cooker. Not exactly rocket science, but entirely appropriate. Once again, Brendan didn't launch Flash or BBEdit, but instead talked about cowboy films, litter found on trains and good old fashioned bookshops that still prevail, because of adding value, or creating an 'experience' for their customers.

Insert Silence

One technique, Brendan called "Insert Silence". He showed how this delay, this slight delay in user gratification, actually could reap larger rewards in the overall experience. He then showed a clip of the 1952 cowboy film, 'Shane'. He showed his edited version first, then showed the original. The original was more powerful, and in this instance, the baddie, used this pause to create a cruel, and meditated murder, Brendan's edit made it seem like a regular western shoot out.

He also showed examples of how WordPress makes a cool red flash when you delete a comment. Confirming to the user, that the operation has been dealt with, in a slick and reassuring manner.

Priceless.

Silence

I believe in the power of silence. Silence is the part of a song that gives the rhythm section space and notes to form. It is this silence that defines the actual sound. Silence is an important part of buddhist teachings, and I am sure many of my own recordings could do with a lot more of it, oh, and if you ever listen to my neighbour, you'll know just how much, I value the sound of silence.

Nice one Brendan
Peace