7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
www.filemaker-konferenz.com
"Surviving the Themes and Styles Jungle"
Ein Erlebnisbericht
von
Russell Watson
Günther Business Solutions GmbH
Überleben im Design- und Stil-Dschungel

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Russell Watson
mrwatson-gbs
BA Hons
Medienwissenschaft
und Deutsch
Sussex University, UK
2
BSc Informatik
Freie Universität, Berlin
* The FileMaker Certified Developer logo is a trademark of FileMaker, Inc. in the United States and other countries.

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Was wir heute anschauen
1.Case Study: “Face Lift in Advanter 4.0”
• “Face-Lift” = Design + Stile + neue Layoutobjektmöglichkeiten
+ Layoutumbau + Prozeßoptimierung
2.Wie man ein Design erfolgreich bauen kann
• bzw. erfolgreich nicht kaputt macht!
3.QS: Wie man Layoutumbau optimieren & kontrollieren kann
4.Blick in die Zukunft & Diskussion
3

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Design + Stile = Dschungel ?
GEFÄHRLICH
DUNKEL
ÜBERLEBEN
4

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Case Study
5
Face-Lift

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Face-lift
6
advanter® 3 advanter® 4 Evolution
FileMaker 13 FileMaker 14
Klassisch Design Eigendesign(s)

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Keine kleine Herausforderung!
7
advanter® 3
FileMaker 13
Klassisch Design
33 Dateien
~120 Funktionsmodule
> 1 800 Layouts
> 6 000 Layout Parts
157 919 Layout Objekte
unzählige Gruppierte Buttons
5 622 Bedingte Formatierungen
382 Layout Trigger
1 966 GotoLayout ScriptSteps

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Riesenaufwand
9 Monate Entwicklung
198 Werktage Entwicklung
396 Manntage Entwicklung
2.376 Mannstunden Entwicklung
Layout Objekte 157.919 * 10 Klicks = > 1.59 Mio Klicks
8

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 20169
advanter® / FileMaker Timeline

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
DEMO
10

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
11

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
12

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
13

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
14

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
15

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
16

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Enduser Ziele
Look: Chic + Modern
UX: einfacher + konform
Performance: Optimiert/Schneller/Netzwerk
entlastet
Ergebnis: Awesome!
17

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Was wir heute anschauen
1.Case Study: “Face Lift in Advanter 4.0”
• “Face-Lift” = Design + Stile + neue Layoutobjektmöglichkeiten
+ Layoutumbau + Prozeßoptimierung
2.Wie man ein Design erfolgreich bauen kann
• bzw. erfolgreich nicht kaputt macht!
3.QS: Wie man Layoutumbau optimieren & kontrollieren kann
4.Blick in die Zukunft & Diskussion
18

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Fragen über Fragen
19
Wie
Stil Pur?
Stil + Formatierung
gemischt?
Listenansicht
/ Maskenansicht /
Druckansicht?
Namenskonventionen?

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Entwicklungsziele
1.Für Design & Stile:
•Aktualisierbar
• Wartbar
• Evolutionäre Entwicklung
2.Für Layoutinhalt:
• Fehlerfrei
• Fehlerfrei
• Fehlerfrei
20

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
Stand der Technologie
FM Release Layout + Design Funktionen
FMP 11
< 2012-04
ext. XML Theme Dateien (seit FMP 9)
KEINE Stile
FMP 12
2012-04
Neues Layout Surface + CSS
Design auswählen/wechseln -
States, gradients + image slicing
FM 13
2013-12
Custom Designs + Stile
Popovers + Sliders + dynam. Reiternamen
shadow, padding
FM14
2015-05
Top+Bottom Navigation
Button Bar, Buttons Icons
Object component styles
FM 15
2016-05
Concealed edit box
Portal in-line progress bar
21

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
Stil pur
oder
mit Formatierung gemischt?
22

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
80/20 Prinzip (PARETO’S LAW)
23
=> GEMISCHT !!
d.h.
80% der Layoutobjekte mit
20% der Stile abdecken

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Gemischt: Problem = Format Painter
FM13 überträgt Formatierung…
24
(Wissensstand 2015)
FM14 überträgt Stilname…
…aber Stilname nicht
…aber Stilformatierung auch
Rote Dreieck = LocalCSS :-(
FM15 Rote Dreieck IMMER NOCH :(

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Pur: Problem = Zu viele Stile
Entwicklung
wird
l
a
n
g
s
a
m
25

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
Pur
Vorteile
• Es funktioniert!
• Kontrollierbarkeit
26
(95%)
Nachteil
• Viele Stile
• Große Designdatenmenge
(beim Starten)

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Format Painter…
Beim Speichern des Layouts…
…LocalCSS WEG OPTIMIERT!
FM14: Noch Fehler in Farbe :-(
FM15: Es funktioniert doch*!
27
Wissensstand 2016…
* NACH dem Speichern!

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
Wie erstellt / aktualisiert man ein
Design?
28

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
SIX-GOLDEN-RULES OF THEME MANAGEMENT
1.DEFINE THEMES AND STYLES IN *ONE FILE* ONLY
2.SYNCHRONIZE THEM TO OTHER FILES ONLY BY IMPORTING AND REPLACING THE
THEME
3.NEVER COPY AND PASTE THEMES
4.NEVER DEFINE THEMES AND STYLES BY HAND ANYWHERE ELSE IN YOUR SOLUTION
5.NEVER RENAME A THEME
6.BEWARE OF THEME AND STYLE IMPOSTORS AT ALL TIMES!
BONUS (UNSPOKEN) RULE: DON’T USE THE FORMAT PAINTER! (KAPUTT)
29

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Achtung falsche Identität (“Impostor”)!
30

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Designs Kopieren + Einfügen
31
NIEMALS!

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Designs Umbenennen
32
NIEMALS!

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Stile umbenennen
33
NIEMALS!

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Stilnamen eindeutig vergeben!
34
IMMER!

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Importieren/Aktualisieren
≠
Zusammenfügen
35
MyTheme

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Stile in Slave-Datei ändern
36
NIEMALS!

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Stile ändern ohne im Design zu
speichern
37
NIEMALS!

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
usw.
38

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Was wir heute anschauen
1.Case Study: “Face Lift in Advanter 4.0”
• “Face-Lift” = Design + Stile + neue Layoutobjektmöglichkeiten
+ Layoutumbau + Prozeßoptimierung
2.Wie man ein Design erfolgreich bauen kann
• bzw. erfolgreich nicht kaputt macht!
3.QS: Wie man Layoutumbau optimieren & kontrollieren kann
4.Blick in die Zukunft & Diskussion
39

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
QS - Gedanken
• Wie minimiert man Fehler?
• Umsetzung - Fehlerrate
• Testen / Beweis
• "Prove you are right"
• Layout analysieren wie nie zuvor.
• Sonderanalyse für Buttons + ScriptParameter + Buttonoption
• QS-Kontrollen
• Gibt es Fehler im Layout?
• Wurden Buttons / Scriptaufrufe korrekt umgesetzt?
• Haben alle Objekte einen Stil?
• Entspricht das Layout dem Firmen 'Style-Guide'?
40

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Riesenaufwand => VIELE Fehler !!!
9 Monate Entwicklung
198 Werktage Entwicklung
396 Manntage Entwicklung
2.376 Mannstunden Entwicklung
Layout Objekte 157.919 * 10 Klicks = > 1.59 Mio Klicks
=> WIE HABEN WIR DIE FEHLERANZAHL MINIMIERT?
1. unzählige Layoutkontrollen und Prüfungen
• Cross Check Button Analyse
2. täglich fmWorkMate zur Qualitätssicherung genutzt
41

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
fmWorkMate
Layout Analysis
DEMO
42

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Was wir heute anschauen
1.Case Study: “Face Lift in Advanter 4.0”
• “Face-Lift” = Design + Stile + neue Layoutobjektmöglichkeiten
+ Layoutumbau + Prozeßoptimierung
2.Wie man ein Design erfolgreich bauen kann
• bzw. erfolgreich nicht kaputt macht!
3.QS: Wie man Layoutumbau optimieren & kontrollieren kann
4.Blick in die Zukunft & Diskussion
43

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Nächstes Design - Nächstes “Gotcha”
44
Wie
funktioniert
Vererbung?
Was passiert,
wenn ich die Default
Stil ändere?
Welche andere
Stile ändern sich?
“NUR
erste Generationen
(d.h. direkt aus Default
generierte Stile)”,
oder?
“Nein, ein
Stil weisst nicht woher es
stammt. Es hängt nur vom
Inhalt ab,
oder?

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
Entwicklungsstand von FMP Client
FM Impostor Format Painter Stil Vererbung Infos
≤11
12 12
Kaputt!
(nur Formatierung)
13 13
Design
+
Stil
Kaputt!
(Formatierung +
nur Stilname)
Anzahl
Layouts
14 Design
Funktioniert (fast)!
(lokale Textfarbe)
Anzahl
Layouts
15 Design
Funktioniert doch!
(Layout Speichern)
Kaputt!
(wegen CSS Bug
“…;sansserif)”
Anzahl
Layouts
45

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 201646

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
Danke!
47

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Vielen Dank unseren Sponsoren
48
Danke für das Bewerten dieses Vortrages

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
Discussion
49

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Überleben im Design- und Stil-Dschungel | MrWatson-GBS
Referenzinfos
50

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Design links
• FILEMAKER THEMES | DESIGN PALETTE - chiyofm
• Designing Layouts Using Themes & Styles - designingfilemaker.com -
2014-08 fm13
• Parrots Law-or-the-80-20-principle http://www.hackingthematrix.com/
paretos-law-or-the-80-20-principle/
51

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
FileMaker Issues and Ideas
• STYLE IMPOSTOR - Appearance is reset when theme imported/overwritten
(fm13)
• Theme + Style update: Style with same name import bugs (fm???)
• THEME IMPOSTOR: Renaming a theme changes the internalName and is no
longer updatable (fm15)
• Format Painter must copy both style name AND extra formatting (fm13)
• Format Painter adds local color format where it is not needed (fm14) - (See
Note in Post)
• Format Painter must optimize the LocalCSS immediately Idea (fm15)
• Solution with many styles slows down to the point of unresponsiveness
52

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
FileMaker Ideas
• Improve UX of Layouting with Themes and Styles
• THEME + Style Impostors
• STYLE IMPOSTOR - Appearance is reset when theme imported/overwritten (fm13)
• Theme + Style update: Style with same name import bugs (fm???)
• THEME IMPOSTOR: Renaming a theme changes the internalName and is no longer
updatable (fm15)
• Format Painter
• Format Painter must copy both style name AND extra formatting (fm13)
• Format Painter adds local color format where it is not needed (fm14) - (See Note in
Post)
• Format Painter must optimize the LocalCSS immediately Idea (fm15)
• Solution with many styles slows down to the point of unresponsiveness
53

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Links
www.guenther-bs.de
www.mrwatson.de
www.fmworkmate.com
FileMaker Pro Version Comparison (EN)
The SIX-GOLDEN-RULES OF THEME MANAGEMENT in multi-file solutions (MrW Blog)
54

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Credits
Turing Labyrinth by lylejk http://lylejk.deviantart.com/art/
Turing-Labyrinth-194552139
55

Überleben im Design- und Stil-Dschungel | MrWatson-GBS
7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
Designs
• 6 Designs
• Advanter EL (Hauptlayouts = E, EL, A und L Layouts)
• Advanter Drucklayout Standard (Interne Druck = D Layouts)
• Advanter_iOS (iPad Layouts)
• Advanter Service (PTO Layouts)
• Advanter Servicelayout (Interne Layouts)
• Advanter Druck (kommend - Kundendruck)
56

7. FileMaker Konferenz | Salzburg | 13.-15. Oktober 2016
FileMaker Konferenz 2016 Salzburg
Vielen Dank unseren Sponsoren
Ohne Sponsoring wäre diese Konferenz
so nicht möglich!