Windows 8.1 Design Ressourcen (auch und gerade eben für Entwickler)

Ich persönlich entwickle von Beginn an für Windows 8 und finde das Design-Konzept, welches Microsoft definiert und deren Umsetzung von den Entwicklern einzuhalten ist, im Großen und Ganzen sehr gut. Damit es euch möglicherweise leichter fällt benutzbare Windows 8.1 Applikationen zu bauen möchte ich euch einige Ressourcen empfehlen, die mir sehr geholfen haben.

Generell möchte ich euch das Windows 8 Design Center besonders ans Herz legen.  Hier findet Ihr Photoshop Templates, Case-Studies, und jede erdenkliche Unterstützung, wie Windows 8.1 Applikationen zu erstellen sind.

Windows 8.1 Applikation-Design

Microsoft gibt vor, dass der Inhalt das Herz jeder Windows Store-App sein soll. Das bedeutet, dass ein wichtiger Aspekt des Designs von Windows Store-Apps der ist, dass der Inhalt wichtiger ist als irgendwelche Spielereien drumherum. Alles Weitere ist eben nur Zubehör – oder eben Spielerei –, mit dem die Interaktion mit dem Inhalt dargestellt und ermöglicht wird. Damit wir das auch hinbekommen, hat sich Microsoft viel Mühe gegeben und Design Guidelines veröffentlich. Dieses Dokument ist für jeden Windows 8.1 Entwickler ein MUSS.

Windows 8 - User experience guidelines 314 Seiten geballte Information, findet Ihr hier

MOC 40043 Windows 8 UX Design Workshop

Falls Ihr euch das lieber im Rahmen einer Schulung aneignen wollt, hat Microsoft auch hier vorgesorgt. Es gibt ein 2-Tages Training beim Microsoft Learning Partner eurer Wahl.
Der Inhalt des Seminars:

• Design-Grundlagen in Windows Store Applications
• Empfohlene Vorgehensweise und Prozesse für die Gestaltung des User Experience (UX) von Windows Store Applications
• Guidelines und Voraussetzungen für den Entwurf für Windows Store Application User Interfaces

Da Ihr jetzt fit seid, was das Applikation-Design betrifft, könnt Ihr loslegen und eure Windows 8.1 Applikationen planen. Dafür sind Mock-Ups hervorragend geeignet.

Mock-Ups mit Balsamiq

Wer kennt das nicht. Man sitzt beim Kunden, soll eine Windows 8.1 Applikation erstellen, aber es gibt keine klare Vorstellung, wie das denn nun aussehen soll. Hier hilft euch Balsamiq Mockup weiter. Das Teil kostet euch zwar $79,—für eine Einzellizenz, ist aber jeden Euro (sind dann ja gleich weniger als die $) wert. Unten seht ihr ein vorher <-> nachher Bild als Beispiel.
Mehr Infos findet Ihr hier
Mit dem Tool könnt Ihr hervorragend Mock-Ups für  verschiedenste Applikationen erstellen (Web, Desktop, iOS, Android).
Damit das auch für Windows 8.1 hervorragend klappt, braucht ihr noch etwas mehr:

Microsoft stellt alle Symbole, Controls und auch die korrekten Bilder für die Devices zur Verfügung um Mock-Ups für Windows 8 Applikationen zu erstellen. Den Download findet Ihr hier

Mock-Ups auf Papier

Interessant finde ich auch die Windows 8 Zeichen-Schablone, um seine Mock-Ups zeichnen zu können. Ihr habt richtig gelesen, so richtig zeichnen…ohne euren PC….mit Papier und Bleistift.
Auch die Vorlage für das Zeichenblatt  A4 findet ihr: hier

Windows 8 Stencil Kit $29,—hier zu bestellen

Zusammenfassung

Ich hoffe, dass ich euch mit diesem Blog weiter geholfen habe und Ihr von nun an richtig Spass daran habt Windows 8.1 Applikationen zu entwerfen und sich das an einer Menge von neuen Appliakationen im Windows Store nieder schlägt.

Windows Phone 8 Emulator und IIS Express

Falls Ihr mit dem WP8 Emulator (xde) auf den IIS Express zugreifen wollt, so funktioniert das erst einmal nicht. Der Grund ist, dass der IIS Express all eure Web Applikationen, die Ihr in Visual Studio erstellt nur für den localhost zur Verfügung stellt.

*) Dazu öffnet Ihr folgende xml-Datei: applicationhost.config

*) Diese findet Ihr hier: %userprofile%\documents\IISExpress\config

Jetzt sucht Ihr in dieser Datei nach dem Namen eurer Visual Studio Applikation. In meinem Beispiel wäre das "WebSample". Kontrolliert bitte unter dem binding tag den Port, dieser muss der Gleiche sein, wenn Ihr die Applikation aus Visual Studio heraus startet.

Damit eure Applikation vom WP8 Emulator aus erreichbar ist, müsst Ihr ein weiteres Binding hinzufügen, und zwar mit eurer IP-Adresse. Also in meinem Fall ist das 192.168.1.103. Das sieht dann so aus:

Im nächsten Schritt erkären wir, dass der verwendete Port durchaus in Ordnung ist, wenn da jemand darauf zugreifen möchte, und zwar macht ihr das wieder in einem command prompt als Administrator:

netsh advfirewall firewall add rule name="IISExpressWeb" dir=in protocol=tcp localport=euerappport profile=private remoteip=localsubnet action=allow

also für mein oberes Beispiel:
netsh advfirewall firewall add rule name="IISExpressWeb" dir=in protocol=tcp localport=33081 profile=private remoteip=localsubnet action=allow

Jetzt müsst Ihr den IIS Express beenden und neu starten (also z. B. durch Starten der Applikation aus Visual Studio heraus). Falls Ihr einen Fehler bekommt, dann startet Visual Studio bitte erneut als Administrator, dann sollte das klappen.

Jetzt gebt einmal die URL in euren WP8 Emulator ein (optional ändert einfach nur die URL von localhost zur IP - vergesst nicht den Port stehen zu lassen - und ihr solltet eure Applikation auch vom WP8 Emualtor aus erreichen können.