This presentation explains principles of Application UI design for Windows Store

1. http://lukianets.com

3. What will distinguish the best style apps?

5. 2. Fast and fluid
3. Snap and scale beautifully
4. Use the right Contracts
5. Invest in a great Tile
6. Feel connected and alive
7. Roam to the cloud
8. Embrace Modern UI
principles

8. Modern UI IS OUR DESIGN PHILOSOPHY.
IT’S CLEAN, SIMPLE AND DIRECT. IT
ELEVATES CONTENT.
IT LOVES TYPOGRAPHY. AND WHILE IT’S
UNDENIABLY, AUTHENTICALLY
MICROSOFT, Modern UI IS A FRESH
PERSPECTIVE.

9. Modern UI is not a BRAND.
Modern UI is not a STYLE GUIDE.
Modern UI is not a TOOL SET.
Modern UI is not an INTERACTION GUIDE.

10. Modern UI is not a BOX.
Modern UI is not a STACK OF
TILES.

50. 1. Modern UI
3. Snap and scale beautifully
4. Use the right Contracts
5. Invest in a great Tile
6. Feel connected and alive
7. Roam to the cloud
8. Embrace Modern UI
principles

52. Command-Line
Interface (CLI)
Graphical User
Interface (GUI)
Touch User
Interface (TUI)

56. • Text commands
> Command output
> more command more output
?
Command line interface
• Text commands
• Click, double-click, right click
Graphical user interface Touch user interface
• How to select?
• How to jump in a list?
• How to hover?

58. Press and hold to learn Swipe to selectSlide to dragTap for primary action
Pinch to zoom Rotate to rotate
Swipe from edge for
system and app UI

63. 1. Modern UI
2. Fast and fluid
4. Use the right Contracts
5. Invest in a great Tile
6. Feel connected and alive
7. Roam to the cloud
8. Embrace Modern UI
principles

67. Screen sizes
User experience
10” 1024x76813” 1400x105020” 1920x108027” 2560x160011.6” 1366x768

70. Snap

78. 1. Modern UI
2. Fast and fluid
3. Snap and scale beautifully
5. Invest in a great Tile
6. Feel connected and alive
7. Roam to the cloud
8. Embrace Modern UI
principles

80. Share

83. Search

91. 1. Modern UI
2. Fast and fluid
3. Snap and scale beautifully
4. Use the right Contracts
6. Feel connected and alive
7. Roam to the cloud
8. Embrace Modern UI
principles

93. Tiles
A front door A complete picture
Draw you inPersonal
Next up
Remind you
An extension of the app While you were away
Connected

99. 1. Modern UI
2. Fast and fluid
3. Snap and scale beautifully
4. Use the right Contracts
5. Invest in a great Tile
7. Roam to the cloud
8. Embrace Modern UI
principles

110. 1. Modern UI
2. Fast and fluid
3. Snap and scale beautifully
4. Use the right Contracts
5. Invest in a great Tile
6. Feel connected and alive
8. Embrace Modern UI
principles

115. The Cloud

117. Settings

122. 1. Modern UI
2. Fast and fluid
3. Snap and scale beautifully
4. Use the right Contracts
5. Invest in a great Tile
6. Feel connected and alive
7. Roam to the cloud

125. http://www.buildwindows.com/
http://msdn.microsoft.com/library/windows/apps/hh779072/
http://wp7rocks.com/
http://www.microsoftvirtualacademy.com/

126. nikiluk@outlook.com