forms are boring final nux2 web upload

Post on 27-Jan-2015

116 Views

Category:

Technology

2 Downloads

Preview:

Click to see full reader

DESCRIPTION

There’s nothing worse than a form design project. The thought of laying out page after page of white boxes and labels can send the average designer to sleep. It doesn’t have to be this way.

TRANSCRIPT

forms are boring

Joe Leech NUX2 October 20131

http://www.flickr.com/photos/stovak/2378145902/sizes/z/in/photostream/

@mrjoe

@mrjoe

Hello, I’m @mrjoe, but you can call me Joe

@mrjoe

Just buy it! Only £2.

http://www.fivesimplesteps.com/products/psychology-for-designers

4

5

5

uThere’s a special bit of the brain just for forms

6

I want topunch this websitein the face

8

1. Security isn’t that important

Here’s some form advice.

9

86% of online shoppers feel more confident about entering personal information on sites using security indicators

These guys would say that.

9

86% of online shoppers feel more confident about entering personal information on sites using security indicators

[it] has also observed through field-testing that in part because of the SSL solution, the site has experienced a 26% higher conversion rate

These guys would say that.

9

86% of online shoppers feel more confident about entering personal information on sites using security indicators

[it] has also observed through field-testing that in part because of the SSL solution, the site has experienced a 26% higher conversion ratehttp://www.verisign.com/ssl/ssl-information-center/ssl-case-studies/credit-karma/index.html

http://www.thawte.com/resources/ssl-information-center/inspire-trust-online/index.html

These guys would say that.

10

http://papers.ssrn.com/sol3/papers.cfm?abstract_id=1430482

Reassuring people about privacy makes them more, not less, concerned.

“From a study. Maybe we shouldn’t talk about security too much?

11

2. Don’t do stupid sh*twith HTML5

@mrjoe

@mrjoe

Just because you can doesn’t mean

you should

15

0

min="0" max="99"

What I’ve seen in research is people are drawn to the up/down arrowsText boxes with stuff in, like select boxes we are taught to click to change.

16

T = a + blog 2 (1 + DW)

0

this is Fitt’s Law a very complicated way of saying...

17

T = a + blog 2 (1 + DW)

0

... small stuff is hard to click.

18

They are so fiddly for entering exact values.

Sadly they are very ‘fashionable’ right now. Think before you use.

19

autoplay=”autoplay”

There are uses for this, and no, one them isn’t a MIDI sound track for you site.

20

How did you hear about us?*

How old are you? *

Ever seen these before?

21

I didn’t see them [the asterisks]. There’s nothing that explains what they mean.

How did you hear about us?*

How old are you? *

This blew my mind first time I heard it. I keep hearing it. why?It’s a fake construct. a tech solution to a non tech problem. Think paper forms, how do people complete them. From top to bottom until you tell them to stop.

22

optional

How did you hear about us?

Here’s what to do.Technically it’s a little harderDon’t enter labels in the text field because as soon as you type they are gone. How do you check you responses when reviewing a completed form?

23

optional

How did you hear about us?

required=”required”

Doesn’t cut it I’m afraid.

24

Blink and it disappears. Click submit, go and make a cup of tea, return and you don’t know what you did wrong.

25

Opera is better. But the error message is a bit geeky. Plus it behaves differently to Chrome.

26

Firefox is better, but still, what is a field? Most people think a field is a place where a cow lives.

@mrjoe

There are so many inconsistencies across browsers. Browser guys: you need to agree on an implementation standard.As @Aral says, w3C you need to set a standard.

28

We tested this drag and drop insurance interface 4 years back. Problem was nobody got it. Why?...

29http://www.nature.com/neuro/journal/v14/n10/fig_tab/nn.2932_F1.html

...no affordance. That is no clue from the design what you should do. Like a push/pull door.

Your policy

30

Roadside assistance

Roadside assistance

Roadside assistance

[drag me]

Roadside assistance

We tested loads of design options.

31

Look what won! A button that once clicked animated the movement across.

32

Then along came the iPad. Thank you! Drag and drop became more common place Users tried stuff but we won’t go back and remove that button, not because of affordance but because...

33

Why [drag] when you can click and it goes over automatically?

We are inherently lazy. We will look for the easy option.

34

http://alistapart.com/article/flat-ui-and-forms

Buttons need to look like buttons.

35

3. Encourage honesty

36

In the last 24 months have you used any tobacco products?

Such as cigarettes, pipe tobacco, cigars or nicotine replacement products

YesNo

This is from a life insurance website. The problem; people lie.

People paid nearly three times as much for their drinks when eyes were displayed rather than a control image.

This finding provides the first evidence from a naturalistic setting of the importance of cues of being watched, and hence reputational concerns, on human cooperativebehaviour

37

http://www.fieldexperiments.com/uploads/biology%20letters.pdf

38

In the last 24 months have you used any tobacco products?

Such as cigarettes, pipe tobacco, cigars or nicotine replacement products

YesNo

Adding a face led to more people being honest.

38

In the last 24 months have you used any tobacco products?

Such as cigarettes, pipe tobacco, cigars or nicotine replacement products

YesNo

Adding a face led to more people being honest.

@mrjoe@mrjoehttp://psychologyfordesigners.com/

top related