Roland Weigelt UI / UX Einführung für Entwickler. Teil NET User Group Köln
|
|
|
- Petra Beckenbauer
- vor 6 Jahren
- Abrufe
Transkript
1 Roland Weigelt UI / UX Einführung für Entwickler Teil NET User Group Köln
2 Roland Weigelt Beruflich: Comma Soft AG 15 Jahre Software-Entwickler seit Januar User Experience Specialist Privat u.a..net Community (.NET User Group Bonn-to-Code.Net, dotnet Cologne) *.cs, *.psd, *.wmv, *.pptx
3 Entwickler, kein Designer
4 Wie erstelle ich grandios fantastische User Interfaces?
5 Wie erstelle ich grandios fantastische User Interfaces?
6 Wie erstelle ich brauchbare User Interfaces?
7
8 Design
9 Gutes Design?
10 Gutes Design?
11
12
13
14 Crash-Kurs: Visuelles Design
15
16 Visuelle Wahrnehmung
17
18
19 Foveal Peripher
20 Foveale Wahrnehmung Hohe räumliche Auflösung Sehr geringer Winkelbereich Periphere Wahrnehmung Hohe zeitliche Auflösung Unscharf, räumlich verzerrt
21
22
23
24
25
26 Augenbewegung Arbeitsspeicher Erinnerungen Mustererkennung
27
28
29
30
31
32 1 2 3 A B C D E F I 0 J G H
33 Es gibt eine Art Firmware der menschlichen Wahrnehmung
34 Stichworte: Gestalttheorie, Gestaltgesetze
35 Nicht 100%ig vorhersehbar...
36 ...aber durchaus Erfahrungswerte, was funktioniert und was nicht!
37
38 Gestaltungsprinzipien
39 Anforderungen an brauchbares Visuelles Design
40 Konsistenz Ordnung Ausgewogenheit
41 Oder auch: Aus einem Guss
42 Ausrichtung
43 Ausrichtung schafft starke Kanten Diese wirken auch über größere Entfernung...allerdings nicht auf dieser Folie!
44 Ausrichtung schafft starke Kanten Diese wirken auch über größere Entfernung
45 Ausrichtung schafft starke Kanten Diese wirken auch über größere Entfernung
46 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet varius sapien. Quisque ut convallis orci. Pellentesque id urna id nisi ultrices volutpat. Aenean in sapien odio, a tristique velit. Quisque semper mollis ante at porta. Curabitur in ligula eget est gravida ultrices. Suspendisse potenti. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nullam a eros ac ligula pretium venenatis ut sit amet turpis. Fusce mollis augue sit amet lacus pulvinar sit amet tincidunt nunc pellentesque. Fusce vitae tellus libero. Nullam tempor condimentum urna vel imperdiet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut vitae lectus dolor, dapibus mattis erat. Suspendisse rhoncus vehicula enim ut malesuada. Ut venenatis cursus est vitae interdum. Sed sollicitudin lobortis nisi sollicitudin pellentesque. Donec ac massa nunc, sed auctor orci. Donec facilisis ullamcorper leo, eget cursus lectus pretium eu. Suspendisse venenatis orci vel mauris mattis ultrices. Pellentesque suscipit, urna quis bibendum mattis, tellus neque porttitor dolor, bibendum gravida nisl justo eleifend nibh. Integer nec augue in nunc pretium facilisis. Donec tincidunt rutrum tellus, vitae convallis nulla tincidunt in. Aenean luctus porta enim, vitae feugiat nisl rutrum ut.
47 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet varius sapien. Quisque ut convallis orci. Pellentesque id urna id nisi ultrices volutpat. Aenean in sapien odio, a tristique velit. Quisque semper mollis ante at porta. Curabitur in ligula eget est gravida ultrices. Suspendisse potenti. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nullam a eros ac ligula pretium venenatis ut sit amet turpis. Fusce mollis augue sit amet lacus pulvinar sit amet tincidunt nunc pellentesque. Fusce vitae tellus libero. Nullam tempor condimentum urna vel imperdiet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut vitae lectus dolor, dapibus mattis erat. Suspendisse rhoncus vehicula enim ut malesuada. Ut venenatis cursus est vitae interdum. Sed sollicitudin lobortis nisi sollicitudin pellentesque. Donec ac massa nunc, sed auctor orci. Donec facilisis ullamcorper leo, eget cursus lectus pretium eu. Suspendisse venenatis orci vel mauris mattis ultrices. Pellentesque suscipit, urna quis bibendum mattis, tellus neque porttitor dolor, bibendum gravida nisl justo eleifend nibh. Integer nec augue in nunc pretium facilisis. Donec tincidunt rutrum tellus, vitae convallis nulla tincidunt in. Aenean luctus porta enim, vitae feugiat nisl rutrum ut.
48 Wichtigstes Hilfmittel für eine einheitliche Ausrichtung: Gitter (Grid)
49
50
51
52
53
54 Konstruktion nach dem goldenen Schnitt
55 Kein Gitter, aber einheitliche Abstände
56 Kein Gitter, aber einheitliche Abstände
57 Dominanz
58 Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig
59 Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig
60 Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig
61 Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig
62 Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig Wichtig
63 Dominanz ergibt sich, wenn einem oder mehreren Elementen durch Farbe,, Form, oder Größe Ausrichtung besonderes Gewicht gegeben wird
64 ... besonderes Gewicht...
65 ... besonderes Gewicht...
66 Wettrüsten vermeiden! Whitespace
67
68 ... besonderes Gewicht...
69 Visuelles Gewicht
70
71
72
73 Intensität Farbe Größe Detailgrad
74 Visuelle Hierarchie
75 Fakt: Die reale Welt ist komplex
76 Ideal Lies mich
77 Real Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Lies Bla mich Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
78 Es kann nicht alles gleich wichtig sein
79 Also: Priorisieren
80 Alles gleich wichtig Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Lies Bla mich Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
81 Priorisiert Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Lies Bla mich Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
82 Konkretes Beispiel Dieser Text ist echt superwichtig Dieser Text ist auch sehr wichtig Und dieser Text ist nicht so wichtig wie die anderen, aber das müssen die Leser erst einmal herausfinden
83 Visuelle Hierarchie Dieser Text ist echt superwichtig Dieser Text ist auch sehr wichtig Und dieser Text ist nicht so wichtig wie die anderen, aber das müssen die Leser erst einmal herausfinden Auffälligkeit/Dominanz durch Intensität...
84 Visuelle Hierarchie DIESER TEXT IST ECHT SUPERWICHTIG Dieser Text ist auch sehr wichtig Und dieser Text ist nicht so wichtig wie die anderen, aber das müssen die Leser erst einmal herausfinden...durch Unterschiede in der Form...
85 Visuelle Hierarchie Dieser Text ist echt superwichtig Dieser Text ist auch sehr wichtig Und dieser Text ist nicht so wichtig wie die anderen, aber das müssen die Leser erst einmal herausfinden...durch Unterschiede in der Größe...
86 Visuelle Hierarchie Dieser Text ist echt superwichtig Dieser Text ist auch sehr wichtig Und dieser Text ist nicht so wichtig wie die anderen, aber das müssen die Leser erst einmal herausfinden...oder durch Kombination.
87 Whitespace Dieser Text ist echt superwichtig Dieser Text ist auch sehr wichtig Und dieser Text ist nicht so wichtig wie die anderen, aber das müssen die Leser erst einmal herausfinden Whitespace verstärkt die Wirkung
88 Nähe Dieser Text ist echt superwichtig Dieser Text ist auch sehr wichtig Und dieser Text ist nicht so wichtig wie die anderen, aber das müssen die Leser erst einmal herausfinden Nähe drückt Zugehörigkeit aus
89 Beispiel: Team-Aufstellung
90 Telekom Baskets Bonn Team 2009/2010 Team 2010/2011 Team 2011/ Bryce Taylor 5 Chris Ensminger 6 Johannes Strasser 7 Alex King 8 Moussa Diagne 9 John Bowler 10 Jared Jordan 11 Artur Kolodziejski 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Ronald Dupree 16 Fabian Thülig 17 Jonas Wohlf.-Bottermann 4 Sajmen Hauer 5 Chris Ensminger 6 Jeremy Hunt 7 Alex King 8 Folarin Campbell 9 Fabian Thülig 10 Nic Wise 11 Jacob Jaacks 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Jonas Wohlf.-Bottermann 25 Mark Tyndale 4 Simonas Serapinas 5 Chris Ensminger 6 Benas Veikalas 7 Zvonko Buljan 8 Andrej Mangold 9 Fabian Thülig 10 Jared Jordan 11 Daniel Hain 12 Florian Koch 13 Tony Gaffney 14 Talor Battle 15 Jonas Wohlf.-Bottermann
91 Telekom Baskets Bonn Team 2008/2009 Team 2009/2010 Team 2011/ Bryce Taylor 5 Chris Ensminger 6 Johannes Strasser 7 Alex King 8 Moussa Diagne 9 John Bowler 10 Jared Jordan 11 Artur Kolodziejski 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Ronald Dupree 16 Fabian Thülig 17 Jonas Wohlf.-Bottermann 4 Sajmen Hauer 5 Chris Ensminger 6 Jeremy Hunt 7 Alex King 8 Folarin Campbell 9 Fabian Thülig 10 Nic Wise 11 Jacob Jaacks 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Jonas Wohlf.-Bottermann 25 Mark Tyndale 4 Simonas Serapinas 5 Chris Ensminger 6 Benas Veikalas 7 Zvonko Buljan 8 Andrej Mangold 9 Fabian Thülig 10 Jared Jordan 11 Daniel Hain 12 Florian Koch 13 Tony Gaffney 14 Talor Battle 15 Jonas Wohlf.-Bottermann
92 Telekom Baskets Bonn Team 2009/ Bryce Taylor 5 Chris Ensminger 6 Johannes Strasser 7 Alex King 8 Moussa Diagne 9 John Bowler 10 Jared Jordan 11 Artur Kolodziejski 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Ronald Dupree 16 Fabian Thülig 17 Jonas Wohlf.-Bottermann Team 2010/ Sajmen Hauer 5 Chris Ensminger 6 Jeremy Hunt 7 Alex King 8 Folarin Campbell 9 Fabian Thülig 10 Nic Wise 11 Jacob Jaacks 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Jonas Wohlf.-Bottermann 25 Mark Tyndale Team 2011/ Simonas Serapinas 5 Chris Ensminger 6 Benas Veikalas 7 Zvonko Buljan 8 Andrej Mangold 9 Fabian Thülig 10 Jared Jordan 11 Daniel Hain 12 Florian Koch 13 Tony Gaffney 14 Talor Battle 15 Jonas Wohlf.-Bottermann Ausrichtung
93 Telekom Baskets Bonn Team 2009/ Bryce Taylor 5 Chris Ensminger 6 Johannes Strasser 7 Alex King 8 Moussa Diagne 9 John Bowler 10 Jared Jordan 11 Artur Kolodziejski 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Ronald Dupree 16 Fabian Thülig 17 Jonas Wohlf.-Bottermann Team 2010/ Sajmen Hauer 5 Chris Ensminger 6 Jeremy Hunt 7 Alex King 8 Folarin Campbell 9 Fabian Thülig 10 Nic Wise 11 Jacob Jaacks 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Jonas Wohlf.-Bottermann 25 Mark Tyndale Team 2011/ Simonas Serapinas 5 Chris Ensminger 6 Benas Veikalas 7 Zvonko Buljan 8 Andrej Mangold 9 Fabian Thülig 10 Jared Jordan 11 Daniel Hain 12 Florian Koch 13 Tony Gaffney 14 Talor Battle 15 Jonas Wohlf.-Bottermann Ausrichtung
94 Telekom Baskets Bonn Team 2009/ Bryce Taylor 5 Chris Ensminger 6 Johannes Strasser 7 Alex King 8 Moussa Diagne 9 John Bowler 10 Jared Jordan 11 Artur Kolodziejski 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Ronald Dupree 16 Fabian Thülig 17 Jonas Wohlf.-Bottermann Team 2010/ Sajmen Hauer 5 Chris Ensminger 6 Jeremy Hunt 7 Alex King 8 Folarin Campbell 9 Fabian Thülig 10 Nic Wise 11 Jacob Jaacks 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Jonas Wohlf.-Bottermann 25 Mark Tyndale Team 2011/ Simonas Serapinas 5 Chris Ensminger 6 Benas Veikalas 7 Zvonko Buljan 8 Andrej Mangold 9 Fabian Thülig 10 Jared Jordan 11 Daniel Hain 12 Florian Koch 13 Tony Gaffney 14 Talor Battle 15 Jonas Wohlf.-Bottermann Dominanz
95 Telekom Baskets Bonn Team 2009/ Bryce Taylor 5 Chris Ensminger 6 Johannes Strasser 7 Alex King 8 Moussa Diagne 9 John Bowler 10 Jared Jordan 11 Artur Kolodziejski 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Ronald Dupree 16 Fabian Thülig 17 Jonas Wohlf.-Bottermann Team 2010/ Sajmen Hauer 5 Chris Ensminger 6 Jeremy Hunt 7 Alex King 8 Folarin Campbell 9 Fabian Thülig 10 Nic Wise 11 Jacob Jaacks 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Jonas Wohlf.-Bottermann 25 Mark Tyndale Team 2011/ Simonas Serapinas 5 Chris Ensminger 6 Benas Veikalas 7 Zvonko Buljan 8 Andrej Mangold 9 Fabian Thülig 10 Jared Jordan 11 Daniel Hain 12 Florian Koch 13 Tony Gaffney 14 Talor Battle 15 Jonas Wohlf.-Bottermann Hierarchie
96 Telekom Baskets Bonn 2009/ Bryce Taylor 5 Chris Ensminger 6 Johannes Strasser 7 Alex King 8 Moussa Diagne 9 John Bowler 10 Jared Jordan 11 Artur Kolodziejski 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Ronald Dupree 16 Fabian Thülig 17 Jonas Wohlf.-Bottermann 2010/ Sajmen Hauer 5 Chris Ensminger 6 Jeremy Hunt 7 Alex King 8 Folarin Campbell 9 Fabian Thülig 10 Nic Wise 11 Jacob Jaacks 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Jonas Wohlf.-Bottermann 25 Mark Tyndale 2011/ Simonas Serapinas 5 Chris Ensminger 6 Benas Veikalas 7 Zvonko Buljan 8 Andrej Mangold 9 Fabian Thülig 10 Jared Jordan 11 Daniel Hain 12 Florian Koch 13 Tony Gaffney 14 Talor Battle 15 Jonas Wohlf.-Bottermann Hierarchie
97 Telekom Baskets Bonn 2009/ Bryce Taylor 5 Chris Ensminger 6 Johannes Strasser 7 Alex King 8 Moussa Diagne 9 John Bowler 10 Jared Jordan 11 Artur Kolodziejski 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Ronald Dupree 16 Fabian Thülig 17 Jonas Wohlf.-Bottermann 2010/ Sajmen Hauer 5 Chris Ensminger 6 Jeremy Hunt 7 Alex King 8 Folarin Campbell 9 Fabian Thülig 10 Nic Wise 11 Jacob Jaacks 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Jonas Wohlf.-Bottermann 25 Mark Tyndale 2011/ Simonas Serapinas 5 Chris Ensminger 6 Benas Veikalas 7 Zvonko Buljan 8 Andrej Mangold 9 Fabian Thülig 10 Jared Jordan 11 Daniel Hain 12 Florian Koch 13 Tony Gaffney 14 Talor Battle 15 Jonas Wohlf.-Bottermann
98 Telekom Baskets Bonn Team 2009/2010 Team 2010/2011 Team 2011/ Bryce Taylor 5 Chris Ensminger 6 Johannes Strasser 7 Alex King 8 Moussa Diagne 9 John Bowler 10 Jared Jordan 11 Artur Kolodziejski 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Ronald Dupree 16 Fabian Thülig 17 Jonas Wohlf.-Bottermann 4 Sajmen Hauer 5 Chris Ensminger 6 Jeremy Hunt 7 Alex King 8 Folarin Campbell 9 Fabian Thülig 10 Nic Wise 11 Jacob Jaacks 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Jonas Wohlf.-Bottermann 25 Mark Tyndale 4 Simonas Serapinas 5 Chris Ensminger 6 Benas Veikalas 7 Zvonko Buljan 8 Andrej Mangold 9 Fabian Thülig 10 Jared Jordan 11 Daniel Hain 12 Florian Koch 13 Tony Gaffney 14 Talor Battle 15 Jonas Wohlf.-Bottermann
99 Telekom Baskets Bonn 2009/ Bryce Taylor 5 Chris Ensminger 6 Johannes Strasser 7 Alex King 8 Moussa Diagne 9 John Bowler 10 Jared Jordan 11 Artur Kolodziejski 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Ronald Dupree 16 Fabian Thülig 17 Jonas Wohlf.-Bottermann 2010/ Sajmen Hauer 5 Chris Ensminger 6 Jeremy Hunt 7 Alex King 8 Folarin Campbell 9 Fabian Thülig 10 Nic Wise 11 Jacob Jaacks 12 Vincent Yarbrough 13 Patrick Flomo 14 Tim Ohlbrecht 15 Jonas Wohlf.-Bottermann 25 Mark Tyndale 2011/ Simonas Serapinas 5 Chris Ensminger 6 Benas Veikalas 7 Zvonko Buljan 8 Andrej Mangold 9 Fabian Thülig 10 Jared Jordan 11 Daniel Hain 12 Florian Koch 13 Tony Gaffney 14 Talor Battle 15 Jonas Wohlf.-Bottermann
100
101 Zusammenfassung Ausrichtung um Kanten zu schaffen (ohne sie zu zeichnen) Dominanz um wichtige Einstiegspunkte zu markieren Hierarchien für verständliche Wichtigkeitsabstufung
102 Zusammenfassung (Forts.) Whitespace für Übersicht, Lesbarkeit (und Wertigkeit) Visuelles Gewicht beachten und in Balance halten
103 Fragen?
104 Also: Alles ganz einfach...
105 Regeln beachten Gefälliges Design Positive Emotionen YOU ROCK!!!
106 ! $ $ $!!
107 DANGER! USER DETECTED Critical Situation, Threat Level ALPHA 46 4a d6 dd b5 c a 05 c a1 fc 92 a6 4b b3 0a e d7 4a af 7e 10 4b b c1 53 5e 80 f6 a7 7d 22 4a b1 83 c1 4f b c3 ef aa e7 eb fb 4d b2 13 8e f3 87 f6 93 f4 b7 4b 8e a d7 76 d6 4a 5c bb 51 7b b3 11 ec d2 6c b4 2b a4 e7 a a 7a 83 c9 c c9 f7 f1 92 6d 8e 1d bf 9f ac ce
108 Unser Problem: Anwender sind Menschen...
109 ...keine mobilen Bildverarbeitungs- systeme
110 ängstlich überheblich ungeduldig unlogisch unvernünftig ungerecht
111 Klick, Klick, Klick, Dreckstool!
112 Ganzheitlicher Ansatz
113 User Experience
114 User Experience Nicht einfach die coole neue Art User Interface zu sagen Das Gesamterlebnis eines Nutzers bei Verwendung eines Produktes oder Systems
115 UX Design: Berührungspunkte GUI Design Visual/Graphic Design Usability Information Architecture Information Design Psychologie
116 UX Design: Berührungspunkte GUI Design Visual/Graphic Design Usability Information Architecture Information Design Psychologie
117 Empathie
118 Mitgefühl
119 Wird der Anwender das verstehen?
120 Wer ist eigentlich der / die AnwenderIn?
121 Einsteiger vs. Profis
122 Gelegenheits-User vs. Power-User
123 Profis als Gelegenheits-User vs. Einsteiger als Power-User
124 ?
125 Rollen
126 Rollen helfen festzulegen, wer was in der GUI braucht
127 Leser Autor Administrator
128 Rollen sagen aber nichts über das Verhalten aus
129 Zielgruppen
130 Zielgruppen werden durch Clusterung von Eigenschaften definiert
131 Zielgruppen wecken aber nur schwer Emotionen beim Entwickler
132 85,9% der weiblichen Waisenkinder unter 12 Jahren wünschen sich ein Pony* * Diese Aussage ist wie 38,3% aller Statistiken frei erfunden
133 Lisa (11 Jahre) hat ihre Eltern verloren und wünscht sich ein Pony
134 Personas
135 Persona Virtuelle Person als Stellvertreter einer Zielgruppe Sehr genaue Beschreibung vermittelt anschauliches Bild
136 Wird der Anwender das verstehen?
137 Wird die Zielgruppe der Führungskräfte mit begrenzten IT-Kenntnissen das verstehen?
138 Wird Heinrich das verstehen?
139 Heinrich Abteilungsleiter (56) 2 Kinder, Haus am Stadtrand Wenig Erfahrung mit Office Im Zweifelsfall eher vorsichtig Wichtiger Multiplikator
140 Sabine Sachbearbeiterin (26) Single, Wohnung in der Stadt Office + Business Apps im Intranet, privat Social Apps Wurschtelt sich in Neues rein
141 Beispiel
142 Was Entwickler entworfen haben
143 Was Anwender davon sehen
144 Heinrich Hmm... klingt kompliziert... (Telefon klingelt) Klickt Abbrechen
145 Sabine Muss ich das alles lesen... (Telefon klingelt) Sieht nicht soo gefährlich aus, Gespräch könnte dauern Klickt OK
146 Besser:
147 Personas Erleichtern die Kommunikation Prüfstein bei Design- Entscheidungen
148 Personas Nicht immer einfach Spezielle Personas: Echte Zielgruppendaten notwendig Einblick in spezielle Abläufe / Philosophie einer Firma
149 Empathy Map Brainstorming-Technik zum schnellen Beschreiben einer Persona Ziel: Schnell und plausibel Check durch Diskussion
150 Was denkt und fühlt sie? Was ist ihr wichtig? Wovor hat sie Angst? Was würde sie freuen? Was hört sie? Was sagen Freunde? Was sagt der Chef? Was sagen andere wichtige Leute? Persona Was sieht sie? Umfeld Freunde Wohnsituation Marktangebot Was sagt sie, wie handelt sie? Verhalten in der Öffentlichkeit? Einstellung gegenüber anderen? Gesprächsthemen? Pain Konkrete Ängste, Probleme, Hindernisse Gain Was will sie, wo will sie hin? Was würde sie als Erfolg werten?
151 Szenario Eine plausible Geschichte über eine Persona, die ein (zukünftiges) Produkt oder Feature in einer bestimmten Situation verwendet.
152 Typische Story-Elemente Hauptdarsteller Konflikt Handlung Auflösung
153 Beispiel: Franks erste Woche Frank, Berufseinsteiger in der Software-Entwicklung Mögliche Geschichten Kollegen kennenlernen Ansprechpartner finden Infrastruktur nutzen
154 Franks erste Woche Franks Ziel: Dokument drucken Konflikt: Drucker noch nicht eingerichtet Handlung: Wie Frank herausfindet, welcher Drucker im Netzwerk der richtige ist
155 Franks erste Woche Handlung Frank erinnert sich an URL Intranet-Website erkennt Frank als neuen Mitarbeiter und bietet typische Hilfestellungen an Frank erfährt automatisch den für seine Abteilung richtigen Drucker
156 Franks erste Woche Auflösung Frank kann den Drucker einrichten und das Dokument drucken
157 Szenarien vs. Umsetzung Nicht zu früh an konkrete Lösungen denken Mit Happy Day beginnen, dann Probleme betrachten Ruhig erst einmal ein bisschen rumspinnen
158 Szenarien führen zu Konkreten Anforderungen Frank muss irgendwann drucken Eigenschaften einer erstrebenswerten Lösung Frank kann den Drucker selbst, ohne viel Aufwand einrichten
159 Nächste Schritte Betrachtung anderer Personas Wenn es Konflikte gibt: Kann man sie lösen? Wer hat höhere Priorität? Skizzieren des Ablaufs, nach und nach detaillierter
160 Und wenn man die Zielgruppe gar nicht kennt?
161 Aktivitäten
162 Fakt: Menschen passen sich an
163 Alles eine Frage der Perspektive
164 Anwender wollen keine Software bedienen
165 Anwender wollen ihre Aufgaben erledigen
166 Problem:
167 Alles was man als Entwickler dem Anwendern zeigt, ist ein potentielles Hindernis!
168 Dialoge Popups Eingaben...einfach alles
169 Hindernisse beseitigen Reale Szenarien betrachten Nicht: UI Wrapper auf die API Abläufe rundlutschen Weniger Entscheidungen Eingaben erleichtern Gute Vorgaben Vorschlagslisten...
170 Mentales Modell
171
172
173 Mentales Modell Entsteht im Kopf der Anwender Versuch, Verhalten (der GUI) erklärbar nachvollziehbar vorhersagbar zu machen
174
175
176 Mentale Modelle sind...
177 persönlich
178 wechselnd
179 unvollständig
180 häufig falsch
181 Anwender machen sich ein Modell - ob es uns passt oder nicht
182 Deshalb: Modellbildung in die richtigen Bahnen lenken!
183 Beispiel Windows Phone
184 Windows Phone Sample
185 Windows Phone
186
187 FRAGEN?
188 Roland Weigelt UI / UX Einführung für Entwickler Teil NET User Group Köln
189
190 Entwurfsmuster (engl. Design Patterns) Bewährte generische Lösungsansätze für immer wiederkehrende Entwurfsprobleme
191 Raumschiff Enterprise
192 Raumschiff Enterprise steckt voller Design Patterns!
193 Beispiel Problemstellung: Den Zuschauern soll durch den Tod eines Team-Mitglieds deutlich gemacht werden, dass der Alien-Planet gefährlich ist Rahmenbedingung: Wöchentliche laufende Serie
194 Pattern Red Shirt Disease Lösung: Das Opfer ist beliebig austauschbar ( Rothemd ) Statistik * 430 Besatzungsmitglieder davon 59 getötet davon 43 Rothemden 72,9% * Quelle:
195 UI Patterns
196 Architektonischer Umgang mit UI-Elementen
197 Beispiele für UI Patterns
198 Master - Detail
199 Master - Detail
200 Master - Detail
201 Master - Detail Master Detail
202 Ribbon
203 Ribbon was ist das eigentlich? Geschachtelte Gruppierung Erste Ebene - Gruppierung nach Benutzungskontexten
204 Ribbon was ist das eigentlich? Geschachtelte Gruppierung Zweite Ebene - Gruppierung von Funktionen
205 Ribbon was ist das eigentlich? Geschachtelte Gruppierung...aber keine tiefe Hierarchie!
206 Ribbon und was bietet es? Viele Funktionen gleichzeitig hohe Entdeckbarkeit Die richtigen Funktionen für den aktuellen Kontext Empfehlung: Windows UX Guidelines lesen!
207 Große Patterns
208 Kleine Patterns
209 CheckBox
210 CheckBox Auswahl zwischen zwei klar gegensätzlichen Alternativen So klar, dass die zweite nicht erwähnt werden braucht Richtig: Das will ich haben! Falsch: Querformat
211 Wer GUIs mit offenen Augen betrachtet, sieht überall Patterns! (Keine große Überraschung)
212 Schlecht: Andere GUIs einfach blind kopieren
213 Verwendung von Abbildungen aus den Windows User Experience Guidelines mit freundlicher Genehmigung der Microsoft Corporation
214 Wichtig: Tieferes Verständnis Falsch: Verwendung weil cool Was ist der Kern des Patterns? Wofür ist es geeignet? Wofür nicht?
215 Quellen für Patterns
216 Pattern Libraries (Links siehe Anhang)
217 Ziele dieses Vortragteils Grundlagen schaffen Analytische Denke auch für GUIs Blick schärfen Details entscheiden über den Erfolg
218 Abstrakte Betrachtung Erkenntnisse für die Praxis
219
220 UI Design Patterns
221 UI Design Patterns Darstellung Interaktion
222 Darstellung
223 Darstellung: Was?
224 Informationen (Nutz-)Daten Aus der Welt der Anwender z.b. Daten aus der Datenbank Sonstige Inhalte, u.a. Beschriftungen Hinweis-/Fehler-/Hilfstexte
225 Daten
226 1. Einzelnes Objekt 2. Mehrere Objekte
227
228
229 {D5520D83-FFD0-46D1-85E DCEADBE}
230 Foo.Bar.Thingy.Item
231 Anzeigename
232 Anzeigename Für Menschen verständlich Hinreichend unterscheidbar
233 (Bild)
234 Bilder in GUIs: Varianten a) Bilder repräsentieren Objekte Statisch: z.b. Autos in Online Shop Dynamisch: z.b. Thumbnails b) Bilder stehen für Kategorien z.b. Dateityp, Projektstatus c) Bilder visualisieren Daten
235 Zusätzlicher Text
236 Anzeigename
237 Einfachste Objekt-Darstellung: Anzeigename und/oder Bild reicht häufig nicht aus
238
239 Anzeigename und/oder Bild plus weitere Eigenschaften
240 Beispiel: Buch
241
242 Entwicklersicht Alle Informationen vorhanden Hey, sogar mit Bild! Anwendersicht Schwer zu lesen Und bei einfarbigem Cover?
243
244
245 Demo Einzelnes Objekt
246 Dominanz Hierarchie Whitespace Semantische Gruppierung Domänenspezifische Darstellung
247 Es lohnt sich, den Charakter von Objekteigenschaften zu kennen
248 Technische Sicht Titel Text Autor Text Verlag Text Art Text Seiten Zahl Auflage Zahl Veröff.datum Datum Sprache Text ISBN-13 Text
249 Charakterisierung Identifizierend? Falls ja: Lokal / Global? Selbstbeschreibend? Falls ja: Wirklich? Für wen? Zusammenhang mit anderen? Gruppierung Layout
250 Zusammengesetzter Anzeigetext Anwenderhandbuch (PDF, 210Kb)
251 Zusammengesetzter Anzeigetext Anwenderhandbuch (PDF, 210Kb) Titel Format Dateigröße
252 Zusammengesetzter Anzeigetext Anwenderhandbuch (PDF, 210Kb) Produkt XY Anwenderhandbuch (DOCX, 240Kb) Anwenderhandbuch (PDF, 210Kb) Werbebroschüre (DOCX, 145Kb) Werbebroschüre (PDF, 126Kb)
253 Zusammengesetzter Anzeigetext Anwenderhandbuch (PDF, 210Kb) Urlaub vom bis Max Mustermann
254 Charakterisierung Endliche Anzahl von Werten? Transformation möglich: Text Bilder, Farben Status Gut Mittel Schlecht
255 Charakterisierung Endliche Anzahl von Werten? Transformation möglich: Text Bilder, Farben Status Gut Mittel Schlecht
256 Charakterisierung Endliche Anzahl von Werten? Transformation möglich: Text Bilder, Farben Status Gut Mittel Schlecht?!
257 Charakterisierung Texte: Länge bekannt? Minimal/Typisch/Maximal Auswirkungen auf Layout Entwurf vs. Realität Entwurf: Realdaten: Beispieltext Donaudampfschifffahrts
258 Charakterisierung Texte: Was ist wichtig? Anfang/Ende/Mitte/Alles? Evtl. gekürzte Anzeige sinnvoll? Das Geheimnis erfolgreicher GUI-Designer [...] mehr D:\Talks\... \ User Interface Patterns.pptx Bestellnummer: A
259 Charakterisierung Zahlen Groß/Klein Nur groß/klein oder gemischt? Negative Werte? u.v.m.
260 Fragen?
261 1. Einzelnes Objekt 2. Mehrere Objekte
262
263
264 Listen von Objekten a) Auflistung von Einzelobjekten b) Spezialfall: DataGrid Mehr als die Summe seiner Teile Gut bei wechselnden Prioritäten
265 Demo: Vertikales Layout
266 Vertikales Layout Geeignet für breite, aber nicht allzu hohe Objekte Klassisch Langweilig? Aber: Effektiv
267 Vertikales Layout A B C C Danach habe ich nicht gesucht Danach habe ich auch nicht gesucht Danach habe ich gesucht, endlich gefunden!
268 Demo: Horizontales Layout
269 Horizontales Layout Für wenige, schmale Objekte Mal was anderes Problem: Mausrad Interessant: Zeitachse
270 Horizontales Layout
271 Horizontales Layout Interessanter Spezialfall: Listen in Satzform Wenige, nicht zu lange Texte Eis: Vanille, Erdbeer, Schoko
272 Demo: Wrap/Matrix-Layout
273 Wrap/Matrix-Layout Attraktive Darstellung Will gut überlegt sein! Eher Ich suche X oder IKIWISI? I Know It When I See It
274 Wrap/Matrix-Layout: Suche
275 Wrap/Matrix-Layout: Suche
276 Wrap/Matrix-Layout: Suche
277 Wrap/Matrix-Layout: Stöbern
278 Demo: Verschiedene Layouts
279 Fragen zur Auswahl von Listen-Layouts
280 Was ist der Anwendungsfall? Überblick gewinnen? Daten analysieren? Nach etwas Konkretem suchen? Einfach mal stöbern?
281 Wahrscheinliche Betrachtung? Schnelles Scannen nach etwas Bestimmtem? Ausschau nach (irgend)etwas Interessantem?
282 Kochrezept Charakteristik der Daten herausarbeiten Konkrete Anwendungsfälle identifizieren Augenbewegungen minimieren Geeignetes Layout
283 Zusammenfassung: Varianten Als Liste von Einzelobjekten Als Aufzählung in Satzform Tabellarisch Matrix (Wrap)
284
285 Verschiedenes
286 1. Anwender direkt in der GUI unterstützen
287 Was ist zu tun, damit Anwender fundierte Entscheidungen treffen können?
288 Was können wir tun, dass dafür kein Kontextwechsel nötig ist?
289 Demo: Einstellungen
290
291 2. Wie geht man mit Komplexität um?
292 Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich!
293 Entfernen Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich!
294 Entfernen Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich!
295 Organisieren Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich!
296 Organisieren Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich!
297 Verbergen Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich!
298 Verbergen Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Mehr...
299 Verbergen Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich!
300 Verschieben Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich!
301 Verschieben A Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! Klick mich! B C Die Funktionen sind nur in einem bestimmten Kontext zugänglich
302 Elemente... Entfernen Organisieren Verbergen Verschieben
303 Patterns
304 Progressive Disclosure Schrittweise Offenlegung
305 Progressive Disclosure Verbergen von UI-Elementen, die nicht für alle Use Cases notwendig sind UI-Elemente erscheinen bei Bedarf (interaktiv/automatisch) (siehe auch Microsoft UX Guidelines)
306 Demo: Progressive Disclosure
307 Responsive Disclosure Reagierende Offenlegung
308 Responsive Disclosure Einblenden von UI-Elementen in Abhängigkeit von Eingaben bzw. Aktionen des Benutzers Spezialfall von Progressive D. Eher fachlich als technisch
309 Demo: Responsive Disclosure
310 Responsive Enabling Reagierende Freigabe
311 Responsive Enabling Freigeben von UI-Elementen in Abhängigkeit von Eingaben bzw. Aktionen des Benutzers
312 Demo Responsive Enabling
313 Responsive Disclosure Responsive Enabling Ihr neues Auto Neu kaufen Gebraucht kaufen Leasen Ihr neues Auto Neu kaufen Ihre Wunschkonfiguration Sonderangebote Gebraucht kaufen Mit Händlergarantie Privat vermittelt Leasen Besten Tarif berechnen Attraktive Paketpreise
314 Responsive Disclosure Anwender wird beim ersten Blick nicht erschlagen Erscheinen u.u. überraschend Dynamik möglich Layout ändert sich Responsive Enabling Anwender sieht sofort, welche Möglichkeiten es gibt Evtl. nicht klar, was die Elemente aktiviert Viele deaktivierte Bereiche schnell verwirrend Layout bleibt gleich
315
316 3. Die richtige Lösung
317 Kaum eine Lösung ist für alle Fälle gleich gut...
318 Chance: Spezialfälle erkennen
319 Demo: Spezialfall
320
321 Sammlung wichtiger Fragen
322 Auswahl von Patterns Welche Informationen sollen Anwender warum sehen? Was sollen Anwender warum machen können? Wie hilft dies den Anwendern, ihre Aufgabe zu erfüllen?
323 Darstellung von Daten Was ist der Charakter einer darzustellenden Information?...welche Darstellungen sind dadurch denkbar? Gibt es Wege, die Komplexität der GUI (lokal) zu verringern?
324 Material
325 Pattern Libraries
326 Websites (Pattern Libraries) Quince UI Patterns Welie.com
327 Bücher Designing Interfaces 2nd Edition User Interface Patterns, gute Mischung aus Beispielen + Theorie
328 Bücher Don t Make Me Think Oft zitierte, gut lesbare Einführung in grundlegende Usability-Themen
329 Bücher Designing the Obvious Anwender, Use Cases, mentale Modelle, schrittweise Verfeinerung
330 Bücher Simple and Usable Vereinfachung am Beispiel einer DVD-Fernbedienung: So einfach wie möglich, aber nicht einfacher
331 UX Interaction Guidelines Online und als PDF-Download -us/library/aa aspx
332 Fragen?
333 Vielen Dank!
334 ux4devs.de
335 Verwendung der Abbildungen aus den User Experience Guidelines mit freundlicher Genehmigung der Microsoft Corporation.
Roland Weigelt UI / UX-Grundlagen für Entwickler....und andere Nicht-Designer..NET Developer Group Braunschweig
Roland Weigelt UI / UX-Grundlagen für Entwickler...und andere Nicht-Designer.NET Developer Group Braunschweig Roland Weigelt Beruflich: Comma Soft AG 15 Jahre Software-Entwickler Bereich Enterprise-Anwendungen
Roland Weigelt UI / UX-Grundlagen für Entwickler....und andere Nicht-Designer. Juli 2012 Wuppertal/Berlin
Roland Weigelt UI / UX-Grundlagen für Entwickler...und andere Nicht-Designer Juli 2012 Wuppertal/Berlin Roland Weigelt Beruflich: Comma Soft AG 15 Jahre Software-Entwickler Bereich Enterprise-Anwendungen
UI / UX-Grundlagen für Entwickler...und andere Nicht-Designer
Roland Weigelt UI / UX-Grundlagen für Entwickler...und andere Nicht-Designer UG-Tour Berlin, Leipzig, Dresden Roland Weigelt.NET Community User Group Bonn-to-Code.Net Konferenz dotnet Cologne Interesse:
Magazin der Valeo-Verbundkliniken. Analysiert. Abgefahren. Ausgebildet
N o 04 März 2013 Magazin der Valeo-Verbundkliniken Analysiert Die Betten sind meist alle belegt, die Schlangen in der Notaufnahme eher lang. Wie kommt es, dass die Kassen nicht auch prall gefüllt sind?
Roland Weigelt User Interface Patterns. Kochrezepte für die Gestaltung von GUIs. 25.4.2012 -.NET User Group Bielefeld
Roland Weigelt User Interface Patterns Kochrezepte für die Gestaltung von GUIs 25.4.2012 -.NET User Group Bielefeld Raumschiff Enterprise Raumschiff Enterprise steckt voller Design Patterns! Entwurfsmuster
Roland Weigelt User Interface Patterns. Kochrezepte für die Gestaltung von GUIs
Roland Weigelt User Interface Patterns Kochrezepte für die Gestaltung von GUIs UG Tour Juli 2012 Entwurfsmuster (engl. Design Patterns) Bewährte generische Lösungsansätze für immer wiederkehrende Entwurfsprobleme
qwertyuiopasdfghjklzxcvbnmq ertyuiopasdfghjklzxcvbnmqwer tyuiopasdfghjklzxcvbnmqwerty opasdfghjklzxcvbnmqwertyuiop
qwertyuiopasdfghjklzxcvbnmq wertyuiopasdfghjklzxcvbnmqw ertyuiopasdfghjklzxcvbnmqwer tyuiopasdfghjklzxcvbnmqwerty Wissenschaftliche Arbeit uiopasdfghjklzxcvbnmqwertyui mit Word 2010 24.02.2014 opasdfghjklzxcvbnmqwertyuiop
Roland Weigelt User Interface Patterns. Kochrezepte für die Gestaltung von GUIs
Roland Weigelt User Interface Patterns Kochrezepte für die Gestaltung von GUIs Roland Weigelt Beruflich: Comma Soft AG 15 Jahre Software-Entwickler seit Januar User Experience Specialist Bereich Enterprise-Anwendungen
Inhalte einsetzen und Formatieren
Inhalte einsetzen und Formatieren Damit wir die Standard Formatierung des Layouts/Templates sehen können, erstellen wir einen Beitrag und einen Menüpunkt Formate. In diesen Beitrag werden wir dann einen
Das Internet der Dinge
Das Internet der Dinge Horst Hellbrück Kompetenzzentrum CoSA Fachbereich Elektrotechnik & Informatik Fachhochschule Lübeck http://www.cosa.fh-luebeck.de 19.05.2014 Horst Hellbrück - Internet der Dinge
Donec eget tellus aliquam augue feugiat mollis
Donec eget tellus aliquam augue feugiat mollis Ch. des Lilas 8 1700 Fribourg Referenz: AA.12 DONEC EGET TELLUS ALIQUAM AUGUE FEUGIAT MOLLIS CH-1700 Fribourg, Ch. des Lilas 8 CHF 1'200'000.- Beschreibung
Bewerbung bei den Big 4 und im Consulting
Bewerbung bei den Big 4 und im Consulting Tipps & Tricks 3. Juli 2015 Felix Heckert felix-heckert.de Bewerbung bei den Big 4 und im Consulting Wie bewirbt man sich bei Den BIG 4 (KPMG, PWC, Deloitte, E&Y)
Einführung CD/CI Unser Engagement sichtbar machen
Einführung Einführung CD/CI Unser Engagement sichtbar machen Die ist eine humanitäre Organisation und ein Sportverband zugleich. Sie blickt auf eine lange Tradition zurück, die 1933 aus einem wichtigen
UNSERE PRAXEN. unser höchstes Anliegen. Außer einer ersten fachkundigen, einfühlsamen Konsultation erwartet Sie daher eine umfassende Behandlung:
UNSERE PRAXEN Wir heißen Sie herzlich Willkommen in unseren Zahnarztpraxen! In 1997 haben wir unsere erste Zahnpraxis im Herzen von Mosonmagyaróvar, in der Fußgängerzone, eröffnet. Seither ist es unser
Corporate Design Manual
Corporate Design Manual (C)V.Schuster 2013 Auf offiziellen Dokumenten wird der Claim immer mit gesetzt. Wie in dem unterem Beispiel gezeigt. Logo Die Puzzleteile wurden gewählt um die Verbundenheit der
MUSTER. culture connected 2015/16 Konzepteinreichung. EinreicherIn. Schule. Ansprechperson Schule. Projekt: Beispielhaftes Fotografieprojekt
culture connected 2015/16 Konzepteinreichung Projekt: Beispielhaftes projekt Nr vor Jury: 010S EinreicherIn Einreichung, Projektleitung und Abrechnung durch Schule Schule Schulkennzahl 901011 Schulbezeichnung:
Corporate Design Manual Straßenverkehrsamt Frankfurt am Main
Corporate Design Manual Straßenverkehrsamt Frankfurt am Main Inhaltsverzeichnis Logotype Einsatz 3 Schutzraum 5 Logotype SVA und Logotype Stadt Frankfurt am Main Einsatz 7 Schutzraum 8 Typografie Einsatz
Design Manual. Nutzung und Gestaltung
Design Manual Nutzung und Gestaltung Inhalt Grundsätzliches 3 1. Dachmarke 4 1.1 Beschreibung 4 1.2 Anwendungsbereich und Nutzerkreis 5 1.2.1 Stadt Essen/Konzerntöchter 5 1.2.2 Partner des Prozesses 5
LAuF- TerMIne. aktiv Laufen - SPEZIAL Die große Saisonvorschau 2016 inklusive aller Lauftermine. Saisonstart. Ausrüstung Des Läufers neue Kleider
Media-Information 2016 aktiv Laufen - SPEZIAL Die große Saisonvorschau 2016 inklusive aller Lauftermine Marken Verlag GmbH Pollenalarm: Laufspaß trotz Allergie Trailschuhtest 2015 Schlingentraining für
Briefe und Rechnungen
Briefe und Rechnungen LATEX-Kurs der Unix-AG Andreas Teuchert 24. Juni 2013 Briefe und L A TEX Vorteile Elemente werden automatisch richtig positioniert einfache Möglichkeit, Serienbriefe zu erstellen
Titel der Diplomarbeit
Diplomarbeit im Fachgebiet Wirtschaftsinformatik vorgelegt von: Studienbereich: Hans Meier Wirtschaftsinformatik Matrikelnummer: 12 34 56 Erstgutachter: Zweitgutachter: Prof. Dr. Werner Berentzen Dipl.-Inf.
Montageanleitung. Schritt 1. Schritt 2. Schritt 3. Demontage der alten Duschwanne. Der Untergund sollte tragfähig sowie staub-, und fettfrei
So renoviert man heute Badezimmer! Montageanleitung Schritt 1 Demontage der alten Duschwanne. Der Untergund sollte tragfähig sowie staub-, und fettfrei sein. Schritt 2 Fehlenden Fliesenbelag und Rücksprünge
Titel der Masterarbeit
Masterarbeit im Fachgebiet Software-Engineering vorgelegt von: Studienbereich: Hans Meier Software-Engineering Matrikelnummer: 12 34 56 Erstgutachter: Zweitgutachter: Prof. Dr. Werner Berentzen Dipl.-Inf.
Handreichung. Projektprüfung SJ2011/2012. Informationen für Schüler und Lehrer
Handreichung Projektprüfung SJ2011/2012 Informationen für Schüler und Lehrer A. Ablauf des Projekts B. Merkblatt für Schüler C. Stundeninhalte D. Projektmappe (Vorlagen & Tipps) Marie-Pettenbeck-Schule
Mindestumfang VWA. Verdeutlichung des Mindestumfanges von 40.000 Zeichen. Vorwissenschaftliche Arbeit verfasst von Hans Probemuster Klasse XY
Mindestumfang VWA Verdeutlichung des Mindestumfanges von 40.000 Zeichen Vorwissenschaftliche Arbeit verfasst von Hans Probemuster Klasse XY Betreuer: Valentin Prüfer November 2011 BG/BRG Musterschule 1100
Tagungs- und Seminarguide
Tagungs- und Seminarguide Hotels und Veranstaltungsorte Tagungshotels Bildungszentren Kongresszentren Eine Verlagsbeilage von sieben kooperierenden Verlagen: Eine Verlagsbeilage von acht kooperirenden
Unternehmenspräsentation. Wien 2012
factsandfigures Unternehmenspräsentation Wien 2012 Unternehmensprofil factsandfigures Präsentations- Design Consulting Power- Point Training Trainings Videos Unser Portfolio (1/2) Präsentationsdesign PowerPoint
Wunder MODERNER BAUKUNST von Dubai
ISSUE 00/2015 JULI AUGUST BEST BRD 8,90 AUT 8,90 BENELUX 8,90 CH 8.90 CHF VEREINIGTE ARABISCHE EMIRATE R E I S E N K U N S T K U L T U R B U S I N E S S Wunder MODERNER BAUKUNST von Dubai Klimatische Bedingungen
VIVA Publishing Lösungen: Produktübersicht 2012/2013
VIVA Publishing Lösungen: Produktübersicht 2012/2013 WE PUBLISH THE WORLD Machen Sie Ihren Kopf frei mit VIVA... Desktop Publishing Ihr kostenloser Einstieg in die Welt erstklassiger Layoutprogramme sowie
Mindestumfang VWA. Verdeutlichung des Mindestumfanges von 40.000 Zeichen. Vorwissenschaftliche Arbeit verfasst von Hans Probemuster Klasse XY
Mindestumfang VWA Verdeutlichung des Mindestumfanges von 40.000 Zeichen Vorwissenschaftliche Arbeit verfasst von Hans Probemuster Klasse XY Betreuer: Valentin Prüfer November 20.. BG/BRG Musterschule 1100
Mindestumfang VWA. Verdeutlichung des Mindestumfanges von 40.000 Zeichen. Vorwissenschaftliche Arbeit verfasst von Hans Probemuster Klasse XY
Mindestumfang VWA Verdeutlichung des Mindestumfanges von 40.000 Zeichen Vorwissenschaftliche Arbeit verfasst von Hans Probemuster Klasse XY Betreuer: Valentin Prüfer November 2011 BG/BRG Musterschule 1100
Titel der Präsentation
Platzhalter für Bild, Bild auf Titelfolie hinter das Logo einsetzen Titel der Präsentation Vorname, Nachname des Referenten, Datum Hier steht eine einzeilige Headline Nullam pulvinar lorem sed enim placerat
Klug kombinieren - dual studieren. Informationen für Studieninteressierte.
Klug kombinieren - dual studieren Informationen für Studieninteressierte www.th-brandenburg.de Prof. Dr.-Ing. Burghilde Wieneke Toutaoui Präsidentin der Technischen Hochschule Brandenburg Die Technische
GUIDE CORPORATE DESIGN
GUIDE LepuschitzMedia.com RaphaelLepuschitz.net CORPORATE DESIGN Potfather.net DerWeise.com Das menschliche Auge sucht immer nach erkennbaren Strukturen und Formen. Ein gutes Design liefert diese und lässt
Vorlagen in MediaWiki
Vorlagen in MediaWiki Dieses Handout beschreibt, wie Sie Vorlagen in Ihr MediaWiki-System einbinden können. 1. Was sind Vorlagen? Eine Vorlage ist ein vorgefertigter Textbaustein, der in einen Artikel
15th AnniversAry A BACkwArd glance edition BCC est. in 2001
The Place to Be 15th Anniversary A Backward glance edition BCC est. in 2001 BCC est. in 2001 6 Dinner Impressum Herausgeber: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula
Briefe in L A TEX eine kleine Vorstellung von Briefklassen
Christian Degenkolb Briefe in L A TEX eine kleine Vorstellung von Briefklassen 20. Juni 2010 L A TEX-User-Treffen Freiberg Inhalt Die letter-klasse Die g-brief-klasse Ein paar Worte zu DIN 5008 und 676
Mediadaten 2017 ÖSTERREICH RANKINGS & ANALYSEN. Kanzleikennzahlen
Mediadaten 2017 www.juve-verlag.at exklusiv: Kanzleikennzahlen H A N D B U C H ÖSTERREICH 2017 2018 RANKINGS & ANALYSEN RANKINGS & ANALYSEN RANKINGS & ANALYSEN RANKINGS & ANALYSEN RANKINGS & ANALYSEN RANKINGS
Spectabilität, sehr geehrter Herr Professor Bicker, sehr geehrte Damen und Herren,
Universitätsmedizin, 68135 Mannheim An den Dekan der Medizinischen Fakultät Mannheim der Universität Heidelberg Habilitationsausschuss XXX UNIVERSITÄTSKLINIK DR. MED. XXX TEL.: +49-0621-383-XXX FAX: +49-0621-383-XXX
Fördern Sie Ihr. nachhaltig
Fördern Sie Ihr Geschäftswachstum nachhaltig ADVANCED Rayovac, Hersteller der weltweit meistverkauften Hörgerätebatterien, ist seit mehr als 100 Jahren in der Batteriebranche tätig. In dieser Zeit hat
PORTFOLIO Kristin Klasinski
PORTFOLIO Kristin Klasinski 1988 in Franken geboren wurde schon zu Schulzeiten jede langweilige Matheaufgabe mit kleinen Skizzen von mir verschönert. Nach der Schule beschloss ich, in Bamberg meiner Leidenschaft
Herr Bundesrat, sagen Sie einfach, hinter jedem guten Film steht das MEDIA Programm.
MEDIA geförderte Schweizer Projekte 2010 Herr Bundesrat, sagen Sie einfach, hinter jedem guten Film steht das MEDIA Programm. Der grosse Kater, Regie: Wolfgang Panzer, 2010 2010: Eine überzeugende Bilanz
Ideen Visualisierung Realisation
Ideen Visualisierung Realisation Am Anfang steht das Wort Austausch und Dialog Lorem ipsum dolor sit amet, consectetuer Interesse elit, sed diam Planung nibh euismod tincidunt ut laoreet dolore magna aliquam
HOME ÜBER ALETSCHBAU KAUFEN VERKAUFEN WIR BAUEN FÜR SIE KONTAKT AKTUELL UNSER CREDO TEAM REFERENZEN
ÜBER ALETSCH VER UNSER CREDO TEAM REFERENZEN AKTUELL ean commodo ligula eget dolor. Aenean massa ean commodo ligula eget dolor. Aenean massa ÜBER ALETSCH VER LOREMIP SUM LORE IPSUM LORE ÜBER ALETSCH VER
Leitfaden Kommunikation
Leitfaden Kommunikation zur Durchführung von Projekten im Rahmen des INTERREG IV A-Programms Deutschland-Nederland 2007-2013 Sehr geehrter Lead Partner, Sie und Ihre Partner planen ein Projekt im Rahmen
Fallstudie Destinationsmarketing. München, April 2012
Fallstudie Destinationsmarketing München, April 2012 PLANSTAND hat sich in den letzten Jahren im Bereich des Destinationsmarketing sehr stark positioniert und auf die Beratung, Konzeption und Kreation
Guidelines für PR-Artikel
JOURNAL KUNDENMAGAZIN JOURNAL DES CLIENTS Guidelines für PR-Artikel Text-Guidelines für PR-Artikel «Journal» Winterhalter + Fenner I. Vorbemerkung Nachfolgende Hinweise sind im Sinne von Richtlinien für
PowerPoint-Master. Titel der Säulengrafik (Entwicklung) In Tausend Euro. Der Untertitel ist etwas kleiner
Titelvariante 2 Das Titelmotiv (Platzhalter) darf gegen ein qualitativ gleichwertiges Bild ausgetauscht werden. Bitte denken Sie an den Rechtehinweis ( Bildautor). Thema der Präsentation maximal zweizeilig
Barrierefreiheit in Webauftritten - BayBITV
Barrierefreiheit in Webauftritten - BayBITV Rechenzentrum Dr. J. Dirndorfer 22.02.2011 Rechtliche Grundlagen BayBITV (1. Januar 2007): Bayerische Barrierefreie Informationstechnik-Verordnung (Bayerische
CD-HANDOUT. Das Corporate Design der Technischen Universität Chemnitz Version 5 Mai 2014
CD-HANDOUT Das Corporate Design der Technischen Universität Chemnitz Version 5 Mai 2014 1 2 Inhalt Wort-Bild-Marke der TU Chemnitz Seite 5 Festlegung für den Einsatz und die Verwendung Hausfarben und Fakultätsfarben
Tipps und Tricks. für die PDF-Präsentation
Tipps und Tricks für die PDF-Präsentation Um die Wirkung der einzelnen Punkte sehen zu können, muss die Präsentation zuerst heruntergeladen und dann mit folgenden Einstellungen im Adobe Acrobat Reader
Manual der Landesregierung Stand Mai 2010
Manual der Landesregierung Stand Mai 2010 Gebrauchsanweisungen, Beipackzettel, Handbücher. Sie erweisen sich entweder als sehr praktisch oder sehr lästig. Gerade Handbücher, die zu viele Informationen
westside, Bern Migros
D/E Portrait Leistungen Referenzen Prime Tower, Zürich Prime Tower Kontakt D/E Portrait Leistungen Referenzen Kontakt Prime Tower, Zürich Prime Tower HC AG verfügt über ein breitgefächertes und internationales
Mediadaten 2015 «take it» Preise und Leistungen gültig ab 01.01.2015
Mediadaten 2015 «take it» Preise und Leistungen gültig ab 01.01.2015 Verbandszeitschrift des Schweizerischen Bankpersonalverbands Der Schweizerische Bankpersonalverband SBPV vertritt und fördert die sozialen,
Logos, Wortmarken und Signets
Logos, Wortmarken und Signets das Kremer fragbenny BroCoaching BBQ-Linux Mitessa fahrlässig Dzoni s Logo-Redesign für ein Gästehaus am Dobben. Die verwendtete Schrift heißt NouvelleVague und ist für persönliche
Retargeting Technologie. www.adrolays.de
Retargeting Technologie EINLEITUNG Mehr als 89% aller Besucher verlassen eine Webseite ohne etwas zu kaufen. Das adrolays Retargeting ist eine qualitativ hochwertige Lösung potentiellen Kunden Kaufanreize
Spielplan SaiSon 09/10
Spielplan 1. BundeS liga SaiSon 09/10 Liebe Fußballfreunde und freundinnen! Eine neue Saison der FußballBundesliga steht bevor. Sicher können auch Sie es kaum erwarten, bis in den Stadien wieder der Ball
XPSNET. Xperts. Passion. Success. Unser Leistungsportfolio
XPSNET. Xperts. Passion. Success. Unser Leistungsportfolio DAFÜR STEHEN WIR Als zuverlässiger und vertrauensvoller Partner setzen wir auf Qualität und Flexibilität gegenüber unseren Kunden und Mitarbeitern.
Kapitel 1 2 14. Februar 2010
1 14. Februar 2010 Kapitel 1 2 14. Februar 2010 E-BusinessMarketing KPI MarketingOnline KPI Marketing Web Web Assessment Usability Benchmarking Controlling Controlling Benchmarking Usability E-Business
Design-Handbuch. für das Erscheinungsbild des Bundes der Freien Waldorfschulen
Design-Handbuch für das Erscheinungsbild des Bundes der Freien Waldorfschulen Version 1.0 März 2015 Inhalt 1.0 Logo Bund... 4 1.1 Logo-Varianten... 6 1.2 Logo der Landesarbeitsgemeinschaften... 8 1.3 Logos
W&V Extra Automobil: Marken & Marketing
W&V Extra Automobil: Marken & Marketing Zum Automotive Brand Contest 2014 Juni 2014 DAS KONZEPT Pünktlich zum Automotive Brand Contest 2014 am 02. Oktober 2014 erscheint erstmalig das W&V Extra zum Wettbewerb.
F Ü R DA S. Kampagnen Design Z U R E U ROPAWA H L 2 014
K U RZ A N LE IT U NG F Ü R DA S Kampagnen Design Z U R E U ROPAWA H L 2 014 Das visuelle Erscheinungsbild der Kampagne beeinflusst den kommunikativen Erfolg. Je konsequenter die Elemente des Erscheinungsbildes
VIVA Publishing Lösungen: Produktübersicht 2009/2010
VIVA Publishing Lösungen: Produktübersicht 2009/2010 WE PUBLISH THE WORLD Machen Sie Ihren Kopf frei mit VIVA... Desktop Publishing Ihr kostenloser Einstieg in die Welt erstklassiger Layoutprogramme sowie
P r o f i l + das Tool für kompetenzbasierte Personalentwicklung
P r o f i l + das Tool für kompetenzbasierte Personalentwicklung Idee Die Firma hi-cons GmbH in Bern befasst sich mit Fragen der Personal- und Organisationsentwicklung. Neben Schulungs- und Beratungsangeboten
VivaDesigner : Desktop- und Web-Version
VivaDesigner : Desktop- und Web-Version WE PUBLISH THE WORLD Willkommen in der Zukunft Der VivaDesigner ist das weltweit einzige Satz- und Layoutprogramm für Desktop und Web. Mit seinen wegweisenden Konzepten
Selbständige Projektarbeit 2008. Drogensucht. Kurzes Glück, langes Leiden. Anja Neuhaus Oberstufenzentrum Stockhorn Konolfingen. März 2008, Klasse s9b
Selbständige Projektarbeit 2008 Drogensucht Kurzes Glück, langes Leiden Anja Neuhaus Oberstufenzentrum Stockhorn Konolfingen März 2008, Klasse s9b Drogensucht Selbständige Projektarbeit im Rahmen des Abschlussprojektes
Festpreisangebot Nr. 29. Festpreisangebot Nr. 40
Festpreisangebot Nr. 29 Festpreisangebot Nr. 40 Gültig vom 1. November Mai 20092014 bis 31. bis 30. Oktober April 2009 2015 Festpreisangebot Nr. 40 Gültig vom 1. November 2014 bis 30. April 2015 ALMRAUSCHSTRASSE
Lorem ipsum dolor sit amet, consectetuer
Ausgabe usgabe 12 28. NoVEMbEr November 2012 Basteln, Jetzt spielen, bei TeeGschwendner entdecken Kinder Herbstzeit willkommen ist Teezeit Seite Seite 3 2 Geschenkideen Trends für die für moderne Sie und
Content Mining. Semantic Text Mining. Semantic Text Mining Content Based Retrieval Visualisierung als Schlüssel. Technologie und Datenquellen MindNet
1 Content Mining 1. 2. 3. Semantic Text Mining Content Based Retrieval Visualisierung als Schlüssel Semantic Text Mining Technologie und Datenquellen MindNet Semantic text mining Umfeld http://gate.ac.uk
Dataforce Analytics Öko-Studie Beispielanalyse
Dataforce Analytics Öko-Studie 2016 Beispielanalyse Übersicht Zustimmung zu vorgelegten Aussagen Die zu bewertenden Aussagen lauten wie folgt: Der geringe CO 2 -Ausstoß des Fahrzeugs spielt bei der Auswahl
Trainingaktuell. Stressbewältigung wird zum Top Thema. Visualisierungstipps für Präsentationen und Trainings
G 25220 Trainingaktuell Die Zeitschrift für Trainer, Berater und Coachs 22. jahrgang Nr. 2/2011, 31. januar 2011 www.trainingaktuell.de TrAININGSINHALTe 2011 Stressbewältigung wird zum Top Thema FLIPCHArTS
Manual Logoanwendung Energiewende Hamburg
Manual Logoanwendung Energiewende Hamburg INHALT 1.1 LOGOIDEE 3 1.2 LOGOVARIANTEN 4 1.3 LOGOANWENDUNG & SCHUTZZONE 5 1.4 LOGOFARBEN 6 1.5 LOGOABBILDUNGSGRÖSSE 7 1.6 NEGATIVE LOGOANWENDUNGEN 8 1.7 LOGOPLATZIERUNG
FutureNet Angebot: FutureNet Die Kombination von 4 Online Bereichen. - Social Media - Multimedia - Onlinetools - Online Geld verdienen
FutureNet Angebot: FutureNet Die Kombination von 4 Online Bereichen FutureNet kombiniert die 4 Online Bereiche mit den besten Zukunftsaussichten: - Social Media - Multimedia - Onlinetools - Online Geld
Castor. Dokumentation
Castor Dokumentation 1 Inhalt Castor Wollen Sie ein Produkt-Highlight anzeigen, Direktverkäufe generieren? Oder planen Sie die Verteilung von Mustern. In all diesen Fällen sollten Sie sich für das Thema
EnergieSchweiz Corporate Design 12. Januar 2017
EnergieSchweiz Corporate Design 12. Januar 2017 INHALTSVERZEICHNIS BASISINFORMATIONEN....3 8 Logo «Verwendung»...4 Logo «Grösse»...5 Schriftarten...6 Farben...7 ICONS, ENERGICO, COLLAGE.... 8 12 GRAFISCHE
Handhaben von Problemen mit Kivitendo
Handhaben von Problemen mit Kivitendo Fehler Eingrenzen, Bugreports erstellen, Ruhe bewahren Wulf Coulmann selbstständiger Kaufmann Berlin 11.10.2012 Wulf () Handhaben von Problemen mit Kivitendo 11.10.2012
Zürichsee Caravan. Zürichsee Caravan. Corporate Design Manual 2010. Samir Hasani
Zürichsee Caravan Zürichsee Caravan Corporate Design Manual 2010 Samir Hasani Grundelemente 1.1 Naming 3 1.2 4 1.3 Farbe 6 1.4 Schriften 8 Anwendungsbereiche 2.1 Brief 9 2.2 Kuvert 10 2.3 Visitenkarten
unsere seminare in Zusammenarbeit mit Jens der Denker Mehrfacher Weltrekordhalter und Buchautor
unsere seminare in Zusammenarbeit mit Jens der Denker Mehrfacher Weltrekordhalter und Buchautor www.eranimes.de 1 inhalt Motivationsvortrag 3 sandra la cognata Inhaberin der Agentur»Eranimes - anders denken«sandra
Jetzt wird Ihre Werbung endlich gesehen!
Frühbucher-Rabatt: Für die Ausgabe vom 10. März 2016 gewähren wir Ihnen 20% Rabatt auf alle Inseratepreise. Gültig bei Inseratebuchung bis zum 20. Januar 2016 Garten & s u a H : a Them 10. März sgabe vom
Textvergleich-Gutachten
Textvergleich-Gutachten Der 60tools Textvergleich hat zwei Texte auf ihre Ähnlichkeit miteinander verglichen. Dabei wurde auftragsgemäß ermittelt, wie und worin sich die Texte unterscheiden. Für die ermittelten
Leitfaden Kommunikation. zur Durchführung von Projekten im Rahmen des INTERREG IV A-Programms Deutschland-Nederland 2007-2013
Leitfaden Kommunikation zur Durchführung von Projekten im Rahmen des INTERREG IV A-Programms Deutschland-Nederland 2007-2013 Version 2 - Gültig ab 01. Januar 2011 Sehr geehrter Lead Partner, Sie und Ihre
Frauen in Führung 2.0
mänz + rossmann organisationsentwicklung Frauen in Führung 2.0 Förderung von weiblichen Nachwuchsführungskräften Göttingen, den 6. Mai 2011 den gaben gestalt geben! mänz + rossmann organisationsentwicklung
KOSTENLOS. IHR PERSÖNLICHER Am schönsten Tag Ihres Lebens. sind wir für Sie da.
KOSTENLOS IHR PERSÖNLICHER Am schönsten Tag Ihres Lebens sind wir für Sie da. Inhalt INHALT PLATZ Z.B. FÜR EINSEITIGE ANZEIGE EINES SPONSOREN 10 Der Zeitplan 10 Der Budgetplan 10 Anmeldung beim Standesamt
A/B-Testing. Kaizen für ihre Website. Stand 04.14
A/B-Testing Kaizen für ihre Website A/B-Testing Kaizen für Ihre Website Kontinuierliche Verbesserungsprozesse haben sich seit den 90er Jahren in der Produktion etabliert und für enorme Produktivitätssteigerungen
Financial Controlling
Financial Controlling Im Januar 2012 Financial Controlling Financial Controlling JDC Drewes Consulting unterstützt Ihr Unternehmen durch Bereitstellung von Managementkapazität in den Bereichen Finanzen
Sylvia Achenbach SAMedienberatung. Jürgen Walleneit MSH AND MORE Werbeagentur GmbH
Auswahl und Realisierung sinnvoller online Werbemittel und Social Media am Beispiel Referenten: SAMedienberatung Eupener Str. 135-137, 50933 Köln 0221/4924-884, E-Mail, samedienberatung.de Jürgen Walleneit
1 Wort-Bild-Marke. Standardanwendung In der Standardanwendung steht das Logo in Gold auf einem schwarzem Hintergrund.
1 Wort-Bild-Marke Logo Um eine maximale Wiedererkennbarkeit und Wertigkeit zu garantieren, ist es wichtig, dem Deutschen Filmpreis ein signifikantes Logo zuzuordnen. Der Deutsche Filmpreis kommuniziert
Medical Monitor. Philips Healthcare. Ein Herz für die Stadt. Mieten, kaufen, warten. In eigener Sache 01/14. Echo
Medical Monitor Medical Monitor Medical Monitor Medical Monitor Heide Fest Medical Monitor Healthcare Report Der Wettlauf mit dem Tod Die wenigsten Herzen geraten im Beisein eines Arztes aus dem Takt.
www.cd4.at Plattform für Informationsaustausch über HIV/AIDS visitenkarte auf den nächsten seiten der flyer (Wickelfalz, A4 6-seitig)
www.cd4.at Plattform für Informationsaustausch über HIV/AIDS visitenkarte auf den nächsten seiten der flyer (Wickelfalz, A4 6-seitig) Ärzte Betroffene Information Vorbeugen Informieren Verbinden Auffangen
Das Corporate Design in LATEX
Presse und Kommunikation tubslatex Das Corporate Design in LATEX Anleitung und Dokumentation Enrico Jörns 20. Februar 2014 tubslatex-autoren: Enrico Jörns, Tobias Rad, Martin Bäker et al. Version: Projektseite:
Das Corporate Design in LATEX
Presse und Kommunikation tubslatex Das Corporate Design in LATEX Anleitung und Dokumentation Enrico Jörns 21. Juli 2014 tubslatex-autoren: Enrico Jörns, Tobias Rad, Martin Bäker et al. Version: Projektseite:
Deutsch. EVP-Fraktion Presse- und Kommunikationsdienst. Gestaltungsrichtlinie
Deutsch EVP-Fraktion Presse- und Kommunikationsdienst Gestaltungsrichtlinie Version : 01/10/2012 Wozu eine Gestaltungsrichtlinie? Im Mai 2011 beschloss die EVP-Fraktion, all ihre Veröffentlichungen zentral
Corporate Design FH Aachen University of Applied Sciences
Corporate Design FH Aachen University of Applied Sciences Corporate Design FH Aachen University of Applied Sciences Aus dem Zusammenschluss mehrerer Aachener Ingenieurfachschulen und berufsbezogener Ausbildungsstätten
Workshop Basis Layout Tanja Danzl. Medientag der Erzdiözese München Freising und des Sankt Michaelsbundes 17. Oktober 2015
Workshop Basis Layout Tanja Danzl Medientag der Erzdiözese München Freising und des Sankt Michaelsbundes 17. Oktober 2015 Werbemittel gestalten Printwerbemittel Visitenkarte Flyer Postkarte Infoblatt Broschüre
Apple App Store. ~ 9 Mio. Umsatz pro Tag ~ 10 Mio. Downloads pro Tag
Ich Apple App Store Apple App Store $ Apple App Store $ ~ 9 Mio. Umsatz pro Tag ~ 10 Mio. Downloads pro Tag Apple ios Apple ios Apple ios App Entwicklung Konzept Design Entwicklung Apple Approval Konzept
Thema aktuell 01 15 1 ONLINE AUSGABE. aktuell DAS KUNDENMAGAZIN JUNI 2015 13. JAHRGANG
Thema aktuell 01 15 1 ONLINE AUSGABE aktuell DAS KUNDENMAGAZIN JUNI 2015 13. JAHRGANG 2 aktuell 01 15 Thema Impressum Gemeinnütziger Spar- und Bauverein Friemersheim eg Kaiserstraße 53 47229 Duisburg Telefon
ADAPTIVE VS. RESPONSIVE WEBDESIGN
ADAPTIVE VS. RESPONSIVE WEBDESIGN WER BIN ICH? 10 SEKUNDEN Senior Projektmanager bei sitegeist Betriebswirt (VWA) Onliner seit 2001 TECHNOLOGIE & MOBILITÄT [...] UND DIE REALITÄT? [...] KUNDE X MAI 2012
Unsere Heimat stellt sich vor: Bollendorf. Willkommen im Luftkurort Bollendorf im romantischen Sauertal!
Unsere Heimat stellt sich vor: Bollendorf Willkommen im Luftkurort Bollendorf im romantischen Sauertal! Lorem ipsum dolor sique Aenean commodo Grußwort ligula eget Cum sociis natoque penatibus et magnis
Corporate Design * Titel. Corporate Design Manual. Informationen zum visuellen Erschienungsbild von i ceramisti nach dem Redesign.
Corporate Design * Titel Corporate Design Manual Informationen zum visuellen Erschienungsbild von i ceramisti nach dem Redesign Stand Januar 2012 CD i ceramisti 1 Corporate Design * Inhaltsverzeichnis