Wir waren auf der BUILD 2011 in Anaheim, dem Microsoft-Entwickler-Event des Jahres. Besonders wegen des unklaren Strategiebildes des letzten Jahres waren die Erwartung besonders hoch.

2. BUILD 2011 in Anaheim.
Wir waren auf der Das erwartet Euch
BUILD 2011 in heute:
Anaheim, dem Windows 8
Microsoft-Entwickler- Der Metrostyle als
Event des Jahres. Design-Prinzip
Besonders wegen des Der W8-Marketplace
unklaren Die neuen alten Tools
Strategiebildes des Metro-Apps mit XAML
letzten Jahres waren Metro-Apps mit HTML
die Erwartung
besonders hoch.
Zusammenfassung für die DNUG Dresden Design – Development – Training
www.xamllab.net

3. Das neue Windows
Priorität auf Content Komplett-Änderung
und schnellst mögliche der User Experience in
Interaktion damit. der Computer Nutzung
Die UX ist mobil,
touchbasiert,
metrostyled und
cloudangebunden.
Volle Gestensteuerung
in jedem Detail.
Windows 8 Design – Development – Training
www.xamllab.net

4. Die Startseite
Die perfekte Personalisierbare und
Umsetzung eines hoch aktuelle Startseite
Personal Computer. mit Live-Tiles.
Apps und Livetiles stellt
Bedienen der
sich der Benutzer
aktuellsten und
selber zusammen auf
persönlichen Belange
der Startseite.
des Benutzers mittels
über Apps gefütterter
Live-Tiles.
Windows 8 Design – Development – Training
www.xamllab.net

5. Das neue Windows
Verzicht auf Chrome – Ab Log-In Komplette
also Rahmen und Bedienung mit
visuellen Puderzucker. Gestensteuerung.
Der Look ist Metro at
Der neue IE10 kommt
it‘s best.
ohne Browser-Rahmen
aus, so dass sich surfen
Optik im schon
wie Softwarebenutzung
bekannten Metrostyle
anfühlt.
mit leichtem Windows
Phone 7 Charme.
Windows 8 Design – Development – Training
www.xamllab.net

6. Das App-Konzept
Ein Benutzererlebnis Die Denke geht weg
wie beim Mitbewerber von schwerer Software
– allerdings hin zu kleinen smarten
metrostylisch und mit Apps.
einem vollwertigen PC
Die Apps erhält der
darunter, was ein riesen Benutzer aus einem
Unterschied ist zu entsprechenden
reinen „App-Viewern“. Marktplatz.
Die Apps laufen im
Parallelbetrieb.
Die Plattform Design – Development – Training
www.xamllab.net

7. Windows 7 dahinter
Der Wechsel zwischen Hintergrundsystem ist
Windows 7 zu Windows Windows 7 – allerdings
8 ist holprig. Eine verbessert mit
überzeugende erheblich mehr Power.
Integration fehlt noch.
Windows 7 Software
Windows 8 ist eher
läuft weiterhin über
etwas für den
den Klick auf
Endnutzer und weniger
„Desktop“.
etwas fürs Business.
Aber vielleicht
Windows 9
Windows 8 Design – Development – Training
www.xamllab.net

8. Die Hardware
Leistungsstarke Grafik Die Hardware ist
für Touch, Widescreen performant,
in perfekter grafikstark,
Screengrößen- daueronline,
übergreifend multitouch, mit
Darstellung. Riesenpower und -
speicher.
Windows 8 ist gedacht
für Tablets, Desktop-
PCs, Laptops und POIs.
Windows 8 Design – Development – Training
www.xamllab.net

9. Der Tablet-PC
Die dringend Im Praxistest wirklich auf
allen Ebenen.
notwendige Reaktion
auf die Anforderungen Ungute Brüche gibt es
des Marktes. allerdings beim Wechsel
zwischen Windows 8 und
Windows 7.
Im Unterschied zum I-
Pad handelt es sich um Dennoch sind die
hier einen echten PC Potentiale hervorragend,
weil sich hier das Beste
PLUS einem Tablet – aus Windows 7, Windows
also quasi das beste Phone 7 und Tablets
von Beidem. zusammen findet.
Windows 8 Design – Development – Training
www.xamllab.net

10. Windows Server 8
Windows Server 8 Datenübertragungen
Windows Azure bietet im Gigabyte-Rahmen
entsprechende mit geringer CPU-
Strukturen, starkes Belastung.
Backend,
komponierbare
Services und
kontinuierliche
Verfügbarkeit.
Windows 8 Design – Development – Training
www.xamllab.net

11. Azure und der Datenmarkt
Nicht nur Hosting der
Daten, sondern auch
Konsum.
Content kann über
einen Data-
Marketplace
angebunden werden an
die eigenen Websites
über Azure und
entsprechende
Bindings.
Windows 8 Design – Development – Training
www.xamllab.net

12. .Net 4.5
Scott zeigt .Net 4.5 Entsprechende
Webservices für
Visual Studio 2011 hat hochleistungsfähige
einen schönen Websites.
Previewmodus.
Multiuser-Handling.
CSS kann sinnvoll
gemergt werden. TFS-Unterstützung.
Jquery Mobile wird für
APS verfügbar.
Windows 8 Design – Development – Training
www.xamllab.net

13. Die heiligen Worte
Die Plattform enthält: Verkaufszahlen
Windows, Windows Windows 7 mit
Phone, Xbox, Windows über 350 Mio. Geräte
Azure, Office, Bing,
Dynamics, Kinect, Steve Balmer:
Tablets, Phones, neue Angekündigt wird
PCs und Arms. maximaler ROI.
Es sind die Tage des
Windows Developers.
We want you all!
Na dann …
Windows 8 Design – Development – Training
www.xamllab.net

14. Metro-Prinzipien
Modernes Design in Schweizer Typodesign
Anlehnung an ist geprägt durch
Tradition: Bauhaus-Stil Lesbarkeit und
als Basis für das Metro- Klarheit.
Design. Reduktion und
Form follows Function. Animationen stützen
die Emotionalität und
Bildsprache der Metros bringen Leben in ein
und Flughäfen hilft bei Interface.
schneller
Informationserfassung.
Metrostyle Design – Development – Training
www.xamllab.net

15. Metro-Prinzipien
Echten Nutzen bieten Ikonografie statt Icons.
Authentisch digital Informationen in Grafik
sein. aufbereiten.
Reduzierung auf Animationen
Wesentliches. einbeziehen.
Typografie als Design- Mehr mit weniger
Element nutzen. erreichen.
Freiräume lassen. Redundanzen
Interaktion mit dem reduzieren.
Inhalt. Für Touch gestalten.
Aktualität bieten.
Metrostyle Design – Development – Training
www.xamllab.net

16. Designing Metro
Konsistente UX durch Schnell und flüssig:
konsequente Interaktion und
Anwendung des Animation mit hoher
Metrostyles: Performance. Windows 8
Inhalt statt Rahmen unterstützt Gesten und
Die Charm-Bar reagiert mit Animation.
NUI und
Touch-Verhalten mit
Gestensteuerung
erster Priorität
Design-Regelns.
gestalten. Erst
Interaktionsdesign, dann
Visual-Design.
Metrostyle Design – Development – Training
www.xamllab.net

17. Designing Metro
Skallierung über alle Aktualität und Bezug
Mediengrößen durch aufbauen durch
Vektor, XAML, SVG und Lifetiles. Dadurch
CSS. bleibt die Applikation
persönlich und
SnapView:
lebendig.
Jed App hat eine
reduzierte Ansicht,
muss skallierbar und Herstellung von
ausrichtbar beim Verbindungen bedeutet
Landscape- und Interaktion mit anderen
Portrait-View. Applikationen.
Metrostyle Design – Development – Training
www.xamllab.net

18. Designing Metro
Bei Strukturen und Die Tool und Templates
Raster helfen helfen bei der
entsprechende Grids. Anwendung.
Für die Icons ist ein
Die Design sind in Form
entsprechender
von XAML-Styles und
Symbol-Alphabet in
CSS-Style fix integriert.
Arbeit.
Für Animationen gibt es
entsprechende
dev.windows.com
Bibliotheken.
Metrostyle Design – Development – Training
www.xamllab.net

19. Der App-Marktplatz
Zertifizierungsprozess: Marketplace ähnlich
1. Zerfizierungskit zum Windows Phone 7
nutzen Store.
2. Gute und getestete
App einreichen In 3 Stufen werden die
3. Startseite anlegen Apps geprüft und dann
zertifiziert.
Debugging und
Auswertungstools über
die Entwicklerseiten.
Metrostyle Design – Development – Training
www.xamllab.net

20. Metro-Apps bauen
Wahl der Klappt in den Demo-
Programmiersprache Apps überzeugend gut.
nach Zweck und Erste Test zeigen das
Vorlieben: System aber noch als
XAML, HTML unfertig und buggy auf.
JS, C#, C++ oder VB
Die Tools sind zum
Tools: Download verfügbar
Visual Studio 2011 den und auf dem Tablet.
Code
Blend 5 für die Für uns erfreulich:
Oberfläche XAML bleibt!
Die Tools Design – Development – Training
www.xamllab.net

21. Apps in XAML
Aus XAML-Sicht verhält Animationen werden
sich das erstellen von mittels Libraries
Apps wie gewont integriert, sind aber
teils schon implizit
Controlsstyling kann vorhanden.
implizit durch den Auch hier gilt:
Metrostyleerfolgen Der Metrostyle liefert
oder verändert werden vieles mit, es kann aber
mit expliziten Styles. alles individuell
angepasst werden.
Es gibt div.
Hilfetemplate. Beispiele im SDK..
Die Tools Design – Development – Training
www.xamllab.net

22. Blend im VS 2011
Aus Blend für die UI- Erweiterungen on Top:
Bearbeitung integriert: Template-Preview
Split-Modus Grid-Einstellung als
Zooming Context-Menu
Brush-Editor 3 Ansichten des
Panel-Verhalten Property-Editors
Objektlayer Verbessertes Styling.
Property-Panal Schöner Grid-Editor.
Visuelles Masken-
Editing Alles ab jetzt verfügbar.
Resourcen-Dialog
Die Tools Design – Development – Training
www.xamllab.net

23. HTML mit Blend
Markup-Editierung Erste Fassung ist schon
WYSIWYG ähnlich zu nett, aber noch etwas
XAML dünn.
User Experience analog Animationslibraries per
zum XAML-Blend Javascript.
Styling-Prinzip analog
zu Styles in XAML, aber
natürlich nach CSS-
Logik.
Die Tools Design – Development – Training
www.xamllab.net

24. HTML mit Blend
Die Styles sind in den Es gibt analog zu den
CSS-Daten integriert XAML-Templates
und müssen angewandt ebenfalls Template-
werden. Dateien z. B. für das
Layoutgrid.
Animationen können
per Libraries
hinzugefügt werden.
Die Tools Design – Development – Training
www.xamllab.net