drupal 7 ux –

47
Drupal 7 User Experience Bojhan Somers & Roy Scholten

Upload: roy-scholten

Post on 28-Jan-2015

122 views

Category:

Technology


2 download

DESCRIPTION

The Drupal 7 UX maintainers Bojhan & Roy go through the user experience changes in Drupal 7.

TRANSCRIPT

Page 1: Drupal 7 UX –

Drupal 7 User Experience

Bojhan Somers & Roy Scholten

Page 2: Drupal 7 UX –

Drupal usability

*sucks*

Page 3: Drupal 7 UX –

2008: Yes, it's that bad…

• 2 Usability lab tests

• Dries says it should be fixed

• Drupal UX-team

Page 4: Drupal 7 UX –

Core UX

• Drupal 1, 2, 3, 4, 5, 6: focus on the developer

• Drupal 7: focus also on the content

producer

Page 5: Drupal 7 UX –

2009: Drupal 7UX

Mark Boulton Leisa Reichelt

Page 6: Drupal 7 UX –

Biggest UX problems

• What is the front (site), what the back (admin)?

• Where is my content?

• Where do I find functionality?

• Many small issues

Page 7: Drupal 7 UX –

What is the front (site), what the back (admin)?

Page 8: Drupal 7 UX –

Drupal 6 front end

Page 9: Drupal 7 UX –

Drupal 6 back end

Page 10: Drupal 7 UX –

D7: Front

Page 11: Drupal 7 UX –

D7: Front Back

Page 12: Drupal 7 UX –

Seven theme

Page 13: Drupal 7 UX –

Where is my content?

Page 14: Drupal 7 UX –

Find the content…

Page 15: Drupal 7 UX –

Where do I find functionality?

Page 16: Drupal 7 UX –

Drupal 6 admin

Page 17: Drupal 7 UX –

D7UX design principle

80/20% rule: make common tasks easy, others doable

Page 18: Drupal 7 UX –

80%: toolbar

• New top level admin sections

• Shortcuts

Page 19: Drupal 7 UX –

Content

Page 20: Drupal 7 UX –

Structure

Page 21: Drupal 7 UX –

Appearance

Page 22: Drupal 7 UX –

People

Page 23: Drupal 7 UX –

Modules

Page 24: Drupal 7 UX –

20%: Configuration

Page 25: Drupal 7 UX –

& many small issues…

• Interface text

Page 26: Drupal 7 UX –

Before

Page 27: Drupal 7 UX –

After

Page 28: Drupal 7 UX –

Before

Page 29: Drupal 7 UX –

After

Page 30: Drupal 7 UX –

The most effective way to improve your user interface is through copy writing.

Page 31: Drupal 7 UX –

Omit needles words

Page 32: Drupal 7 UX –

& some more small issues…

• Workflow

Page 33: Drupal 7 UX –

Actions are not tabs

Page 34: Drupal 7 UX –

Action links

Page 35: Drupal 7 UX –

Contextual links

Demo movie on the next slide…

Page 36: Drupal 7 UX –

Shortcuts

Page 37: Drupal 7 UX –

Module links

Page 38: Drupal 7 UX –

Dashboard

Page 39: Drupal 7 UX –

Vertical tabs

Page 40: Drupal 7 UX –

The future

Challenges for Drupal 8, 9, …

Page 41: Drupal 7 UX –

Page model

• Blocks

• Fields (Display & Form building)

Page 42: Drupal 7 UX –

Module administration

• Updates• Module management

Page 43: Drupal 7 UX –

Continued improvements

• Information Architecture

• Interaction design

• Usability engineering

Page 44: Drupal 7 UX –

Module maintainers

Are you creating “interesting” interfaces?

Page 45: Drupal 7 UX –

Pattern Library

How to use vertical tabs

buttons

fieldsets

local actions

Standardization

Page 46: Drupal 7 UX –

Drupal 7 UX will be as good as contrib makes it.

Page 47: Drupal 7 UX –

Contact Drupal UX team

http://groups.drupal.org/usability

twitter: @bojhan & @royscholten

[email protected]