Upload
glembotzky
View
1.622
Download
0
Embed Size (px)
DESCRIPTION
Citation preview
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Designer vs. DeveloperUXCamp Berlin 2009
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
32 Jahrefree-sms.de Gründer
Ex-Head of IT goolive
PHP/ColdfusionMySQL
JavaScript/jQuery
ProjektmanagerBusiness Development
Marketing & Akquise
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Logik meets Kreativität
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Logik meets Kreativität
Developer Designer
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Was ist das Wichtige an einem Design?
● Design ist nicht nur die Form.● Design ist nicht nur die Funktion.● Design ist eine Symbiose aus Form und Funktion.
Design muss gut aussehen und funktionieren.
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Was ist das Wichtige an UI-Design?
● UI-Design ist nicht nur das „Sichtbare“.● UI-Design ist nicht nur die Code (IA).● UI-Design ist nicht nur das Interaction-Design.● UI-Design ist die Symbiose aus Sichtbarem, Code
und InteraktionsmöglichkeitenUI-Design muss gut aussehen und funktionieren.
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Was ist das Wichtige an UI-Design?
● UI-Design ist nicht nur das „Sichtbare“.● UI-Design ist nicht nur die Code (IA).● UI-Design ist nicht nur das Interaction-Design.● UI-Design ist die Symbiose aus Sichtbarem, Code
und InteraktionsmöglichkeitenUI-Design muss gut aussehen und funktionieren.Und NICHT nur im Photoshop, sondern beim USER.
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
5 Dinge, die Designer zwangsläufigberücksichtigen „müssen“...
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
5 Dinge, die Designer zwangsläufig berücksichtigen „müssen“...
1. Eine Website ist dynamisch.2.Kritischer Faktor: Technik.3.Raster und Module sind der Schlüssel.4.Miteinander reden5.YES, WE CAN!
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Eine Website ist dynamisch
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Eine Website ist dynamisch
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Eine Website ist dynamisch
● Design muss skalierbar sein.● Überlängen einplanen.● Design muss der Funktionalität angepasst
werden.
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Eine Website ist dynamisch
Bildschirmauflösung beachtenScrollbars vermeiden
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Eine Website ist dynamisch
Je nach Länge des Contents variiert die Höhe einer Seite.User haben damit kein Problem.
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Eine Website ist dynamisch
Je nach Länge des Contents variiert die Höhe einer Seite.User haben damit kein Problem.Designer schon ;-)
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Kritischer Faktor:Die Technik
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Kritischer Faktor: Die Technik
● 14 IE6 Layout Bugs
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Kritischer Faktor: Die Technik
● 14 IE6 Layout Bugs● 63 Techniken für abgerundete Ecken
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Kritischer Faktor: Die Technik
● 14 IE6 Layout Bugs● 63 Techniken für abgerundete Ecken● 9 Möglichkeiten, Spalten zu designen
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Kritischer Faktor: Die Technik
● 14 IE6 Layout Bugs● 63 Techniken für abgerundete Ecken● 9 Möglichkeiten, Spalten zu designen● 3 Browser Engines
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Kritischer Faktor: Die Technik
● 14 IE6 Layout Bugs● 63 Techniken für abgerundete Ecken● 9 Möglichkeiten, Spalten zu designen● 3 Browser Engines● 8 wichtige Browser
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Kritischer Faktor: Die Technik
● 14 IE6 Layout Bugs● 63 Techniken für abgerundete Ecken● 9 Möglichkeiten, Spalten zu designen● 3 Browser Engines● 8 wichtige Browser● 34 Möglichkeiten, Performance zu optimieren
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Kritischer Faktor: Die Technik
● 14 IE6 Layout Bugs● 63 Techniken für abgerundete Ecken● 9 Möglichkeiten, Spalten zu designen● 3 Browser Engines● 8 wichtige Browser● 34 Möglichkeiten, Performance zu optimieren● 6+ Wege vertikal auszurichen
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Kritischer Faktor: Die Technik
● 14 IE6 Layout Bugs● 63 Techniken für abgerundete Ecken● 9 Möglichkeiten, Spalten zu designen● 3 Browser Engines● 8 wichtige Browser● 34 Möglichkeiten, Performance zu optimieren● 6+ Wege vertikal auszurichen● 5 Layout-Stile
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Kritischer Faktor: Die Technik
● 14 IE6 Layout Bugs● 63 Techniken für abgerundete Ecken● 9 Möglichkeiten, Spalten zu designen● 3 Browser Engines● 8 wichtige Browser● 34 Möglichkeiten, Performance zu optimieren● 6+ Wege vertikal auszurichen● 5 Layout-Stile● 8 Arten zu fokussieren
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Kritischer Faktor: Die Technik
9 Faktoren
4 Dimensionen
3 Plattformen
4 Browser p.P.
2 Rendering Modes
= 672 Möglichkeiten
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Schlüsselerlebnis:Raster & Module
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Raster & Module sind der Schlüssel
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Raster & Module sind der Schlüssel
Mein Favorit: 960 GridSystemhttp://960.gs
Yahoo!UIhttp://developer.yahoo.com/yui/grids/
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Raster & Module sind der Schlüssel
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Raster und Module sind der Schlüssel
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Miteinander reden
„Nur sprechenden Menschenkann geholfen werden“
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)
Miteinander reden
● Entwickler müssen „verstehen“, warum etwas geändert werden soll, weil sie keine unnötigen Änderungen mögen.● Roundtables: Designer und Entwickler diskutieren über geplante Änderungen.● Begriffe definieren, um Missverständnisse zu vermeiden.● Kommunikationsprobleme offen ansprechen.
René Chr. GlembotzkyTwitter „glembotzky“Kontakt: Xing, Facebook, Poken :-)