13
Dr. Adam G. Augustin - agametis Moderne Benutzeroberflächen am Beispiel einer FM Lösung FileMaker Konferenz 2015 Hamburg www.filemaker-konferenz.com Moderne Benutzeroberflächen am Beispiel einer FileMaker Lösung Der Benutzer ist König Dr. Adam G. Augustin - agametis

FMK2015: Moderne Benutzeroberflächen am Beispiel einer FileMaker Lösung by Adam Augustin

Embed Size (px)

Citation preview

Dr. Adam G. Augustin - agametis Moderne Benutzeroberflächen am Beispiel einer FM Lösung

FileMaker Konferenz 2015 Hamburg www.filemaker-konferenz.com

Moderne Benutzeroberflächen am Beispiel einer FileMaker Lösung

Der Benutzer ist König

Dr. Adam G. Augustin - agametis

Dr. Adam G. Augustin - agametis Moderne Benutzeroberflächen am Beispiel einer FM Lösung

FileMaker Konferenz 2015 Hamburg www.filemaker-konferenz.com

Wer bin ich …

• selbständiger FileMaker Entwickler und Berater im Großraum München (zusammen mit Armin Egginger (CrossCheck) als Cross Solutions GmbH)

• FBA Mitglied

• Filemaker 12 und 13 zertifiziert

• Vorträge auf der FMK 2012 in Salzburg

• Kein Grafikdesign- aber Mathematikstudium

[email protected]

Dr. Adam G. Augustin - agametis Moderne Benutzeroberflächen am Beispiel einer FM Lösung

FileMaker Konferenz 2015 Hamburg www.filemaker-konferenz.com

… und was machen wir hier

• Benutzeroberflächen (GUIs), die unseren Usern Spaß machen sollen

• Benutzererlebnis (UX) anhand einer FileMaker Go 14 iPhone App: Photoerfassung und Synchronisation mit einem Server

• Demo und Hands-On

• Tipps zur GUI-Gestaltung direkt von FileMaker Software Entwicklern

Dr. Adam G. Augustin - agametis Moderne Benutzeroberflächen am Beispiel einer FM Lösung

FileMaker Konferenz 2015 Hamburg www.filemaker-konferenz.com

Aspekte der App

• Synchronisation

• Regelung der Zugriffsrechte mit Hilfe des Servers

• grafische Gestaltung der Layouts und Icons

• Popover mal anders

• Wischgesten zur Benutzerführung und Navigation (mehr als FM von sich aus bietet)

• Benutzereinstellungen zur Steuerung der UX

Dr. Adam G. Augustin - agametis Moderne Benutzeroberflächen am Beispiel einer FM Lösung

FileMaker Konferenz 2015 Hamburg www.filemaker-konferenz.com

Synchronisation

PhotoApp SyncFile DataFile

Während der Synchronisation sieht der Benutzer nur ein Status/Info-Layout

Benutzer interagiert nur mit PhotoApp

Über einen Zeitplan wird die Weiterverarbeitung

der Daten gesteuert

•SyncFile wird bei Bedarf aus einem Container in PhotoApp in Dokumenten-Order von FM Go exportiert •Gesamte Kommunikation mit dem Server wickelt SyncFile ab •PhotoApp „sieht“ nie den Server

FM Go FM Server

http://www.filemaker.com/de/solutions/ios/docs/fmi_guide_sync_de.pdf

Dr. Adam G. Augustin - agametis Moderne Benutzeroberflächen am Beispiel einer FM Lösung

FileMaker Konferenz 2015 Hamburg www.filemaker-konferenz.com

Regelung der Zugriffsrechte

• Standardbenutzer (Appuser) ohne Passwort und immer angemeldet

• PersistentID des Gerätes wird auf dem Server abgelegt und vor jeder Synchronisation überprüft

• Bei Übereinstimmung wird die Synchronisation initiiert

• Die Datendatei auf dem Server ist nur im Hintergrund offen, ohne das der Appuser die Möglichkeit hat sie zu betreten/in das Fenster zu wechseln

• Appuser darf in der Datendatei auf dem Server: • nur ganz wenige Felder sehen (nicht schreiben und löschen) • nur in einer Tabelle Daten schreiben (nicht löschen) • nur ein Layout betreten

Dr. Adam G. Augustin - agametis Moderne Benutzeroberflächen am Beispiel einer FM Lösung

FileMaker Konferenz 2015 Hamburg www.filemaker-konferenz.com

Picasso Sagt

Gute Künstler kopieren, große Künstler stehlen

Pablo  Picasso,  spanischer  Bildhauer,  Grafiker  und  Maler  *  25.10.1881,  †  18.04.1973

Dr. Adam G. Augustin - agametis Moderne Benutzeroberflächen am Beispiel einer FM Lösung

FileMaker Konferenz 2015 Hamburg www.filemaker-konferenz.com

Demo

iPhone App zur Erfassung von Photos und Synchronisation mit einem FileMaker Server

Dr. Adam G. Augustin - agametis Moderne Benutzeroberflächen am Beispiel einer FM Lösung

FileMaker Konferenz 2015 Hamburg www.filemaker-konferenz.com

Performace-Tipps zur GUI-Gestaltung

• Keine eigenen Styles bei Objekten ungespeichert belassen -> neue Definieren und abspeichern

• Farbverläufe sind sehr kostspielig (Layout-Rendering-Engine bedient sich der Methode „Image-Slicing“ um Objekte aus winzigen Einzelteilen „zusammenzubauen“ -> GPU wird benutzt und weniger Speicher benötigt)

• Schattenelemente sind sehr rechenintensiv (außerdem in FM Go nicht verfügbar)

• Seit FM14 gibt es keinen Unterschied mehr zwischen Seiten- und Registersteuerelement (Daten werden nur dann geladen, wenn sie sichtbar sind)

Quellen: DevCon2015 in Las Vegas, Vorträge COR005, COR010 und MOB004

Dr. Adam G. Augustin - agametis Moderne Benutzeroberflächen am Beispiel einer FM Lösung

FileMaker Konferenz 2015 Hamburg www.filemaker-konferenz.com

Performace-Tipps zur GUI-Gestaltung

• Zoom deaktivieren (wenn die Funktion für die App nicht notwendig ist, sonnst muss jede Zoomstufe neu generiert werden -> kein Vorteil durchs Caching)

• „Aktuelle Datensatzanzeige in der Listenansicht anzeigen“ deaktivieren und stattdessen aktiven Datensatz mit Style-Einstellungen hervorheben

• Graphischen Elemente überdecken Knöpfe bei Webdirect -> Knöpfe immer ganz oben in der Ebenen-Sichtweise platzieren

• SVG-Icons löschen, wenn sie nicht gebraucht werden, denn FM muss sie immer in den Cache laden, auch wenn sie nie in einen Knopf verwenden werden oder außerhalb des sichtbaren Layoutbereichs platziert sind

Quellen: DevCon2015 in Las Vegas, Vorträge COR005, COR010 und MOB004

Dr. Adam G. Augustin - agametis Moderne Benutzeroberflächen am Beispiel einer FM Lösung

FileMaker Konferenz 2015 Hamburg www.filemaker-konferenz.com

Vielen Dank unseren Sponsoren

Danke für das Bewerten dieses Vortrages

Dr. Adam G. Augustin - agametis Moderne Benutzeroberflächen am Beispiel einer FM Lösung

FileMaker Konferenz 2015 Hamburg www.filemaker-konferenz.com

Q & A

Dr. Adam G. Augustin - agametis Moderne Benutzeroberflächen am Beispiel einer FM Lösung

FileMaker Konferenz 2015 Hamburg www.filemaker-konferenz.com

Vielen Dank