Upload
nico-maikowski
View
203
Download
0
Embed Size (px)
Citation preview
VISUAL REGRESSION TEST INCLUDING RESPONSIVE
USER EXPERIENCE KONZEPTER UND INTERAKTIONSDESIGNER
Nico Maikowski
TEXT
WARUM SOLLTE MAN DAS TUN WOLLEN?
MOTIVATION
TEXT
AUS UNSERE GRUNDSÄTZE - ISO 9241
▸ SelbstbeschreibungsfähigkeitOrientierung: 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ückmeldungErhä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.HilfenKomplexere 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.
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.
JUST BECAUSE YOU’VE COUNTED ALL THE TREES DOESN’T MEAN YOU’VE SEEN THE FOREST.Anonymous
TEXT
WAS WILL MAN TESTEN?
▸ Breite, Höhe, Abstände
▸ Textgrößen, -farbe, -Alignment
▸ Responsive für Smartphone
▸ Browsertypen
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
WIE?
JUNIT
▸ Vorteile wie z.B. Einbindung in Jenkins CI
▸ bekannt bei den Frontend Entwicklern
▸ Shake Hands zwischen UX und UI
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
WIE?
GALEN
▸ das eigentliche Framework zum visuellen Test
▸ grafische Auswertung
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
TEXT
NACHTEILE
▸ IDs in der Website bzw. den html-Tags
▸ gewisses Maß an Programmierkenntnisse
▸ Pflege der Tests
DEMO
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
THANK YOU FOR THE FISH
Douglas Adams
TEXT