ux guidelines, how we did it at nokia

13
UX Guidelines how we did it at Nokia Joel Finnström Creative Director Online Sweden Telia

Upload: joel-finnstroem

Post on 02-Jul-2015

307 views

Category:

Documents


2 download

DESCRIPTION

Short presentation about how we work with UX guidelines at Nokia. Presentation given internally at Telia, nov 2012

TRANSCRIPT

UX Guidelines – how we did it at

Nokia

Joel FinnströmCreative Director

Online Sweden

Telia

2

Nokia guideline documents

3

Guidelines?

The easy part:

• A set of UI patterns and

components

• A visual guideline

The hard part:

• A shared idea

• Create buy-in

4

How did we create buy-in at Nokia

• Embedded process

– Thin management layer is key

– Have a team that can do everything needed to deliver an end result

– Make sure everybody had an understanding of programming

– Guidelines can’t be an after thought

• Agile methodology – embrace change

– A guideline is something that exists, it’s not a theory

– Continuous user testing – no big bangs

– Fail fast and improve continuously

– The cost of changing is always lower than the cost of a bad release

5

Design

BusinessDevelopment

Business

Design

Development

6

Product Owners

Scrum-teams

Managers/Leaders

Projectmanagers

Content Managers

Designers

Developers

7

Nokia Telia

Team structure

Team

1x UX Designer

1x Visual Designer

1x TesterApprox. 5x

JS developers

8

Organisation

Development

Central Teams

6 Components

teams

JS Framework

Service Teams

Maps Store Music40+ external

partners

9

Organisation

Development

Central Teams

SeveralComponent

teams

JS Framework

team

App Teams

Maps Store Music40+ external

partners

10

Feed requirements

Returned fully functional components

every 3rd week.

Lifecycle

11

• Each component and pattern went thru several sprints and changed

behavior based on feedback from the product owners.

• Cumbersome but still more effective than waterfall

What did we document?

• Nobody likes to read

• We focused on examples & concrete rules

– Wireframes (Balsamiq, fully clickable)

– Visual designs (pixel measurements, HEX colors, sizes)

– Code (l33t)

– Prototypes (pixel perfect stuff)

– Pattern Flows (Illustrator is your friend)

• Every profession shared the same page

– Designers, Developers and everybody else wrote their stuff together.

• Mostly everyone had write access & commenting was always

turned on.

12

Learnings

• The guidelines wasn’t an afterthought or a separate process; it

was in our daily work thanks to the end to end responsibility

within each team

• It’s more important when NOT to use a component than the

other way around

• The nice guidelines that can be downloaded on

http://harmattan-dev.nokia.com/docs/ux/ wasn’t something we

actually worked with. It’s just marketing made for the release of

the phone.

13