Such a pretty @font-face

Web fonts using @font-face CSS rules

A new design opportunity or are we opening a Pandora’s box?

If you were lucky enough to be at Webstock 2011 in Wellington, New Zealand you may have had the chance to sit on Jason Santa Maria’s talk on typography and that just by using CSS 3 techniques our web pages can be beautiful works of art where the typography itself speaks to your users.

Button placement on multipage data entry form

Example form showing layout of form fields, command buttons and overall visual hierarchy

The form consists of labels and input prompts that are left aligned to the input field, with mandatory questions clearly marked with an asterisk (*) symbol.

The primary call to action, the button to move the user to the next screen of the form is placed immediately underneath and left aligned to the last data entry field on the form.

The visual prominence of the button is very strong compared to other elements on the form, in keeping with both Hick’s and Fitt’s laws of human-computer interaction—keep navigation items close and make them large so they’re easier to click.

Design pattern for global navigation

An attempt to map out the logic of how I order global navigation items

If you don’t have an iPhone please go upstairs… That would suck.

Inclusive design

We shouldn’t segregate people based on their (dis)ability. Why is it then that professionals in the UX space haven’t embraced inclusive design? Why do we use shallow personas? We have users will diverse needs in every pocket of society.

Personas have a role

“Challenges in the persona” can identify characteristics of real users and bring it to the forefront when doing design.

Why oh why?

Why is disability intimidating? Is it because we don’t how to approach and engage them?

It doesn’t take a vast number of people. Lisa reminds us that even one person can make a difference.

You have just been challenged

She challenges us. “What are *you* going to do about it?”

WCAG 2.0 is a good thing – but do it sensibly. You don’t necessarily have to comply with every single item on the check list – just make what you do that little more accessible. I have to say I agree.

Rethink your role in a project

A response to a survey Lisa is running about UX testing and web projects. From a back-end person, “Users don’t see my shit.” Are you sure?

Is Lisa being too ambitious?

She’s suggesting we go and and find the users who have disabilities to help us get our designs right. I agree.

BUT – How do I convince a project manager though, who won’t even test their products with users who *DON’T* have disabilities, go that one-step further? There’s no perception of cost-benefit, it “takes too long” and therefore interferes with the critical path.

Head. Desk. Thump.

Is the problem the way the accessibility guidelines are categorised?

Lisa suggests one way of dealing with the requirements is to look at who in a team is more suited for checking that part of the checklist.

Great for large teams like where I work. What about smaller organisations and smaller projects who don’t have the resource, or the knowledge and skills required. Im not saying that Lisa is missing the point, but this is not the solution to all our problems either.

Lisa’s suggestion – if you’re not on a team, just pick a few things from the WCAG list. You’re thinking about people more, you’re doing a better job as a result.

Work ethically. Don’t be lazy. Be sneaky if you need to

I reckon I can do this.

Branding and politics in the same sentence? Scott Thomas at Webstock 2010

Branding and politics in the same sentence? Seriously?

Scott Thomas is talking at Webstock about Barack Obama’s Presidential campaign. Branding and politics in the same sentence? It was fundamental to Barack’s campaign.

Looking to the past for inspiration for today

As well as modern imagery the campaign looked to the past for inspiration reinterpreting well known images there were already deeply entrenched in the minds’ of American voters. It wasn’t always perfect, and there were a few aspects to the campaign that might have stepped over the line, at least in terms of design.

Start by looking at what you already have

Scott’s now taking us through some of the design problems with Barack’s original website. Thirty shades of blue, a little bit of yellow, some scroll bars, and countless number of fonts. A redesign was desperately needed.

Scott’s approach to creating a new site

- understand the problems with the current website – what was most important for the homepage in terms of outcomes — persuasion, fund raising, a stong call to action
- IA fundamental to the process, mapping to a grid — before the detailed design even happens
- colour control — consistency, consistency, consistency – blue and red
- typography — needed to be truly American
- the “fold” is dead – “its gone” – the was just too much information (BUT this is OK)
- constant evolution – updating the design progressively as the campaign evolved
- associate strong calls to action right beside the rich content – activates people and generates participation
- analytics essential to validating the design approach – don’t leave it to the design director – test it “over and over and over again”
- no matter how complex your problems are, if you have passionate people, you can change not only your website, but maybe the world as well

Putting it all into perspective

Scott’s view of the effect of the design planning and integrated approach to the brand for the Obama campaign? “Without this, Obama would not likely to have become President.”