Vorheriger Artikel Nächster Artikel

Adobe Proto: Mockups am Tablet erstellen

Mit Proto können Mockups von Webseiten auf iOS- und Android-Tablets erstellt und anschließend als bearbeitbarer zu Dreamweaver exportiert werden. Wir stellen euch die kurz vor.

Adobe Proto: Mockups am Tablet erstellen
Adobe Proto Logo
Adobe Proto funktioniert ähnlich wie das Online Tool Moqups, das wir euch vor einiger Zeit schon vorgestellt haben: Man wählt zunächst ein Layout-Modell wie das 960 Grid System und kann anschließend anfangen Elemente auf der Arbeitsfläche zu platzieren.

Mit Tap&Drop können Headlines, Absatz-Text, Divs, Bild- und Multimedia Platzhalter, Formular- und Navigationselemente schnell und einfach platziert werden. Nach einem Tap auf die jeweiligen Elemente können weitere Einstellungen wie Farbe, Schriftart und Ausrichtung vorgenommen werden. Außerdem können Unterseiten erstellt und untereinander verknüpft werden.

Screenshot von Adobe Proto
Adobe Proto Arbeitsfläche

Mockups zeichnen

Mit einer eingebauten Gestenerkennung bietet Adobe Proto eine Alternative zum Tap&Drop-Prinzip. So sollen Layouts intuitiv durch das Zeichnen von Symbolen entstehen können. So steht ein Kreuz für ein neues Bild, ein Rechteck für ein DIV, einfaches Gekrakel für eine Kopfzeile und ein Play-Symbol für ein Video.

Screenshot von Adobe Proto Gesten
Adobe Proto Gesten

 

Die Gestensteuerung ist zwar ein guter Grundgedanke, funktioniert aber in der Realität oft nicht. Die Eingaben werden zu schnell übernommen, sodass man einige der komplexeren Gesten nicht schnell genug aufzeichnen kann. Einige werden sehr oft nicht erkannt oder mit anderen verwechselt. Umso ärgerlicher ist dann der Umstand, dass einige Elemente wie Tabellen nur durch Gesten in das gebracht werden können. Hier muss Adobe auf jeden Fall noch nachbessern.

Vorschau und Export

Für Vorschau und Export bietet Proto eine Vollbildansicht an. Sie wird direkt mit Live Code realisiert - das heißtm man kann sich schon in der Preview durch die Seite klicken und auch die interaktiven Elemente wie Videos und Formularfelder ausprobieren.

Adobe Proto Vollbild Ansicht
Adobe Proto Vollbildansicht

Das gesamte Projekt kann dann als ZIP-File mit allen Codebestandteilen für Dreamweaver exportiert und zur Weiterverarbeitung und für das Styling genutzt werden. Für den Export stellt die App eine E-Mail-Funktion und die Anbindung an Tools wie Dropbox zur Verfügung. Creative-Cloud-Mitglieder können ihre Entwürfe im Speicher der Creative Cloud ablegen und von dort auf ihre Workstations laden. Ein PDF-Exporter zur Vorschau für Kunden und direkte Integration in Dreamweaver wäre hier noch wünschenswert gewesen.

Adobe Proto: Interessant aber ausbaufähig

Adobe Proto bietet eine interessante Möglichkeit, um schnell Prototypen von Webseiten zu skizzieren. Es liefert sofort nutzbaren Code und einige Exportmöglichkeiten. Am Bedienkonzept und weiteren Möglichkeiten für Export und Zusammenarbeit sollte Adobe aber in Zukunft auf jeden Fall noch feilen.

Adobe Proto ist derzeit für und Android in den jeweiligen Stores für 8,99€ beziehungsweise 7,99€ erhältlich. Ein stolzer Preis, wenn man bedenkt, was Adobe noch aus dieser App hätte machen können. Für alle Creative-Cloud-Mitglieder könnte aber die Tatsache interessant sein, dass der Kauf von 3 Touch-Apps einen gratis Monat Creative Cloud mit sich bringt. Bei einem derzeitigen Preis von rund 62€ im Monat macht man so gesehen sogar ein Plus.

Über den Autor

Ilja bigIlja Zaglov ist selbstständiger Kommunikations- & Mediendesigner. Er unterstützt kleine und mittelständische Unternehmen bei der Erstellung von Online- und Offline-Medien. Neben Web-Gestaltung gehören Motion-Graphics und 3D-Inhalte zu seinen Spezialgebieten.

Vorheriger Artikel Zurück zur Startseite Nächster Artikel
Eine Antwort
  1. von tim am 01.11.2012 (11:03Uhr)

    Ist die App mittlerweile für Full HD-Tablets geeignet? Vor einigen Monaten war sie das noch nicht...

    Antworten Teilen
Deine Meinung

Bitte melde dich an!

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden

Mehr zum Thema Adobe
8 geniale Mockup-Tools, um deine App in Szene zu setzen
8 geniale Mockup-Tools, um deine App in Szene zu setzen

Ein richtig gutes App-Design ist für Startups, Coder und Designer viel wert – es mit schicken Produkt-Screenshots überzeugend in Szene zu setzen, aber noch viel mehr. Wir stellen die acht besten.. ... » weiterlesen

Adobe: Schöner Zeichnen am iPad mit Stift und Lineal
Adobe: Schöner Zeichnen am iPad mit Stift und Lineal

Mit dem Stift 'Ink' und dem Lineal 'Slide' bringt Adobe erstmals Hardware-Geräte für die iPad-Software des Herstellers auf den Markt. » weiterlesen

Android laut Studie stabiler als iOS
Android laut Studie stabiler als iOS

Android-Geräte stürzen seltener ab als die Konkurrenzprodukte von Apple. Das besagt eine aktuelle Studie. Allerdings sollen Android und iOS eine generell hohe Stabilität aufweisen. » weiterlesen

Kennst Du schon unser t3n Magazin?

t3n 36 jetzt kostenfrei probelesen! Alle Inhalte des t3n Magazins Diesen Hinweis verbergen