Nachdem im ersten Teil der Serie ein Überblick über Tools für die Produktentwicklung von Internet- und Mobilapplikationen und der Ansatz des Paper-Prototyping vorgestellt wurde, geht es in diesem Teil um den Einsatz digitaler Wireframing-Tools.
Produktentwicklung: Digitale Wireframing-Tools
Nach den ersten Tests der Paper-Prototypen mit Kunden und Entwicklern ist es in vielen Fällen und v.a. bei größeren Applikationen mit einer Vielzahl von Screens sinnvoll, im nächsten Schritt digitale Wireframes zu erstellen. Hierzu steht eine Vielzahl an Tools zur Verfügung, im Folgenden ein Überblick.
Digitale Wireframing-Tools lassen sich grundsätzlich in zwei Kategorien einteilen:
- Templates für Standard-Grafikprogramme wie Powerpoint, Visio, Photoshop etc.
- Wireframing-Tools mit eigenem grafischen Editor und eigenen Templates
Die Vor- und Nachteile der beiden Kategorien sind im Folgenden kurz dargestellt:
Vorteile
Die Vorteile bei der Nutzung von Standard-Grafikprogrammen liegen v.a. darin, dass die Benutzung der Tools meist gelernt und die Software auf den Rechnern der Produktmanager installiert ist. Wireframing-Tools reüssieren v.a. dann wenn Sharing und Collaboration ein wesentlicher Punkt in der Produktentwicklung ist, also Workflows (auch mit verteilten Teams und Kunden) abgebildet werden sollen.
Nachteile
Die Nachteile der Nutzung von Standard-Grafikprogrammen liegen v.a. darin, dass die Arbeit an Wireframes zeitraubend ist, wenn nicht mit fertigen Templates gearbeitet wird oder wenn „funktionale“ Click-Dummys gebaut werden sollen. Nachteile von digitalen Wireframing-Tools liegen v.a. in den zusätzlichen Kosten für Software oder Subscription und in teilweise proprietären Formaten.
Templates für Standard-Grafik-Programme
Templates sind Files, die in die Standard-Grafikprogramme wie PowerPoint, Visio, Photoshop importiert werden können. Am Markt sind sowohl kostenpflichtige als auch kostenlose Templates erhältlich.
- GUI-Toolkits – kostenpflichtige GUI-Templates für iPhone, iPad, Blackberry, Windwos Mobile, Facebook, WebApps, MacOS und Windows auf den Software-Plattformen Adobe Illustrator, Fireworks, Axure RP, Omni Graffle, Keynote, Power Point, Visio auf den Plattformen PC und Mac
- Es gibt eine große Anzahl kostenloser Templates für Standard Grafik-Programme und Oberflächen wie iOS, Android, HTC, Maemo, Palm Pre, Web: ein Überblick über Photoshop-basierte Vorlagen findet sich hier (englischer Link) und ein Template für iOS7 auf Basis von Photoshop hier
Wireframing-Tools
Hier eine Übersicht und Einordnung der 19 verschiedenen Tools nach den folgenden Kriterien
- Welche Plattformen werden unterstützt? (Windows, Mac, Linux, Web, iOS)
- Wie ist das Preismodell? (Einmal-Lizenz oder Subscription)
Fast zwei Drittel der Tools sind mittlerweile Web-basiert und funktionieren in allen Browsern (mit Ausnahme der Flash-basierten Tools, die nicht auf der iOS Plattform lauffähig sind). Viele Anbieter bieten eine kostenlose Basisversion an, verlangen darüber hinaus aber für mehr Leistungen eine monatliche Gebühr (Freemium-Modell), die bis zu 99 EUR pro Benutzer pro Monat betragen kann. Bei den Client-basierten Anbietern werden v.a. Windows und Mac unterstützt (knapp 1/3 der Tools), in einigen Fällen auch Linux oder iOS.
Clientbasierte Tools
Browserbasierte Tools
Teil 2 der browserbasierten Tools für Wireframing:
- iPlotz
- Justinmind
- Justproto I UXPin
- Mockflow
- Mockingbird
- Pidoco
- Protoshare
Fazit
Am Markt existieren eine Vielzahl von Wire-Framing-Tools für die unterschiedlichen Bedürfnisse in der Software-Produktentwicklung, sowohl clientbasiert als auch cloud-basiert und somit im Browser lauffähig. Im dritten und letzten Teil der Serie geht es um dann die Verbindung von Paper-Prototyping mit digitalen Wireframing-Tools.