#techday2012
I‘m the realPIXEL PERFECT BITCH     thats what they call me
I MAKE YOUR UGLY INTERFACES REALLY PRETTYI DELAY PROJECTS AND EXTEND PROJECT DEADLINES
MICROSOFT NOWUSING MODERN UISTYLE TO REFER TOWINDOWS 8 METROSTYLE APPS
LOVE IT OR HATE IT,WINDOWS IS AT THE TOP OF THE OS HIERARCHY
WINDOWS 8:THE BIGGESTREDESIGN INMICROSOFT’SHISTORY
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 b...
Every rule in an abstract matter is just a cult.said by Alan Mendelevich
Cult in current popular usage usually refers toa new religious movement.said by Wikipedia
Forget everything you knewabout developing desktop apps       & get ready toREDESIGN 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
TOOLS
all you need is BLEND FOR VISUAL STUDIO 2012
Get rid of the line betweenDESIGN and DEVELOPMENT
6 THINGSI WISH I KNEWBEFORE I STARTED
Do more with less - andTHEY‘LL LOVE YOU          for it  choose content over chrome
CHOOSE CONTENT OVER CHROME
CHOOSE CONTENT OVER CHROME
CHOOSE CONTENT OVER CHROME
CHOOSE CONTENT OVER CHROME
CHOOSE CONTENT OVER CHROME
CHOOSE CONTENT OVER CHROME
CHOOSE CONTENT OVER CHROME
CHOOSE CONTENT OVER CHROME
CHOOSE CONTENT OVER CHROME
CHOOSE CONTENT OVER CHROME
BE AUTHENTICALLY DIGITAL
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 returning to the number    10
THINK GRID             2 units (40px)   2 sub-units (10px)
THINK GRID1 unit (20px)
THINK GRID             1 column (80px)
THINK GRID             100px and 120px as the starting point
THINK GRID
THINK TOUCH recommended size                          8mm when accuracy matters when it just won’t fit
DIFFERENT DPI’s                  1366 x 768      10,6”       148dpi @ 100% scale                  1920 x 1080      10,6”  ...
DIFFERENT DPI’s (A LITTLE HELP IN BLEND)
EMBRACE TYPOGRAPHY     think about typography
THINK ABOUT TYPOGRAPHY Segoe UI                         20pt                                     42pt 9pt         11pt Reg...
Your app should be  RESPONSIVE, FAST and FLUIDLet people interact directly with content and respond to actionsquickly with...
BE FASTtraditional  desktop  software    start    2     3   4   doneWindows 8 killer app              start   done
You should useBOLD & VIBRANT COLORS
The new face of Windows is a grid of tilescolored like Skittles.
BOLD COLORSFF0097   A200FF   00ABA9   8CBF26   A05000E671B8   F09609   1BA1E2   E51400   339933
LOKU WINDOWS 8 APP
Small things          DRAMATICALLY AFFECT                The quality of entire appDevote time and energy to small things t...
ONE MORE
Attractive thingsWORK 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 2012choose content over chromeuse gridembrace typographybe responsive, fast ...
WITHIN EVERY DESIGN PRINCIPLESTHERE’S SPACIOUS ROOM TO CREATIVELYPUSH BOUNDARIES.AND YOU SHOULD.
Developing Windows 8 or how to redesign a religion
Developing Windows 8 or how to redesign a religion
Developing Windows 8 or how to redesign a religion
Developing Windows 8 or how to redesign a religion
Developing Windows 8 or how to redesign a religion
Developing Windows 8 or how to redesign a religion
Developing Windows 8 or how to redesign a religion
Developing Windows 8 or how to redesign a religion
Developing Windows 8 or how to redesign a religion
Developing Windows 8 or how to redesign a religion
Developing Windows 8 or how to redesign a religion
Upcoming SlideShare
Loading in...5
×

Developing Windows 8 or how to redesign a religion

3,759

Published on

The slides I was presenting during Techday 2012 Roadshow.

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
3,759
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
75
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Developing Windows 8 or how to redesign a religion

  1. 1. #techday2012
  2. 2. I‘m the realPIXEL PERFECT BITCH thats what they call me
  3. 3. I MAKE YOUR UGLY INTERFACES REALLY PRETTYI DELAY PROJECTS AND EXTEND PROJECT DEADLINES
  4. 4. MICROSOFT NOWUSING MODERN UISTYLE TO REFER TOWINDOWS 8 METROSTYLE APPS
  5. 5. LOVE IT OR HATE IT,WINDOWS IS AT THE TOP OF THE OS HIERARCHY
  6. 6. WINDOWS 8:THE BIGGESTREDESIGN INMICROSOFT’SHISTORY
  7. 7. 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;
  8. 8. Every rule in an abstract matter is just a cult.said by Alan Mendelevich
  9. 9. Cult in current popular usage usually refers toa new religious movement.said by Wikipedia
  10. 10. Forget everything you knewabout developing desktop apps & get ready toREDESIGN RELIGION
  11. 11. DO I NEED TO LEARN DESIGN STUFF?!No. Modern UI makes design more accessible to everyone.
  12. 12. SO WHAT DOES THIS MEAN FOR ME? it opens doors for non-designers
  13. 13. TOOLS
  14. 14. all you need is BLEND FOR VISUAL STUDIO 2012
  15. 15. Get rid of the line betweenDESIGN and DEVELOPMENT
  16. 16. 6 THINGSI WISH I KNEWBEFORE I STARTED
  17. 17. Do more with less - andTHEY‘LL LOVE YOU for it choose content over chrome
  18. 18. CHOOSE CONTENT OVER CHROME
  19. 19. CHOOSE CONTENT OVER CHROME
  20. 20. CHOOSE CONTENT OVER CHROME
  21. 21. CHOOSE CONTENT OVER CHROME
  22. 22. CHOOSE CONTENT OVER CHROME
  23. 23. CHOOSE CONTENT OVER CHROME
  24. 24. CHOOSE CONTENT OVER CHROME
  25. 25. CHOOSE CONTENT OVER CHROME
  26. 26. CHOOSE CONTENT OVER CHROME
  27. 27. CHOOSE CONTENT OVER CHROME
  28. 28. BE AUTHENTICALLY DIGITAL
  29. 29. BE AUTHENTICALLY DIGITAL
  30. 30. CHOOSE CONTENT OVER CHROME
  31. 31. SLAP A GRID ON IT think grid
  32. 32. THINK GRID
  33. 33. THINK GRID 1 sub-unit = 5px x 5px 1 unit = 20px x 20px 1 column = 80px
  34. 34. I keep returning to the number 10
  35. 35. THINK GRID 2 units (40px) 2 sub-units (10px)
  36. 36. THINK GRID1 unit (20px)
  37. 37. THINK GRID 1 column (80px)
  38. 38. THINK GRID 100px and 120px as the starting point
  39. 39. THINK GRID
  40. 40. THINK TOUCH recommended size 8mm when accuracy matters when it just won’t fit
  41. 41. DIFFERENT DPI’s 1366 x 768 10,6” 148dpi @ 100% scale 1920 x 1080 10,6” 207dpi @ 140% scale 1920 x 1080 23” 96dpi @ 100% scale
  42. 42. DIFFERENT DPI’s (A LITTLE HELP IN BLEND)
  43. 43. EMBRACE TYPOGRAPHY think about typography
  44. 44. THINK ABOUT TYPOGRAPHY Segoe UI 20pt 42pt 9pt 11pt Regular Semilight Light Semibold Bold Regular Semibold Light Semilight Regular
  45. 45. Your app should be RESPONSIVE, FAST and FLUIDLet people interact directly with content and respond to actionsquickly with matching energy.
  46. 46. BE FASTtraditional desktop software start 2 3 4 doneWindows 8 killer app start done
  47. 47. You should useBOLD & VIBRANT COLORS
  48. 48. The new face of Windows is a grid of tilescolored like Skittles.
  49. 49. BOLD COLORSFF0097 A200FF 00ABA9 8CBF26 A05000E671B8 F09609 1BA1E2 E51400 339933
  50. 50. LOKU WINDOWS 8 APP
  51. 51. Small things DRAMATICALLY AFFECT The quality of entire appDevote time and energy to small things that are seen often by many of yourusers, and engineer the experience to be complete and polished at everystage.
  52. 52. ONE MORE
  53. 53. Attractive thingsWORK BETTER
  54. 54. BLIO WINDOWS 8 APP
  55. 55. ADIDAS SEATTLE SOUNDERS FC WINDOWS 8 APP
  56. 56. LOKU WINDOWS 8 APP
  57. 57. SUM UPall you need is BLEND FOR VISUAL STUDIO 2012choose content over chromeuse gridembrace typographybe responsive, fast and fluiduse bold & vibrant colorsdevote time and energy to small thingsattractive things work better
  58. 58. WITHIN EVERY DESIGN PRINCIPLESTHERE’S SPACIOUS ROOM TO CREATIVELYPUSH BOUNDARIES.AND YOU SHOULD.
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×