Ratatatam

Responsive Websites bauen: Entwürfe sind nicht mehr meine Babys – ich hinterfrage im Sauseschritt

29.08.14

Die folgenden Webdesigns für meine Kunden Drübbelken und Luzia Hofmann setzen mal wieder auf WordPress. Gerade für kleinere Websites mit einem knappen Budget ist WordPress die erste Wahl. Vor allem auch, weil der Kunde sich schnell ins System einarbeiten kann. Wer ein bisschen Erfahrung mit der Pflege von Websites mitbringt, kommt sogar mit einer Schulung am Telefon aus.

kunde-drueb-desk00

Da mein Workflow von der Entwurfsphase bis zum CSS-Coding mittlerweile vollends auf responsives Webdesign ausgelegt ist, biete ich die Optimierung für Smartphones und Tablets für einen relativ geringen Aufpreis an – falls die Komplexität des Layouts und die Tiefe der Navigation sich in Grenzen halten. Auch wenn ich bereits einige Male den Aufwand unterschätzt habe, es widerstrebt mir schlicht, statische Websites zu bauen.

kunde-drueb-mobil00

Responsives Webdesign ist für mich ein Überbegriff für Design und Coding, welches für den mobilen Zusammenhang erstellt wird und sich nahtlos an Smartphones und Tablets anpasst, ohne an Qualität zu verlieren. Ich unterscheide nicht zwischen adaptivem und responsivem Webdesign. Das hat einen praktischen Grund: Es erleichtert mir die Kommunikation mit dem Kunden. Ihn interessieren diese Differenzierungen meistens nicht.

kunde-hexeratung-desk00

In den letzten Jahren achte ich stärker auf die Vorstellungen des Kunden. Ich nehme mir mehr Zeit für die Kommunikation im Vorfeld der Realisierung. Es geht nicht um meinen Geschmack, sondern um meine Erfahrung als Designer. Es geht um einen agilen Prozess, auch wenn das Projekt noch so klein ist. Diese Haltung hilft mir, sehr flexibel zu arbeiten und immer wieder die Kommunikation zu suchen. Es war nicht zuletzt die intensive Auseinanderersetzung mit dem UX-Design, die mein Selbstverständnis als Konzepter und Webdesigner verändert hat.

kunde-hexeratung-mobil00

Ein Bewusstsein für die Bedürfnisse und Ideen des Kunden zu entwickeln, geht einher mit der kontinuierlich gestellten Frage, ob die Zielgruppe auch abgeholt und sich wohlfühlen wird mit der neuen Website. Auch hier geht es nicht um meinen Geschmack und um das Festhalten an Entwürfen, die mir auf Anhieb gelungen erscheinen. Entwürfe sind nicht mehr meine „Babys“, sie sind eine Möglichkeit unter vielen.

Ich hinterfrage viel schneller, entsprechend schnell kann ich Ideen und Arbeiten auch wieder verwerfen und Lösungen finden, die alle glücklich machen. Das Schöne daran ist, es lohnt sich auch für alle. ;-)

Autor: Ralph Segert   Tags: , , , ,      

Behutsames Redesign für die mobile Zeit

15.08.14

Für die Rechtsanwältin Maria Schachten habe ich vor gut zehn Jahren eine einfache Website gestaltet. Sie enthielt ein Headerfoto von der Kundin und meine Portraitaufnahmen und tat ihren Dienst. Nun stand ein Redesign an. Da die Kundin mit dem alten Layout im Großen und Ganzen zufrieden geblieben war, sollten keine großen Änderungen vorgenommen werden und auf jeden Fall das Kopfbild gerettet werden. Leider stand es nur sehr klein zur Verfügung. Zum Glück gab es einen Weg, dieses akzeptabel zu vergrößern. Das Ergebnis:

redesign-raschachten01

Im Vergleich dazu das Layout aus dem Jahre 2003. Das Coding hatte mit tabellenfreiem Markup und einem sparsamen CSS die Jahre richtig gut überstanden. Bei der Arbeit fiel mir auf, dass ich gestalterisch in den letzten Jahren dazu gelernt habe. Ich habe eine sicherere Nase, was die Abstände und Proportionen betrifft. Insgesamt ist der Lernprozess noch beschleunigt worden durch die responsive Webzeit.

redesign-raschachten02

Responsivität für große und kleine Screens, mit angepasstem Headerbild für mobile Geräte:

redesign-raschachten03

Autor: Ralph Segert   Tags: , ,      

Entwurf und Umsetzung einer visuellen Identität

29.05.14

Im Herbst 2013 kam eine Freundin, die ich aus den Augen verloren hatte, auf mich zu. Sie stand vor einer Firmengründung mit zwei Partnern und suchte einen Print- und Webdesigner. Sie hatte sich unter anderem an eine Visitenkarte erinnert, die ich ihr 1999 erstellt hatte und suchte meine Kontaktdaten im Netz.

kunde-defakto-mobil01

Daraus ist eine spannende Zusammenarbeit geworden, die mir die Möglichkeit gab, eine visuelle Identität für ein Startup zu entwickeln, das sich in 2014 erfolgreich als Bildungsträger etabliert. Bevor es aber losgehen konnte, gab es für alle von uns viel zu tun. Ich bekam als Vorgabe für meine Arbeit den Firmenamen „defakto“ und den Slogan „…nach allen Regeln der Kunst“. Daraus habe ich im zweiten Anlauf ein Typo-Signet entwickelt, das sowohl die Sachlichkeit des Namens wie auch eine Anspielung auf den Claim enthält.

kunde-defakto-print01

Nachdem auch mein Farbvorschlag nach intensiven Diskussionen angenommen war – es gab immerhin drei Entscheider zu überzeugen -, stand die Vollendung der Geschäftsausstattung mit Visitenkarte, Briefbogen und Konzeptpapier an. Gar nicht so einfach war dabei, den doch recht langen Claim würdig unterzubringen.

Als nächstes begann meine Arbeit als Webdesigner. Es gab den Wunsch nach animierten Kacheln für eine Webpräsenz, die als imagebildende Website aufgebaut werden sollte. Ihre Hauptaufgabe ist, Aufmerksamkeit zu erregen und in aller Kürze über das Selbstverständnis und die Konzepte der Firma zu informieren. Das Ergebnis ist eine Website mit CSS-3D-Effekt und hohem Wiedererkennungseffekt. Sie funktioniert in der mobilen Variante ab einem festgelegten Breakpoint ganz ohne Animation, was Ressourcen schont.

kunde-defakto-desktop01

kunde-defakto-desktop02

kunde-defakto-mobil02

Responsive Dokumentations-Site

Der Kunde defakto GmbH brauchte danach für seine in kurzer Zeit akquirierten Bildungsprojekte eine Dokumentations-Site mit eigenständigem Layout und Ideen für die Informationsarchitektur. Also klärte ich mit dem Kunden die inhaltliche Struktur, was nicht so einfach war, da noch kaum Inhalte vorhanden waren. Aber wir hatten klug vorausgedacht. Danach entwarf und codete ich ein neues Layout und integrierte es in das bereits von mir eingerichtete CMS. So entstand defakto DOKU.

kunde-defakto-doku

Das eingesetzte CMS ist Expressionengine. Es organisiert zugleich die Inhalte der Imagesite. Für beide Sites reichte eine Installation. So ist der Kunde mit geringer Lernkurve in der Lage, sowohl die imagebildende Website als auch die inhaltsstarke Doku-Site zu pflegen. Nicht unbedingt eine Selbstverständlichkeit.

Zudem enthält defakto DOKU eine leicht zu aktivierende responsive Diashow mit Fotos aus den Projekten, die nur bei Bedarf im Inhaltsbereich erscheint. Sie braucht somit keinen Platzhalter, wenn es keine Fotos gibt. Das Script heißt übrigens LayerSlider und ich empfehle es guten Gewissens. :-)

kunde-defakto-mobil01

Autor: Ralph Segert   Tags: , , ,      


Ansichten:  ragini · Frank · aurora · Ping

Android Anleitung App Design Blogosphäre Bochum Buch CMS CMS Made Simple DJR Electropop ExpressionEngine Film Fotografie Fotolust Freiberufler Fussball GooglePlus Grafikdesign Icondesign Ingwer iPod Touch IT-Sicherheit Layout Leben Medien Musik Netz Politik Produkt Redesign responsive Webdesign Rezepte Ruhrgebiet Software Sprache Technik Teufel UX UX-Design Verpackungsdesign Videoanleitung Webdesign Webradio Wissen Wordpress

© 2017 Ralph Segert . Impressum