developing windows 8 or how to redesign a religion

#techday2012

I‘m the real

PIXEL PERFECT BITCH

that's what they call me

I MAKE YOUR UGLY INTERFACES REALLY PRETTYI DELAY PROJECTS AND EXTEND PROJECT DEADLINES

MICROSOFT NOW USING MODERN UI STYLE TO REFER TO WINDOWS 8 METRO STYLE APPS

LOVE IT OR HATE IT, WINDOWS IS AT THE TOP OF THE OS HIERARCHY

WINDOWS 8: THE BIGGEST REDESIGN IN MICROSOFT’S HISTORY

WINDOWS 8

• it’s a new interface, so you have space

to create and develop some new ideas

for it;

• It’s still at the beginning of its growing

curve, so it’s an interesting challenge;

• exploring is a great way to learn how to

build a new exciting experience for

users;

Every rule in an abstract matter is just a cult.said by Alan Mendelevich

Cult in current popular usage usually refers to

a new religious movement.said by Wikipedia

Forget everything you knewabout developing desktop apps

& get ready to

REDESIGN RELIGION

DO I NEED TO LEARN DESIGN STUFF?!No. Modern UI makes design more accessible to everyone.

SO WHAT DOES THIS MEAN FOR ME?it opens doors for non-designers

all you need is BLEND FOR VISUAL STUDIO 2012

Get rid of the line between

DESIGN and DEVELOPMENT

6 THINGS I WISH I KNEW BEFORE I STARTED

Do more with less - and

THEY‘LL LOVE YOUfor it

choose content over chrome

CHOOSE CONTENT OVER CHROME

BE AUTHENTICALLY DIGITAL

CHOOSE CONTENT OVER CHROME

SLAP A GRID ON IT

think grid

THINK GRID

THINK GRID

1 sub-unit = 5px x 5px

1 unit = 20px x 20px

1 column = 80px

I keep returningto the number

10

THINK GRID

2 sub-units (10px)2 units (40px)

THINK GRID

1 unit (20px)

THINK GRID

1 column (80px)

THINK GRID

100px and 120px as the starting point

THINK GRID

THINK TOUCH

recommended size

when accuracy matters

when it just won’t fit

8mm

DIFFERENT DPI’s

10,6”1366 x 768

148dpi @ 100% scale

10,6”1920 x 1080

207dpi @ 140% scale

23”1920 x 1080

96dpi @ 100% scale

DIFFERENT DPI’s (A LITTLE HELP IN BLEND)

EMBRACE TYPOGRAPHY

think about typography

THINK ABOUT TYPOGRAPHY

Segoe UI

9ptRegularSemiboldBold

11ptSemilightRegularSemibold

20ptLightSemilightRegular

42ptLight

Your app should be

RESPONSIVE, FAST and FLUID

Let people interact directly with content and respond to actions quickly with matching energy.

BE FAST

start 2 3 4 done

start done

traditional

desktop

software

Windows 8

killer app

You should use

BOLD & VIBRANT COLORS

The new face of Windows is a grid of tiles

colored like Skittles.

BOLD COLORS

FF0097 A200FF 00ABA9 8CBF26 A05000

E671B8 F09609 1BA1E2 E51400 339933

LOKU WINDOWS 8 APP

Small things

DRAMATICALLY AFFECTThe quality of entire app

Devote time and energy to small things that are seen often by many of your users, and engineer the experience to be complete and polished at every stage.

ONE MORE

Attractive things

WORK BETTER

BLIO WINDOWS 8 APP

ADIDAS SEATTLE SOUNDERS FC WINDOWS 8 APP

LOKU WINDOWS 8 APP

SUM UPall you need is BLEND FOR VISUAL STUDIO 2012

choose content over chrome

use grid

embrace typography

be responsive, fast and fluid

use bold & vibrant colors

devote time and energy to small things

attractive things work better

WITHIN EVERY DESIGN PRINCIPLES

THERE’S SPACIOUS ROOM TO CREATIVELY

PUSH BOUNDARIES.

AND YOU SHOULD.

developing windows 8 or how to redesign a religion

Technology