Gesturecons – Legende für Multitouch Interaction Design

Gesturecons ist ein Set von wireframe icons, entworfen von Ryan Lee. Diese Icons sind als Download unter Creative Commons License verfügbar.

Diese Icons sind als Legende sehr hilfreich wenn man Wireframes, Interaction Designs, Bedienungsanleitungen oder Dokumentationen von interaktiven Multitouch Systemen erstellt. Besonders für alle Windows7 Entwickler (Silverlight, WPF etc.)ist interessant zu sehen, wie diese Gesturecons zu der Windows Touch API passen. Im Bild wurden diese einzelnen “econs” von Adam Kinney (einem Microsoft Kollegen) zu Windows Touch Gestures gemappt. 

Das coole an der Sache ist: Die Gesturecons können recht einfach in Expression Blend importiert werden um sie in einer Applikation oder in einerm SketchFlow Prototypen zu verwenden, da Ryan Lee die Icons im Illustrator Format gestaltet hat.

Um die Icons in Blend zu importieren, einfach:

1. Ein neues oder bestehendes Projekt öffnen
2. Select File > Import Adobe Illustrator File…
3. Im Dialog die Datei “cs.ai” aus “Gesturecons.zip” wählen
4. Die Artwork erscheint in eurer UserControl in einem Canvas “cs”
5. Zoom out um alle Icons zu sehen "(Strg – oder Mausrad)
6. Im Objects Panel, lösche borders Canvas
7. Rechtsklick icons Canvas und wähle “Ungroup”
8. Wähle den ersten Path, scroll down zum letzen Path und halte SHIFT bei der Auswahl des letzen Path
9. Alle Paths sind nun ausgewählt. Skaliere die Gruppe der Icons herunter in dem eine der Ecken der äusseren bounding box ziehst (Gedrücktes SHIFT erhält die relative Größe)
10. Positioniere die Gruppe passen zum UserControl und zoom out zu 100%
11. Um den cs Canvas zurück zu setzen, setze im Properties Panel, Width und Height zu Auto

Die Gesturecons sind nun in XAML alsreusable vector paths verfügbar. Dann kann man über grouping paths individuelle Icons erstellen und als Ressource verfügbar machen

Danke an Ryan Lee für das Erstellen und sharing der Gesturecons! Danke an Adam Kinney für den Post!