a small introduction into galen in preparation for a barcamp

1. VISUAL REGRESSION TEST
INCLUDING RESPONSIVE

2. USER EXPERIENCE KONZEPTER
UND INTERAKTIONSDESIGNER
Nico Maikowski
TEXT

3. WARUM SOLLTE MAN DAS TUN
WOLLEN?
MOTIVATION

4. TEXT
AUS UNSERE GRUNDSÄTZE - ISO 9241
▸ Selbstbeschreibungsfähigkeit
Orientierung:
Dem Nutzer müssen auf jeder Seite und während eines jeden Prozesses Orientierungspunkte angeboten
werden, damit er jederzeit weiß, wo genau er sich befindet und/oder wie weit er von seinem eigentlichen Ziel
entfernt ist. Zum Lösen dieses Problems finden Design Patterns Anwendung, wie: Breadcrumb, Progress und
Steps Left.
Beherrschbarkeit
Für die Besucher einer Website müssen Navigationselemente klar durch deren Gestaltung zu erkennen sein. Des
Weiteren muss für den Benutzer klar sein, wo ein Navigationselement einen hinführt. Erst wenn zielsicher
navigiert werden kann, ist eine Seite für einen Nutzer steuer- und beherrschbar. Design Patterns zur Lösung
wären hier: Top Navigation Bar und Left Navigation Bar.
Rückmeldung
Erhält der Besucher eine Rückmeldung über den Erfolg einer vorher durchgeführten Aktion, entsteht ein Gefühl
von Sicherheit, welches für die Vertrauensbildung maßgeblich ist. Ein Design Pattern hierfür ist: Shopping Cart.
Hilfen
Komplexere Aufgaben sind grade für unerfahrene Besucher schwer zu bewältigen. Solche Aufgaben sollten mit
besonderen Hilfen oder einer Dokumentation des Systems unterstützt werden. Hierzu folgende Design Patterns:
Hover Invitation, Tooltip Invitation.

5. TEXT
ERWEITERTE GRUNDSÄTZE - ISO (9126)
▸ Unter dem Qualitätsmerkmal Benutzbarkeit gibt es den Punkt
Attraktivität
▸ Attraktivität (lat. attrahere ‚an sich ziehen, anziehen‘) ist die
Anziehungskraft. Auf Menschen bezogen, kann sie sowohl auf
äußerlichen Eigenschaften (Schönheit) als auch auf
Wesenseigenschaften (Charakter, Geist, Charisma, soziale
Stellung) oder auf Materiellem beruhen. Sie wird individuell
unterschiedlich bewertet und hängt im Wesentlichen von den
Erwartungen des Betrachters ab. Als subjektiver Wert ist sie
dem sozialen und gesellschaftlichen Wandel unterworfen.

6. JUST BECAUSE
YOU’VE COUNTED ALL
THE TREES DOESN’T
MEAN YOU’VE SEEN
THE FOREST.
Anonymous

7. TEXT
WAS WILL MAN TESTEN?
▸ Breite, Höhe, Abstände
▸ Textgrößen, -farbe, -Alignment
▸ Responsive für Smartphone
▸ Browsertypen

8. TEXT
WAS KANN BEREITS GETESTET WERDEN?
‣ Near
‣ Below and Above
‣ Left of and Right of
‣ Inside
‣ Width and Height
‣ Aligned
‣ Text
‣ CSS Properties
‣ Centered
‣ Absent
‣ Visible
‣ Contains
‣ On
‣ Component
‣ Count
‣ Color scheme
‣ Image

9. WIE?
JUNIT
▸ Vorteile wie z.B. Einbindung in Jenkins CI
▸ bekannt bei den Frontend Entwicklern
▸ Shake Hands zwischen UX und UI

10. WIE?
SELENIUM
▸ Driver als Plugins für
verschiedene Browser
▸ Auflösungen für Responsive
Tests
▸ benötigt um die Website
funktional zu steuern ->
Navigation und Inputs
befüllen

11. WIE?
GALEN
▸ das eigentliche
Framework zum
visuellen Test
▸ grafische
Auswertung

12. TEXT
VORTEILE
▸ fortlaufende Wiederholung von Testfällen, d.h. Ausschluss
von Fehlerquellen bei iterativer Entwicklung
▸ Tests können bereits parallel zur Gestaltungslösung
entwickelt werden
▸ Kostensenkung durch Einsparung für manuelle Reviews

13. TEXT
NACHTEILE
▸ IDs in der Website bzw. den html-Tags
▸ gewisses Maß an Programmierkenntnisse
▸ Pflege der Tests

14. DEMO

15. TEXT
LINKS UND QUELLEN:
1. http://galenframework.com
2. http://docs.seleniumhq.org
3. http://junit.org/junit4/
4. https://github.com/hypery2k/galen_samples

16. THANK YOU FOR THE FISH
Douglas Adams
TEXT