Kategorie-Archiv: Axure

Axure 8 ist released

Bildschirmfoto 2016-04-19 um 11.28.07

Endlich ist die finale Axure Version 8 herausgekommen und ihr könnt eure Kundenprojekte nun mit der neuen Version angehen. Das Update ist kostenlos und ist echt den Download wert! Hier ist der Link zum Download: http://www.axure.com/download

Eine Übersicht der wichtigsten Neuerungen findet ihr unter der Seite von Axure oder in unserem vergangen Beitrag: Neues in Axure 8. Während unseres letzten Beitrags wurde noch allerhand verändert. Das sind kurz die weiteren Neuerungen, die noch hinzugekommen sind:

Die Benutzeroberfläche hat einen frischen Anstrich bekommen und kann sogar noch über View>Toolbars>Customize Main Toolbar… an die eigene Bedürfnisse angepasst werden kann.

Außerdem gibt es die Möglichkeit für jede Seite individuell festzulegen, ob man auf dieser Adaptive Views nutzen möchte. Davor wurde diese Einstellung im gesamten Prototypen festgelegt.

Leider ist es immer noch nicht möglich Vektorgrafiken in Axure außer als eingefügtes Bild zu nutzen. Aber immerhin gibt es nun eine integrierte Standard Icon Library, bei denen die Icons beliebig eingefärbt und skaliert werden können.

Wer sich einmal Gedanken machen möchte, was ein gutes Prototyping Tool ausmacht und an einen Vergleich zu dem neu entwickelten Tool Adobe Experience Design interessiert ist, der ist herzlich zu den AXChange Meetups eingeladen:
Hamburg – Mittwoch, 20. April 2016
Berlin – Donnerstag, 28. April 2016

Bildschirmfoto 2016-04-19 um 10.41.38

Axure 8 – Alle Events erklärt

Axure zeichnet sich seit Jahren gegenüber anderen Prototyping Tools dadurch aus, dass jede Idee bis zum High-Fidelity Prototyp erstellt werden kann. Grund dafür ist eine riesige Anzahl an Events, die zahlreiche Aktionen auslösen können. In der neuen Version 8 sind nun noch mehr Events hinzugekommen und die Möglichkeit, diese an den meisten Widgets aufzurufen. Um den Überblick zu behalten, haben wir eine Liste mit allen Widget-Typen und deren Events erstellt.

151222_Axure 8 - Events Overview

Und hier noch eine kurze Erklärung zu jedem Event:

OnClick: Wenn das Widget geklickt wird.
OnMouseEnter: Wenn der Mauszeiger über das Widget bewegt wird.
OnMouseOut: Wenn der Mauszeiger den Bereich des Widgets wieder verlässt.
OnDoubleClick: Wenn das Widget mit einem Doppelklick geklickt wird.
OnContextMenu: Wenn das Widget mit der rechten Maustaste geklickt wird.
OnMouseDown: Wenn das Widget geklickt wurde, die Maustaste aber nicht losgelassen wird.
OnMouseUp: Wenn das Widget geklickt wurde und die Maustaste losgelassen wird.
OnMouseMove: Löst solange aus, wie der Mauszeiger über dem Widget ist.
OnMouseHover: Wenn der Mauszeiger eine Sekunde über dem Widget stillsteht.
OnLongClick: Wenn das Widget geklickt wurde und die Maustaste gehalten wird.
OnKeyDown: Wenn eine Taste auf der Tastatur gedrückt wird, während Text auf dem Widget eingegeben wird.
OnKeyUp: Wenn eine Taste auf der Tastatur losgelassen wird, während Text auf dem Widget eingegeben wird.
OnMove: Wenn das Widget sich bewegt.
OnRotate: Wenn das Widget rotiert wird.
OnResize: Wenn das Widget seine Größe verändert.
OnShow: Wenn das Widget angezeigt wird.
OnHide: Wenn das Widget versteckt wird.
OnFocus: Wenn das Widget fokussiert wird.
OnLostFocus: Wenn das Widget den Fokus verliert.
OnSelectionChange: Wenn in der Droplist eine andere Option ausgewählt wird.
OnSelection: Wenn das Widget selektiert wird.
OnUnselection: Wenn die Selektion des Widgets abgewählt wird.
OnLoad: Wenn das Widget initial beim Start der Seite geladen wird.
OnPanelStateChange: Wenn sich der State des Dynamic Panels ändert.
OnDragStart: Wenn der Drag auf dem Dynamic Panel anfängt.
OnDrag: Wenn das Dynamic Panel gedragged wird.
OnDragDrop: Wenn der Drag auf dem Dynamic Panel endet.
OnSwipeLeft: Wenn das Dynamic Panel von rechts nach links geswiped wird.
OnSwipeRight: Wenn das Dynamic Panel von links nach rechts geswiped wird.
OnSwipeUp: Wenn das Dynamic Panel von unten nach oben geswiped wird.
OnSwipeDown: Wenn das Dynamic Panel von oben nach unten geswiped wird.
OnScroll: Wenn der Inhalt des Dynamic Panels gescrollt wird.
OnScrollUp: Wenn der Inhalt des Dynamic Panels hoch gescrollt wird.
OnScrollDown: Wenn der Inhalt des Dynamic Panels runter gescrollt wird.
OnTextChange: Wenn der Text sich in einem Eingabefeld ändert.
OnItemLoad: Wenn die Elemente des Repeaters geladen werden.
OnItemResize: Wenn die Elemente des Repeaters die Größe verändern.
OnPageLoad: Wenn die Seite geladen wird.
OnWindowResize: Wenn sich die Größe des Browser Fensters ändert.
OnWindowScroll: Wenn das Browser Fenster gescrollt wird.
OnWindowScrollUp: Wenn das Browser Fenster hoch gescrollt wird.
OnWindowScrollDown: Wenn das Browser Fenster runter gescrollt wird.
OnPageClick: Wenn auf der Seite geklickt wird.
OnPageDoubleClick: Wenn auf der Seite mit einem Doppelklick geklickt wird.
OnPageContextMenu: Wenn auf der Seite mit der rechten Maustaste geklickt wird.
OnPageMouseMove: Wenn die Maus auf der Seite bewegt wird.
OnPageKeyDown: Wenn eine Taste auf der Tastatur gedrückt wird.
OnPageKeyUp: Wenn eine Taste auf der Tastatur losgelassen wird.
OnAdaptiveViewChange:   Wenn sich der Adaptive View ändert.

Neues in Axure 8

Bild 0

Noch ist Axure 8 seit einigen Monaten in der Betaphase, aber sie bringt bereits einige Neuheiten mit sich. In diesem Beitrag haben wir die aus unserer Sicht wichtigsten Veränderungen zusammengefasst.

1 Das Pen Tool und eigene Shapes

Jedem, der einmal Probleme hatte, seine eigenen Icons oder Flächen zu definieren und dafür nicht extra Photoshop öffnen wollte, ist jetzt geholfen. Mit dem Pen Tool lassen sich ähnlich wie in Illustrator eigene Flächen über Ankerpunkte definieren.

Bild 1 - Pen Tool
 
 
 
 
 

Zu dem ist es möglich, die eigenen Shapes abzuspeichern.

Bild 2  

2 Gruppen haben einen neuen Sinn

Eine der wahrscheinlich größten, strukturellen Veränderungen ist die neue Verwendung von Gruppen. Endlich können gruppierte Elemente auch über Events und Aktionen gemeinsam beeinflusst werden. Eine Gruppe wird in der neuen Version mit einem Ordnersymbol im Widget Manager dargestellt und kann wie ein eigenständiges Widget manipuliert werden.

Bild 3  

3 Weitere Events und Actions

Was ihr vielleicht in den CSS3 Animationen kennt, ist nun auch in Axure 8 möglich. Es lassen sich mit Axure 8 nicht nur alle Widgets über die Action Set Size in ihrer Größe verändern lassen, es ist auch die Action Rotate hinzugekommen. Außerdem lassen sich Elemente bei der Nutzung der Action Show/Hide und Set Panel State über eine neue Animation flippen.
Außerdem ist es von nun an möglich über die Action Set Adaptive View von Widgets aus den View zu ändern. Mit der neuen Action Fire Event lässt isch jedes Event auf einem anderen Widget auszulösen. Das klingt erst mal nerdish, aber hilft, um übersichtlicher zu arbeiten. Wir freuen uns drüber :-)
In Bezug auf Events von Widgets lässt sich feststellen, dass sich die Bandbreite an potenziellen Events auf allen Widgets vergrößert hat. Während in der Version 7 das Dynamic Panel eine Art Vormachtstellung hatte, können nun sehr viele Events auch an anderen Widgets aufgerufen werden.

4 Styling und Dokumentation

Wenn ihr Axure 8 öffnet, fallen zunächst die neu gestylten Default Widgets auf. Diese erinnern nun eher an Flat Design. Zu dem gibt es eine neue Rubrik Markup. In dieser befinden sich designte Shapes, die an Post Its erinnern. Außerdem gibt es das interessante Widget Snapshot. Mit diesem lassen sich andere Seiten oder nur einen Bereich aus diesen als referenziertes Bild anzeigen. Mit dieser Palette an Widgets lassen sich so übersichtlichere Dokumentation anfertigen.

Bild 5 - Markups
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Auch der Widget Style Editor hat sich stark verändert. Dieser hat von nun an keine Unterscheidung zwischen Widget Defaults und Custom Styles mehr, sonder lediglich einen Default Style ,auf dem alle anderen Styles aufbauen und einen Bereich mit den definierten Styles für die einzelnen Elemente. Außerdem können in dieser Version mehrere Styles gleichzeitig bearbeitet werden und man erkennt die grundlegenden Veränderungen in einer Direktvorschau.

Bild 6 - Widget Style Editor

Hat man Widgets einen eigenen Style zugewiesen und verändert diese nachträglich am Objekt, gibt es jetzt die Möglichkeit unter den Properties and Style den globalen Style zu updaten. Dies macht es deutlich einfacher, auf einer Dokumentationsseite alle Style-Ausprägungen übersichtlich darzustellen und über diese gegebenenfalls Anpassungen vorzunehmen.

Bild 7 - Update Styles
 
 
 
 
 
 

Um Abfolgen in der Dokumentation darzustellen, hat bestimmt der ein oder andere von euch schon mal auf die Axure Flow Library zurückgegriffen, da diese Elemente den Vorteil hatten sich über Ankerpunkte miteinander verbinden zu lassen. In der neuen Version kann jedes Widget Element bzw. eine Widget-Gruppe über Ankerpunkte verknüpft werden.

Bild 8 - Ankerpunkte
 

5 Weiteres

Die Entwickler in Kalifornien haben in der Version 8 noch an vielen weiteren Stellen kleinere Veränderungen vorgenommen. So ist das Page Properties Panel nicht mehr am unteren Programmrand zu finden, sondern lässt sich über einen Klick in die Seite erreichen. Die Manipulation erfolgt nun in dem Inspector Bereich, der somit nicht nur die Page Properties, sondern auch die Panels Widget Interactions and Notes und Widget Properties and Style vereinigt.
Des Weiteren können Ecken und Umrandungslinien an Shapes einzelnd angesprochen und in ihrem Style beeinflusst werden.
Auch das Repeater Widget hat zwei entscheidende Neuerung erhalten. Zum einen wirken sich Elemente, die im Repeater versteckt sind, nicht auf die Größe bei der Duplizierung aus und zum anderen können über Dynamic Panels gekachelte Elemente auch unterschiedlich Groß sein.
In dieser Version ist auch außerdem möglich Team Project über den AxShare Server zu hosten und Vektorgrafiken zu verwenden.

6 Fazit

In diesem Beitrag haben wir uns auf die wesentlichen Veränderungen fokussiert. Eine tabellarische Sicht findet ihr im Axure Blog.
Insgesamt wurden sehr viele kleinere Anpassungen an allen möglichen Stellen vorgenommen, die die Funktionalität steigern und das zukünftige Arbeiten mit Axure erleichtern werden. Auch wenn diese Veränderungen sich nicht wie ein Quantensprung anfühlen, werden sie vermutlich einen starken Einfluss auf das effektive Bauen von Prototypen haben.
Prototypen können noch einfacher in High-Fidelity gebaut werden. Und auch die Dokumentation von Interaktionen und Elementen wird einfacher.

AXChange Hamburg bei eparo – erstes Axure-Meetup Deutschlands

AXChange Hamburg

Am 10. Juni haben wir bei eparo das erste Axure-Meetup “AXChange Hamburg” Deutschlands organisiert. Mit Unterstützung von Axure aus Kalifornien. Das Ziel: Interessierte und Axure-Fu-Master treffen sich jeden zweiten Mittwoch eines Monats zum lockeren Austausch über das Prototyping mit Axure. Schwerpunktthema des ersten Treffens: „Design-robuste Prototypen und die Auslagerung von Interaktionen in Funktionen“. Christian berichtet.

Die Sache mit der Nachfrage und dem Angebot

„Warum gibt es eigentlich noch kein Treffen von Axure-Interessierten und Fu-Mastern?“ Diese Frage haben wir uns in den vergangenen Jahren oft gestellt. Auch immer mehr Teilnehmer unserer Axure-Kurse (https://eparo.de/training.html) schickten ihre Fragen an eparo. Der Bedarf, sich auszutauschen, wurde offenbar immer größer. Im Mai gründeten wir die Meetup-Gruppe und bis zum ersten Meetup hatten sich mehr als 40 Axuristas angemeldet.

Für das Axure Meetup haben wir uns eine gute Mischung aus allem gewünscht: Austausch, „Lernen von …“ und Hilfestellungen bei konkreten Problemen. Außerdem wollten wir (oder auch andere Teilnehmer) ein Schwerpunktthema vorbereiten. So entstand das AXChange Hamburg Meetup, das jeden zweiten Mittwoch eines Monats stattfindet.
Die Meetup-Gruppe ist hier zu finden: http://www.meetup.com/de/AXChange-Hamburg/

AXChange-Format: das Beste aus Barcamps, Open Spaces und Roundtables

Unser Ziel: am Ende des Tages sollen alle mit dem Gedanken „das hat sich (wieder mal) gelohnt!“ nach Hause gehen. Dafür haben wir das Beste aus Barcamps, Open Spaces und Roundtables in eine Struktur gebracht:

  1. Um 18 Uhr stehen die Türen offen für alle, die sich austauschen möchten oder konkrete Fragen haben.
  2. Um 19 Uhr geht’s dann los: während einer kurzen Vorstellungsrunde schreibt jeder ein oder mehrere Axure-Themen auf, die ihn interessieren. Dann geht’s mit einem Talk im Stile einer Live- Demo weiter.
  3. Nach dem 30-minütigen Talk werden dann die Axure-Themen sortiert und auf die jeweiligen Tischinseln zum Diskutieren und Austauschen verteilt. Wer möchte, kann sich an die jeweilige Insel setzen, die ihn interessiert.

Aller Anfang ist schwer

AXChange TeilnehmerVor dem ersten AXChange lag auch eine gewisse Unsicherheit in der Luft: Passt das Schwerpunktthema? Wie viele werden wohl kommen? Werden wir unser selbstgestecktes Qualitäts-Ziel erreichen?

Total unbegründet: trotz des ersten heißen Sommertages im Jahr waren 18 von angemeldeten 29 Personen da. Die No-Show Rate war zwar ungewöhnlich hoch; dafür war das Feedback nach dem ersten Meetup super und unglaublich motivierend!

Ob über CSS und JavaScript-Integration in Axure, Kompatibilität mit anderen Programmen oder der Austausch über andere Programme und Workflows – alles kam auf den Tisch und wurde mit viel Elan von den Teilnehmern in kleinere Gruppen diskutiert.

Der Beginn einer Reihe…

Inzwischen fand bereits das zweite AXChange Hamburg Meetup statt. In einer kleinen gemütlichen Runde haben wir AxShare und Axure 8 als Schwerpunktthemen durchgesprochen. Wir haben diverse andere Axure-Themen auf den Tischen ausgebreitet und uns recht lange über Team-Projects oder auch über das Bauen von App-Prototypen ausgetauscht.

Am 12. August findet dann schon das dritte AXChange Hamburg Meetup bei uns statt. Wir freuen uns auf neue und alte Gesichter und Themenvorschläge! 
Zum Meetup: http://www.meetup.com/de/AXChange-Hamburg/events/223806735/

AXChange goes Berlin!

Gleich nach dem ersten Meetup haben wir dann AXChange Berlin gegründet, um die Axure Meetups auch nach Berlin zu bringen. Wir konnten Zalando einen guten Location-Sponsor finden (Dank dafür an Jay Kaufmann). Für alle Berliner Axuristas: am 21. Juli findet das AXChange bei Zalando in Berlin statt. Das Schwerpunktthema ist “Design-robuste Prototypen und das Auslagern von Interaktionen in Funktionen“. Das kam bereits beim ersten Hamburger Meetup gut an und ist extrem wichtig, denn Design-robuste Prototypen lassen sich ziemlich schnell auch während Nutzertests ändern.

Zum Meetup in Berlin: http://www.meetup.com/de/AXChange-Berlin-Axure-Meetup/

AxShare als App – sie ist online!

AxShare App Banner

Wir haben bis Hamburg die Nudelsuppenschüsseln klappern hören (Axure Insider-Witze…) und dann kamen auch schon die Mails von Axure, dass die AxShare App jetzt in den App- Stores von Apple und Google zu finden ist! Hier kommt nun unser kleines Update unserer in der Beta-Phase entstandenen Meinung.

Die App ist nach wie vor eine echte Hilfe und eine super Lösung, um den Prototypen auch einem Kunden in einem Café oder während eines Pitches zu zeigen. In Zukunft wird die App es uns ermöglichen, noch komplexere und vollständigere Prototypen zu bauen, um noch besser die endgültige App oder mobile Webseite für den UX-Test zu simulieren – und um damit auch noch glaubwürdigere und interessantere Reaktionen zu bekommen.

Sitemap in der AxShare App

Aktuell werden wir allerdings keinen Test mit der App durchführen: Am 6. Mai hatten wir ein sehr detailliertes Telefonat mit Rachel (der Produktmanagerin der AxShare App) und ihr die Punkte mitgeteilt, die wir noch nicht so prickelnd fanden. Vor allen die Sitemap ist uns ein Dorn im Auge: diese ruft man auf, indem man vom linken Bildschirmrand aus in die Mitte wischt. Das ist ein Problem für unsere UX-Tests von App-Prototypen. So ein Rechts-Swipe wird ja oft für echte Interaktionen genutzt und da ist es extrem störend, wenn dann immer die Sitemap von AxShare geöffnet wird. Rachel hat uns versprochen, dieses und weitere Probleme bald zu lösen – und wir werden am Ball bleiben!

AxShare als App – Erste Eindrücke aus dem Beta-Test

AxShare als App

Seit gestern gibt es von Axure eine App für AxShare. Wir hatten die App im Beta-Test.

Was kann die AxShare-App?

  • Über die App kann man schnell und komfortabel den zu testenden Axure Prototypen öffnen. Das lästige Eingeben der AxShare-URL entfällt.
  • Prototypen können lokal auf dem Device gespeichert werden.
  • Die lokal abgespeicherten Prototypen sind auch offline auf dem Gerät verfügbar und sorgen dafür, dass die Performance des Prototypen auf dem Gerät nicht aufgrund einer langsamen Internetverbindung leidet.
  • Die Statusleiste des Smartphones kann ausgeblendet werden.
  • Die App ist für iOS und Android verfügbar.

Gute Nachrichten für das mobile Prototyping mit Axure

Irgendwie war das Testen von App-Prototypen auf Smartphones und Tablets bislang nicht sonderlich komfortabel. Besonders für iOS-Devices ging das meist über remote in AxShare generierte Prototypen. Das war bei größeren Prototypen langsam und nicht sehr performant. Besonders bei User-Tests hat das bei den Probanden immer einen negativen Eindruck der zu testenden App ausgelöst. Die Probanden waren schnell genervt und haben weniger Sachen ausprobiert.

Ach ja, das Finden des richtigen Prototypen über die kryptische AxShare-ID hat auch genervt. Oft haben wir uns in der Vergangenheit uns die AxShare-ID diktiert, um den Prototypen auf dem Smartphone oder Tablet zu öffnen.

Über die lokal in der AxShare-App gespeicherten Axure-Prototypen wird das jetzt deutlich besser. Die Prototypen stehen sauber aufgelistet in der App. Die lokal gespeicherten Daten verkürzen die Ladezeiten der Prototypen und machen eine Internetverbindung überflüssig.

Zusätzlich kann die Statusleiste vom Smartphone ausgeblendet werden, was sicherlich bei einigen Prototypen wichtig ist, aber aus guten Gründen von Apple nicht empfohlen wird (Apple Developer Guidelines).

Unser Fazit

AxShare TesteinladungWäre schön gewesen, wenn die App einen Monat eher fertig geworden wäre. Dann hätten wir die letzten 6 App-Projekte, die wir mit Axure entwickelt haben, schon damit testen können.

Noch ist die App in der Entwicklung. Wir sind dennoch schon jetzt begeistert, denn die App sorgt für störungsfreiere UX-Tests und besseres Nutzer-Feedbacks.

Sobald wir mehr wissen, werden wir wieder berichten.