Grundprinzipien der Gestaltung von Benutzeroberflächen (GUIs)

Während das Wissen eines Designers für Programmoberflächen meist alle Interna des Programms umfasst, kennt der Benutzer oft nur die Oberfläche. Um eine benutzergeeignete Oberfläche und Bedienung – also eine hohe Usability – zu erreichen, können viele Regeln angewandt werden. Nach Jeff Johnson [1] gibt es hierfür neun einfache Regeln, die es zu beachten gilt:

Photoshop-Tutorial: Arbeiten mit Eis und Schnee

Wer schon einmal mit dem Finger Strichzeichnungen auf zugeschneiten Fensterscheiben gemalt hat, der weiß, dass das zwar sehr nett aussehen kann, aber auch schrecklich kalt ist. Außerdem liegt nicht jeden Tag die perfekte Menge Schnee bei perfekter Beleuchtung auf einem Auto herum. :-)

Die Lösung liefert natürlich Photoshop. Hier kann mit zwei (frei erhältlichen) Texturen und relativ geringem Arbeitsaufwand etwas sehr Schönes gemalt werden.

Dieses Tutorial ist eine Ergänzung des fantastischen Tutorials von Iceflow Studios. Das Ergebnis sieht wie folgt aus:

Ergebnis des Tutorials "Schnee und Eis"

Metro-Design mit Photoshop - Tutorial

Wer heute noch denkt, dass "Metro" ein Untergrundtransportmittel in Paris ist, hat definitiv nicht mitbekommen, dass Windows 8 in den Startlöchern steht und dabei eine brandneue Benutzeroberfläche anbietet. In diesem Artikel werden die Merkmale von Metro beschrieben und in einem Photoshop-Tutorial die Erstellung des Designs nachvollzogen.

Anders bei "Aero" von Windows 7 wird diesmal nicht bloß ein wenig mit Effekten wie Transparenz und Spiegelung gespielt. Das Ziel des neuen Designs ist ein totalitär veränderte Wahrnehmung der Oberfläche. Da die Anzahl der Tablet-PCs und Geräte mit Touch-Bedienung rapide zunimmt, wurde diese Bedienphilosophie von Anfang an durchweg in der Konzeption berücksichtigt.

Hier ein erster Blick auf die Benutzeroberfläche "Metro" von Microsofts Windows 8:

Die neue Benutzeroberfläche "Metro" von Windows 8 (Beta).

Produkte im Apple-Style darstellen mit Photoshop

   
Wer einmal einen Blick auf den Apple Store geworfen hat, der stellt fest, dass alle Produkte so aussehen, als ob sie auf einer glatt polierten Glasplatte stehen würden, in der sie sich spiegeln.
In diesem Tutorial wird in sieben einfachen Schritten beschrieben, wie man mit Hilfe von Photoshop diesen Effekt ganz einfach selber hinbekommt.

Frisches Design für grüne IT

"GreenIT" ist neben Cloud Computing die Modeerscheinung schlechthin bei IT-Dienstleistern. Damit die grüne Firmenphilosophie auch als klares Statement den Kunden gezeigt wird, muss auch die Firmenwebseite angepasst werden.
Einige verzieren daher ihre Webseiten mit vereinzelten grünen Blättern oder fügen einen hervor stechenden, grün gefärbten Link zu den umweltfreundlichen Service-Leistungen ein. Andere stellen gleich die ganze Webseite auf den grünen Weg um.

So habe ich auch im Auftrag der Firma Comp4U EDV-Anlagen GmbH in Langen die Firmenwebseite von einem schwarz/weiß/grauen Design auf ein grün/weißes Design umgehoben. Als Orientierung dienten andere professionelle grüne Webseiten wie der Apple-Store http://www.gravis.de und http://www.actebis.com.

Das grüne Design von Comp4U.

Bildverarbeitung, Wolken und ein Picnik im Grünen

Viele Menschen benutzen Photoshop nur, um einfache Arbeiten, wie bspw. Farbkorrekturen oder kleine Retuschearbeiten an ihren Lieblingsfotos vorzunehmen. Photoshop ist zwar der König unter den Grafikprogrammen, aber es kostet auch königlich viel Geld.
Wer einfach, kostenlos und mit guter Qualität Bildverarbeitung betreiben will, kann auch zu der Online-Lösung "Picnik" greifen. Dabei handelt es sich um eine der ersten Applikationen aus einer Wolke (engl.: cloud), die bequem aus dem Netz heraus gestartet werden kann.

Gesellschaft für Industriemontage in neuem Gewand

Im Auftrag der Firma Comp4U habe ich für GFI - die Gesellschaft für Industriemontage - ein Redesign der Firmenwebseite vorgenommen.
Da sowohl Farbgebung als auch Layout direkt von einem etwas betagtem Printlayout stammten, wurde im Rahmen eines Redesigns komplett neu angefangen. Da es eine Reihe von Symbolen gibt, die bereits auf vielen Visitenkarten und Briefbögen abgebildet sind, mussten diese in die Designüberlegungen mit einbezogen werden.
Insgesamt macht die Webseite einen dezenten und professionellen Eindruck. Übersichtsseiten im Blog-Stil ermöglichen einen schnellen Themenüberblick und verleiten zum Weiterlesen.
Das ehemals sehr dicht gedrängte Print-Layout wurde durch ein lockeres Erscheinungsbild ersetzt. Abgerundet durch neue Features wie ein Kontaktformular, Exportfunktionen und ein professionelles Impressum wird dem Benutzer so eine freundliche und klare Webseite geboten.