Kategorien
Inspiration Interviews

Fünf Fragen an Jakob Nielsen, Usability-Guru

Ob Guru oder Reibungsfläche, bei Jakob Nielsen hereinzuschauen, das lohnt sich fast immer. Immerhin gilt der 1957 in Kopenhagen geborene Berater als der Usability-Guru schlechthin. Dr. Web Autor Frank Puscher sprach mit ihm.

Frank Puscher: Herr Nielsen, wenn Sie die letzten fünf Jahre zurückblicken, sind eCommerce-WebSites heute benutzbarer als im Jahr 2000?

AbbildungJakob Nielsen: Ja, sie werden auf jeden Fall besser. Die Benutzbarkeit steigt um durchschnittlich etwa vier Prozent pro Jahr an, wenn man die Sites über die Jahre betrachtet. Natürlich gibt es immer wieder ein paar Sites, die bei Redesigns neue Dummheiten einführen, aber im Durchschnitt wird es besser.

Frank Puscher: Welches sind die drei häufigsten Fehler, die Ihnen in Ihren Tests begegnen?

Jakob Nielsen: Die beiden größten Fehler bilden die Kehrseiten die gleichen Medaille. Entweder die Sites haben zu viel oder zu wenig Informationen über Ihre Produkte. Eine ganze Reihe von Shopping-Sites halten so wenig Informationen vor, dass man gar nicht wirklich erfährt, was man bekommt, wenn man bestellt, deshalb bestellen die User nicht. Auf der anderen Seite gibt es WebSites, die so viel komplexe Informationen offerieren, dass Durchschnittsmenschen einfach nicht mehr verstehen, wovon die reden. Es ist sehr wichtig vereinfachte Informationen anzubieten, die in einer alltäglichen Sprache formuliert werden. Ausgestattet mit Hyperlinks können solche Seiten dann Zugang zu zusätzlichen Seiten mit tiefer gehenden Informationen anbieten.

Ein dritter gravierender Fehler ist es, die Benutzer nach zu vielen Informationen zu fragen oder diese Informationen innerhalb des Bestellprozesses zu früh abzufragen, an einer Stelle, an der sich die User noch nicht mit dem Gedanken angefreundet haben, diese Informationen preiszugeben.

Frank Puscher: Gibt es einen Konflikt zwischen Usability und Markenbildung? Viele WebDesigner argumentieren, dass das Usability-Paradigma die Kreativität abtötet und keinen Spielraum lässt für den emotionalen Aspekt bei Web-Auftritten.

Jakob Nielsen: Wer so etwas sagt hat keine Ahnung von der Markenbildung in interaktiven Umgebungen. Dort ist die Marke Ausdruck der Erfahrungen, die ein User macht. Wenn also diese Erfahrung bei der Benutzung einer WebSite umständlich und langsam ist, fühlen die Anwender, dass das Unternehmen sich arrogant verhält oder schlecht auf sie eingeht. Im Gegensatz dazu erzeugt eine Site, die leicht, flüssig und schnell zu benutzen ist, beim Anwender das Gefühl, dass sich die Firma um sie kümmert.

Irgendwie ist das Argument eigentlich irrelevant, denn wenn die Benutzer eine schlechte Usability auf einer WebSite vorfinden, werden sie sie verlassen und gar keine Markenerfahrung machen, abgesehen vom ersten Gefühl der Irritation. Du musst eben ein bestimmtes Niveau an Usability auf Deiner Seite anbieten, sonst existiert die Seite im Auge des Betrachters gar nicht.

Frank Puscher: Sie betrachten das Web immer dezidiert als interaktives Medium. Gibt es keinen Platz für lineare Formate wie Videos und Animationen, die dann gleichzeitig der Information und Benutzbarkeit dienen?

Jakob Nielsen: Doch, doch ist von extrem hoher Bedeutung, dass die linearen Komponenten innerhalb der Anwendung kurz gehalten werden, üblicherweise unter einer Minute. Andernfalls verspüren die Benutzer einen Kontrollverlust. Längere Clips sind natürlich möglich, aber sie sollten die Ausnahme bleiben. Was für die Benutzer so spannend am Internet ist, ist die Möglichkeit, sich zu bewegen und sich das zu nehmen, was sie wollen. Genau das. Das Web darf kein Fernsehen werden, auch wenn wir das technologisch inzwischen leisten könnten.

Frank Puscher: Wie steht’s mit Flash. Wird Flash-Technik mehrheitlich gut oder schlecht eingesetzt?

Jakob Nielsen: Flash kann gut eingesetzt werden. Ich habe einige tolle Konfigurationswerkzeuge und sogar Warenkörbe mit vollständigem Checkout in Flash-Technik gesehen, die leichter und flüssiger zu bedienen waren, als der klassische Seiten-basierte Ansatz. Leider wird Flash eher selten auf diese sinnvolle Weise eingesetzt. Meistens wird Flash für zwecke eingesetzt, die Usability-Kriterien verletzen. Das geschieht etwa bei der Herstellung komplexerer Interfaces, die keinen Standards mehr entsprechen. Die Wahl eines solchen Interfaces ist selten eine gute Idee, es sei denn man will ein Video-Spiel machen.

Frank Puscher: Herr Nielsen, vielen Dank für dieses Gespräch. Website: http://www.useit.com

Dr. Web über Jakob Nielsen: Unsere Auswahl listet Beiträge, die wir im Laufe der Zeit über Jakob Nielsen und seine Arbeit veröffentlicht haben.

Erstveröffentlichung 23.03.2005

Kategorien
Inspiration Tutorials

Screenreader im Einsatz

In einer Serie schildert Eva Papst ihre ganz persönlichen Erfahrungen und gibt Tipps und Tricks zum Umgang mit dem Medium Internet, das sie sich nicht, wie die meisten Menschen über den Bildschirm, sondern mit einem Screenreader erschließt, denn Eva Papst ist blind. Das hält sie weder davon ab, im Web zu surfen, noch anderen Menschen Gutes zu tun, indem Sie eine Anleitung zum "einfachen Surfen" anbietet. Ihr selbst zeigt sich das Internet neben der Wiedergabe des Bildschirminhalts durch synthetische Sprache zusätzlich durch eine 40 Zeichen umfassenden Braillezeile. Aus der Anleitung wird offensichtlich, welche Probleme schon so einfach gestrickte Seiten wie Google machen können. Auch für "Nicht-Blinde" eine Lektion.

Screenshot

Kategorien
Bilder & Vektorgrafiken bearbeiten Design Inspiration Photoshop Tutorials

Schärfen ohne Filter

von Dirk Olten

Nur scharfe und brillante Fotos gehören ins Netz. Für gewöhnlich verwendet man in Photoshop (oder anderen Pixel-Prozessoren) so genannte Scharfzeichnungsfilter. Deren Algorithmen verstärken Kantenkontraste und oft bringen sie kaum vorteilhafte Ergebnisse.

Hier möchte ich einen Quick-n-Dirty-Trick präsentieren, mit dem sich viele unscharfe Aufnahmen nachbessern lassen und mit dem sich sogar an sich gelungene Fotos noch prächtiger und schärfer auf den Bildschirm zaubern lassen.

Öffnen Sie ihr Foto in Photoshop.

Screenshot
Ein Beispielfoto, mit dem Handy aufgenommen

Fertigen Sie ein Duplikat der Ebene an und wenden auf dieser Ebene den Hochpass-Filter an (Filter -> Sonstige -> Hochpass). Regeln Sie den Radius, bis Sie kaum noch Farben sehen.

Screenshot
Stellen Sie die Füllmethode der kopierten Ebene auf „Ineinanderkopieren“. Die Methode „Hartes Licht“ bringt ein etwas helleres Ergebnis. Durch Regeln der Transparenzeigenschaft der modifizierten Ebene kann der Effekt abgemildert werden.

Screenshot

Fertig.

Screenshot

Mit diesem Kunstgriff werden nicht nur die Kanten betont, sondern wird auch der Farbkontrast korrigiert. Das Ergebnis sind brilliantere Bilder.

Kategorien
Bilder & Vektorgrafiken bearbeiten Design Inspiration Photoshop Tutorials

Mogelpackungen

Es gibt Produkte, die kann man weder anfassen noch verpacken. Dazu gehören Dienstleistungen und Software. Doch wie kann so ein Produkt präsentiert werden, so dass auch etwas fürs Auge geboten wird? Findige Gestalter orientieren sich an Software-Paketen, so genannten Box-Shots.

Das Ziel
Die farbige „Landkarte“ des Internets, dass Ergebnis einer Berechnung durch eine komplexe Software, soll ansprechend für den Verkauf präsentiert werden. Eine einfache Verpackung, wie etwa eine Schachtel oder eine Dose, kann schnell und unkompliziert in jedem Grafikprogramm erstellt werden.

Screenshot
Das fertige Produkt und seine virtuelle Verpackung

Die Vorderseite
Eine Box in der 3D-Ansicht muss mindestens zwei Seiten zeigen, um überzeugen zu können. Da macht es Sinn, die Schachtel leicht schräg zu stellen, so dass später die Front mit dem „Cover“ und die Seite zu sehen sind. Die Fläche, die später den Inhalt zeigen soll, wurde für diesen Effekt perspektivisch verzerrt.

Screenshot
Das spätere „Cover“

Der Rücken
Für den Rücken wird eine Fläche benötigt, die sich an der Höhe der Vorderseite anpasst. Der 3D-Effekt wird durch die dunklere Farbe des Seitenteils unterstützt, außerdem hebt sich der Rücken so besser von der Front ab.

Screenshot
Der Rücken

Den Rücken anpassen
Da die Vorderseite der Box schräg gestellt wird, muss auch die Seite der Perspektive folgen und entsprechend angepasst werden. Wurde bei der Vorderseite der rechte Rand zusammen geschoben, muss beim Seitenteil der linke Rand gestaucht werden, um perspektivisch korrekt zu wirken.

Screenshot
Seite angepasst

Das Seitenlabel
Das Seitenlabel ist eine Kopie der Seitenfläche, die verkleinert und aufgehellt wurde. Bekommt diese Fläche einen 3D-Effekt, durch das passende Licht- und Schattenspiel und durch abgerundete Flächen, kann der Anschein einer Schatulle geweckt werden, die in der Verpackung geschoben wurde.

Screenshot
Rücken „beklebt“

Schatten
Eine jede 3D-Darstellung lebt vom Schattenfall des Objekts. Da unsere virtuelle Verpackung schräg im Raum steht, sollte sie ebenfalls einen Schatten werfen. Die natürliche Form ist aus dem Leben bekannt, deshalb sieht man auch gleich ob es passt oder nicht. Aus welcher Richtung kommt das Licht? Wo entstehen dann Schattenbereiche? Diese Fragen kann man leicht beantworten und dementsprechend abgedunkelte Bereiche erstellen.

Screenshot
Mit Schatteneffekt

Die Marke
Zuletzt bekommt die Verpackung ihr Label. Schrift und Form müssen der Perspektive der Box folgen, um realistisch zu wirken. Hier wurde das Abbild des Internets integriert, ein ruhiger Untergrund für den Schriftzug geschaffen und eine Phantasie-Marke sowie ein erfundenes Logo erstellt.

Screenshot
Mit Cover

Hier noch ein „echtes“ Beispiel aus dem Netz. Das angebotene PHP-Script ist nichts anderes als ein simpler Download. Der Box-Shot weckt mehr Interesse als ein bloßer Link.

Screenshot
CMS in der Schachtel

Dienstleistungen oder Scripts könnten auch in Dosen oder Flaschen verpackt werden, dies sollte dann allerdings zum jeweiligen Produkt einen Bezug haben.

Kategorien
Inspiration Tutorials

Firefox Erweiterungen selber machen

Erst die Extensions machen Firefox zum multifunktionellen und individuellen Browser für (fast) jeden Geschmack. Hunderte davon gib es inzwischen. Aber wie macht man das eigentlich? Eigene Extensions sind kein Problem. Ein bebildertes "How-to" findet hilft angehenden Erweiterern auf die Sprünge.

Und wo wir schon dabei sind… Manche Extensions lassen Ernst vermissen und widmen sich ganz dem Vergnügen. Firesomething ist so ein Exemplar. Der Browser erhält mit jedem Aufruf einen neuen Namen. Ein ironischer Seitenhieb auf die vielen Namensänderungen der Vergangenheit. Letzteres Via Prägnanz

Kategorien
Bilder & Vektorgrafiken bearbeiten Design Inspiration Photoshop Tutorials

Photoshop: Grunge Buttons

Grunge, also Schmutz oder Abfall, darf auch das Menüdesign beeinflussen, Hauptsache es geht dreckig zu. Sorgen Sie dafür, dass keine Fläche glatt und poliert wirkt.

Schritt 1
Den Hintergrund füllt ein Streifenmuster aus zwei dunkelgrauen Linien. Zeichnen Sie auf einer neuen Ebene mit dem Buntstift, der kleinsten Werkzeugspitze und einem dunklen Grau eine 1 Pixel breite Linie, indem Sie beim ziehen die SHIFT-Taste gedrückt halten. Darunter zeichnen Sie eine Linie in einem etwas helleren Grauton. Kopieren und positionieren Sie die Ebene, so dass der Hintergrund gefüllt ist. Soll dieser Hintergrund die Website füllen, bietet es sich an aus den zwei Linien eine Hintergrundkachel zu erstellen.

Screenshot
Hintergrund erstellen

Schritt 2
Im Grunge-Stil darf nichts sauber, gerade und poliert erscheinen, deshalb darf schon die Grundlage der Button etwas schräger daher kommen als üblich. Erstellen Sie eine neue Ebene, wählen Sie mit dem Polygon-Lasso die Grundform aus und füllen Sie die Fläche mit einem dunklen Beigeton.

Die Grundlage im Beispiel zeigt feine Risse. Dazu wurde mit dem Linienzeichner und einem dunklen Grauton eine Menge Linien gezogen, die zusammen ein feines Rissmuster ergeben. Die Linien wurden auf eine Ebene reduziert und durch "Ebene –> Schnittmaske erstellen" mit der darunter liegenden Ebene verbunden.

Screenshot
Grundlage der Buttons

Schritt 3
Den Hintergrund der einzelnen Buttons erstellen Sie auf einer eigenen Ebene mit dem Auswahlrechteck, füllen anschließend die Auswahl mit einem Grau und spendieren der Fläche Störungen durch "Filter –> Störungsfilter –> Störungen hinzufügen". Kopieren Sie den Buttonhintergrund mehrmals und drehen Sie die Flächen durch "Bearbeiten –> Transformieren –> Drehen".

Screenshot
Hintergrund der einzelnen Buttons

Schritt 4
Erstellen Sie eine neue Ebene und sprühen Sie mit dem Airbrush und einem Grauton etwas Schmutz auf die soeben erstellten Flächen, den Sie mit dem Gaußschen Weichzeichner etwas weichzeichnen. Den Hintergrund für die Schrift wählen Sie mit dem Auswahlrechteck aus, erstellen eine neue Ebene und füllen die Fläche mit #849433. Erstellen Sie auf einer neuen Ebene eine "Zierleiste" in einem hellen Grauton mit dem Auswahlrechteck.

Screenshot
Erster Schmutz und grüne Flächen

Schritt 5
Der leichteste Schritt dieser Anleitung lautet: Beschriften Sie Ihren Button mit dem Textwerkzeug. Aktivieren Sie bei der Zierleiste den Ebenenstil Schlagschatten und fügen Sie Störungen hinzu.

Screenshot
Buttons beschriften

Schritt 6
Noch ist das Menü zu sauber. Sprühen Sie deshalb auf eigenen Ebenen Schmutz in verschiedenen Farben und mit verschiedenen Werkzeugspitzen über das Menü. Diesen "Schmutz" können Sie später noch weichzeichnen.

Screenshot
Mehr Schmutz

Schritt 7
Sorgen Sie für etwas Licht im dunklen Grunge-Style. Auf einer eigenen Ebene wählen Sie mit dem Polygon-Lasso den Lichteinfall aus. Die Auswahl füllen Sie mit einem Verlauf von Weiß zu Transparent. Stellen Sie den Ebenenmodus dieser Ebene von Normal auf überlagern um.

Screenshot
Mit "Licht"

Kleine Schrauben oder andere Accessoires lockern das Menü auf.

Kategorien
Bilder & Vektorgrafiken bearbeiten Design Inspiration Photoshop Tutorials

Photoshop: Business Menü

Für Themen wie „Geld“ oder „Versicherung“ braucht man ein ernsthaftes Design, das Sicherheit und Vertrauen vermittelt. Hier ein Entwurf für ein Menü, in dem die Farben Blau und Grau nicht zufällig eine Rolle spielen.

Schritt 1
Der Hintergrund wurde mit einem satten Blau gefüllt (#005599) und mit etwas „Licht“ durch den Airbrush, einer weichen Werkzeugspitze und weißer Farbe abgereichert.

Screenshot
Hintergrund

Schritt 2
Mit dem Abgerundeten-Rechteck-Werkzeug wurde in Grau die Basis der Stellen erstellt, die später die Grundlage für das Logo ergeben soll. Ein leichter Schlagschatten und Verlauf und eine dunkelgraue Kontur sorgen für einen 3D-Effekt. Im Hintergrund liegen zusätzlich weiße und graue Kästchen, die einfach mit dem Auswahlrechteck erstellt und mit den passenden Farben gefüllt wurden.

Screenshot
Grundlage für das Logo

Schritt 3
Die obere „Plattform“ bietet sich für ein Logo als ideale Stelle an. Hier wurde ein Beispiel nur mit dem Textwerkzeug erstellt und ein Spruch hinzugefügt. Für die Grundlage des Buttons wurde auf einer eigenen Ebene mit dem Buntstift und Hellgrau ein Rahmen gezeichnet, der mit einem leichten Verlauf gefüllt wurde (von #555555 nach #828282).

Screenshot
Logo und Buttongrundlage

Schritt 4
Kopieren Sie Ihren Button und fügen Sie ihn in den Zwischenraum so oft ein, bis dieser gefüllt ist. Auf einer neuen Ebene zeichnen Sie mit dem Buntstift einen kleinen Pfeil.

Screenshot
Zwischenraum gefüllt

Schritt 5
Beschriften Sie den Button mit dem Textwerkzeug und kopieren Sie den Pfeil, so dass jeder Menüpunkt einen eigenen besitzt.

Screenshot
Ergebnis

Mit ImageReady können Sie dieses Menü ganz einfach mit einem Mouseover versehen.

Kategorien
Bilder & Vektorgrafiken bearbeiten Design Inspiration Photoshop Tutorials

Photoshop Seminar: Tipps und Tricks

Zum Abschluss des Seminars werfen wir Ihnen einen bunten Strauß mit Tipps und Tricks zu. Kniffe, die nicht jeder kennt, die aber Ihre Arbeit erleichtern und die Möglichkeiten des Programms ausreizen.

Sättigung verringern“. Die Teile des Bildes, die farbig werden sollen, löschen Sie in einer Ebenenmaske oder gleich vollständig mit dem Radiergummi. So wird die farbige Version des Bildes wieder sichtbar.

Bildelemente hinzufügen
Echte Bilder und selbst erstellte Elemente können ebenfalls vermischt werden. Hier habe ich auf einer eigenen Ebene erst einen Mundschutz erstellt, dann einen Stab hinzugefügt. Für mehr Dramatik brauchen Sie viel Kontrast und Schärfe. Zusätzlich wurde das Bild eingefärbt.

Wir hoffen, das Photoshop-Seminar hat Ihnen gefallen. Ab jetzt ist es ein leichtes, die vielen Photoshop-Artikel, die Dr. Web zu bieten hat, wirklich nachzuvollziehen.

Kategorien
Bilder & Vektorgrafiken bearbeiten Design Inspiration Photoshop Tutorials

Photoshop: Buttonreihe

Buttons in Form von Reitern haben sich auf zahlreichen Seiten durchgesetzt. Schauen wir wie ein Button ein ganzes Menü ergeben kann und wie dieses mit einer Zierleiste und einem spannenden Hintergrund abgerundet wird.

Farbton/Sättigung“ durch das Verschieben der Regler an. So können Sie mehrere Buttons erstellen. Die Ebenen der Buttons sollten unter der Ebene mit der Zierleiste liegen, damit diese den unteren Rand der Button abdecken kann.Screenshot
Fertiger Button

Schritt 5
Zum Schluss werden die Buttons passend beschriften. In unserem Beispiel wurde den einzelnen Menüpunkten noch ein Schlagschatten und eine leichte Kontur spendiert.

Screenshot
Ergebnis

Ein solche Leiste kann ein Design komplett beeinflussen, zumal mit Farben nicht gegeizt wurde. Reizvoll ist aber auch der Gedanke einen Kontrast zu erzeugen.

Kategorien
Bilder & Vektorgrafiken bearbeiten Design Inspiration Photoshop Tutorials

Photoshop-Tutorial: Auswahlen und Ihre Werkzeuge

Mit den Befehlen des Menüs „Auswahl“ und den hier vorgestellten Auswahlwerkzeugen können Sie beliebige Pixel auswählen. Begegnen Sie Zauberstäben, Lassos und Kanten.

Photoshop-Tutorials – ganz frisch.

Auswahlwerkzeuge im Detail
Schon im ersten Teil des Seminars habe ich Ihnen die Auswahlwerkzeuge kurz vorgestellt. Das Auswahlrechteck dient zum Erstellen einer rechteckigen Auswahl. Die Auswahlellipse dient zum Erstellen einer elliptischen Auswahl. Mit dem Auswahl-Werkzeug für inzelne Zeilen bzw. einzelne Spalten wird eine Begrenzung in Form einer 1 Pixel breiten Zeile oder Spalte erstellt.

Mit dem Lasso und dem Polygon-Lasso können Sie gerade und frei gezeichnete Segmente einer Auswahlbegrenzung zeichnen. Beim magnetischen Lasso wird die Begrenzung an den Kanten definierter Bildbereiche ausgerichtet.

Speichern und Laden einer Auswahl

Schon zu diesem Zeitpunkt können Sie, zum Beispiel mit dem Lasso, sehr komplizierte und zeitaufwändige Auswahlen erstellt haben. Um diese nicht bis zum nächsten Arbeitstag zu verlieren, können diese natürlich auch abspeichert werden.

Und so speichern Sie eine Auswahl: Wählen Sie „Auswahl“ –> „Auswahl speichern“ und geben Sie Ihrer Auswahl einen Namen. Um die gespeicherte Auswahl wieder zu laden wählen Sie „Auswahl“ –> „Auswahl laden“. Klicken Sie auf „OK“, um die Auswahl zu laden. In der Kanäle-Ansicht sehen Sie Ihre gespeicherte Auswahl.

Der Zauberstab

Bei der Vorstellung der Auswahlwerkzeuge habe ich ein Werkzeug ausgelassen – den Zauberstab. Mit dem Zauberstab können Sie einen einheitlich gefärbten Bereich. Zum Beispiel einen roten Ball auswählen, ohne die Konturen nachzeichnen zu müssen. Wie es auch mit dem Lasso-Werkzeug der Fall wäre. Geben Sie unter „Toleranz“ einen Pixelwert zwischen 0 und 255 ein. Ein niedriger Wert führt zur Auswahl von Farben, die dem angeklickten Pixel stark ähneln, ein hoher Wert zur Auswahl eines breiteren Farbspektrums.

Achten Sie nur darauf, dass nur gewünschte Bildbereiche ausgewählt werden. Mit dem Lasso können Sie später Ihre Auswahl verfeiner und ausbessern. Wenn Sie nur aneinander grenzende Bereiche auswählen möchten, aktivieren
Sie „Benachbart“, sonst werden alle Pixel mit den gleichen Farben im Bild ausgewählt. Wenn Sie Farben aus allen sichtbaren Ebenen auswählen möchten, aktivieren Sie „Alle Ebenen einbeziehen“.

Von der Auswahl subtrahieren oder addieren

Um von einer Auswahl etwas abzuziehen, halten Sie einfach, egal mit welchem Auswahlwerkzeug, beim Arbeiten die ALT-Taste gedrückt. Um einer Auswahl etwas hinzuzufügen, halten Sie die SHIFT-Taste gedrückt. SHIFT und
ALT, beim Arbeiten gleichzeitig gedrückt, sorgen für die Schnittmenge.

Der Befehl „Farbbereich auswählen“

Um ein Objekt, das auf einem einfarbigen Hintergrund liegt, auszuwählen bietet sich „Auswahl –> Farbbereich auswählen“ an. Setzen Sie den Zeiger auf das Bild oder den Vorschaubereich und klicken Sie, um die gewünschten Farben (die, die ausgewählt werden sollen) aufzunehmen. Stellen Sie den Farbbereich mit dem Toleranz-Regler ein. Mit der Option „Toleranz“ werden nur Pixel mit ähnlichen Farben in die Auswahl aufgenommen.

Wenn Sie Farben hinzufügen möchten, wählen Sie die Pipette mit dem Pluszeichen aus und klicken Sie auf den Vorschaubereich oder das Bild. Wenn Sie Farben entfernen möchten, wählen Sie die Pipette mit dem Minuszeichen. Bestätigen Sie dann mit „OK“.

Weiche Auswahlkante

Eine Auswahl mit einer weichen Kante hat den Vorteil, dass Sie das Bild nur grob freistellen müssen und gleich einen sanften Übergang haben. So legen Sie eine weiche Kante für eine vorhandene Auswahl fest: Nachdem Sie die Auswahl erstellt haben wählen Sie „Auswahl“ –> „Weiche Auswahlkante“ aus, und geben unter „Radius“ einen Wert ein und klicken Sie dann auf „OK“.

Auswahl verändern

Um eine bestehende Auswahl zu vergrößern oder zu verkleinern, klicken Sie bitte im Menü auf „Auswahl –> Auswahl verändern“ und wählen „Ausweiten“ oder „Verkleinern“ aus. Im folgenden Beispiel wurde eine kreisförmige Auswahl
immer wieder vergrößert und die Kontur gefüllt. Je größer die Auswahl wurde, um so weniger rund war der Kreis. Diesem Effekt können Sie mit „Auswahl –>Auswahl verändern –> Abrunden“ entgegen wirken.

Kategorien
Bilder & Vektorgrafiken bearbeiten Design Inspiration Photoshop Tutorials

Photoshop Seminar: Pfade und Ihre Werkzeuge

von Dirk Metzmacher

Photoshop stellt über die Werkzeugleiste eine ganze Armee von Pfadwerkzeugen zur Verfügung. Erfahren Sie wofür das alles gut und ist und was man damit anfangen kann.

Ein neuer Arbeitspfad
Um einen neuen Pfad zu erstellen wählen Sie ein Form- oder Zeichenstift-Werkzeug aus und klicken oben in der Optionsleiste auf die Schaltfläche „Pfade“ . Falls Sie mit dem Zeichenstift arbeiten, klicken Sie in das Bild, um mit den Ankerpunkten grob die Form zu erstellen. Schließen Sie die Form mit einem Klick auf den ersten gesetzten Ankerpunkt.

Mit einem der Formwerkzeuge, wie das Rechteck-, Abgerundetes-Rechteck- , Ellipse- oder das Polygon-Werkzeug, den Linienzeichner oder das Eigene-Form-Werkzeug, ziehen Sie einfach die Form auf. Der Arbeitspfad erscheint in der Pfade-Ansicht.

Bearbeiten von Pfaden
Ein Pfad setzt sich aus einem oder mehreren durch Segmente verbundenen Ankerpunkten zusammen. Um ein Segment zwischen den Ankerpunkten zu verändern, benutzen Sie das „Punkt-umwandeln-Werkzeug“ .

Klicken Sie den Ankerpunkt an und ziehen Sie die Griffpunkte heraus. Jetzt können Sie durch drehen und ziehen dieser Punkte die Segmente verändern. Mit dem „Pfadauswahlwerkzeug“ wählen Sie den kompletten Pfad aus und können ihn verschieben. Mit dem „Direkt-Auswahl-Werkzeug“ können Sie mehrere Ankerpunkte gleichzeitig bewegen.

So zeichnen Sie gerade Segmente
Bisher haben wir Pfade erstellt, die geschlossene Figuren ergaben. Für eine Gerade positionieren Sie den Zeichenstiftzeiger an der Stelle, an der das gerade Segment beginnen soll, und setzen durch Klicken den ersten Ankerpunkt. Halten Sie dabei die Shift-Taste gedrückt. Setzen Sie durch weiteres Klicken Ankerpunkte für zusätzliche Segmente.

Zeichnen von Kurven mit dem Zeichenstift
Erstellen Sie wie zuvor eine Gerade. Ziehen Sie jetzt aber mit dem „Punkt-umwandeln-Werkzeug“ die Griffpunkte heraus. Um eine einzelne Kurve zu erstellen, ziehen Sie den ersten Griffpunkt in Richtung der Kurvenrundung, den zweiten in die entgegengesetzte Richtung. Durch Ziehen der Griffpunkte in dieselbe Richtung entsteht eine „S-Kurve“.

So zeichnen Sie mit dem Freiform-Zeichenstift
Wählen Sie den Freiform-Zeichenstift aus. Ziehen Sie den Zeiger im Bild. Beim Ziehen wird hinter dem Zeiger ein Pfad angezeigt. Wenn Sie die Maustaste loslassen, wird ein Arbeitspfad erstellt.

Hinzufügen und Löschen von Ankerpunkten
Für diesen Zweck bietet das Programm zwei Spezialisten an. Mit dem Ankerpunkt-hinzufügen-Werkzeug können Sie einer Form Ankerpunkte hinzufügen. Mit dem Ankerpunkt-löschen-Werkzeug Ankerpunkte verschwinden lassen. Klicken Sie dazu entweder an die Stelle im Segment, an der der neue Ankerpunkt landen soll oder, um einen Ankerpunkt zu löschen, mit dem entsprechenden Werkzeug auf einen der Ankerpunkte.

Kategorien
Bilder & Vektorgrafiken bearbeiten Design Inspiration Photoshop Tutorials

Photoshop Seminar: Kanäle und Pfade

Mit Veränderungen in Kanal- und Pfadpalette lässt sich ein Bild präzise manipulieren. Aus angelegten Vektorpfaden lässt sich beispielsweise eine runde Auswahl erstellen, die viel genauer ist als ein Maskierungswerkzeug. Kanäle ermöglichen genauste Farbmanipulationen ebenso wie das Abspeichern einer einmal erstellten Auswahl.

Beleuchtungseffekte“. Stellen Sie den Filter nach Geschmack ein. Wichtig ist, dass Sie bei Relief-Kanal „Alpha 1“ auswählen. Bestätigen Sie mit OK und schärfen Sie das Bild.

Mit der Option „Relief-Kanal“ im Dialogfeld „Beleuchtungseffekte“ können Sie eine Graustufen-Struktur wie Sie im Kanal „Alpha 1“ zu finden ist verwenden, um zu steuern, wie Licht von einem Bild reflektiert wird. So entstehen 3D-Strukturen.

Pfade
In der Pfade-Palette werden der Name und ein Miniaturbild jedes gespeicherten Pfades, der aktuelle Arbeitspfad und die aktuelle Vektormaske aufgeführt. Erstellen Sie in einem neuen Dokument einen Pfad mit den Pfadwerkzeugen. Sie werden sehen, dass dieser Pfad in der Pfadeansicht erscheint.

Pfade umbenennen und speichern
Wird mit dem Zeichenstift oder einem Form-Werkzeug ein Arbeitspfad erstellt, dann wird der neue Pfad in der Pfade-Palette als Arbeitspfad angezeigt. Da der Arbeitspfad ein temporärer Pfad ist, können Sie ihn speichern, damit der Pfadinhalt nicht verloren geht, was unweigerlich geschieht sobald Sie einen neuen Pfad zeichnen.

Wenn Sie den Arbeitspfad speichern und umbenennen möchten, wählen Sie aus dem Menü der Pfade-Palette „Pfad speichern“, geben einen neuen Pfadnamen im Dialogfeld ein und klicken Sie auf „OK“.

Pfade als Auswahl laden
Sie können jeden geschlossenen Pfad als Auswahl laden, indem Sie in der Pfadeansicht auf den Button „Pfad als Auswahl laden“ drücken. Umgekehrt geht das natürlich auch. Jede mit einem Auswahlwerkzeug erstellte Auswahl kann als Pfad definiert werden. Erstellen Sie eine Auswahl mit dem Lasso und klicken Sie in der Pfadeansicht auf den Button „Arbeitspfad aus Auswahl erstellen“.

Das Füllen von Pfaden und Pfadkonturen mit Farbe
Mit dem Befehl „Pfadfläche füllen“ können Sie einen Pfad mit einer bestimmten Farbe, einem Bildstatus, einem Muster oder einer Füllebene füllen. Und so geht es: Wählen Sie den Pfad in der Pfade-Palette aus. Klicken Sie am unteren Rand der Pfade-Palette auf die Schaltfläche „Pfadfläche füllen“. Jetzt wird die Fläche mit der Vordergrundfarbe gefüllt.

Mit dem Befehl „Pfadkontur füllen“ können Sie die Pfadbegrenzung mit Farbe füllen. Dieser Befehl ermöglicht es Ihnen, einen Malstrich zu erstellen, der einem beliebigen Pfad folgt. Dies hat nichts mit dem Ebeneneffekt „Kontur“ zu tun, bei dem der Effekt der Malwerkzeuge nicht imitiert wird.

Wählen Sie den Pfad in der Pfade-Palette aus. Klicken Sie am unteren Rand der Pfade-Palette auf die Schaltfläche „Pfadkontur füllen“. Fertig! Mit jedem Klicken auf „Pfadkontur füllen“ erhöht sich die Deckkraft des Malstrichs.

Kategorien
Bilder & Vektorgrafiken bearbeiten Design Inspiration Photoshop Tutorials

Photoshop Seminar: Ebenen, Ebenenmasken, Effekte und Modi

Es wird spannend. Die Arbeit mit Ebenen-Palette, Ebenen, Ebenensätzen und -effekten bilden den zentralen Bestandteil Photoshops. Auch die verschiedenen Ebenenmodi kommen nicht zu kurz.

Ebenengrundlagen – Hintergrundebene
Um die Ebenen-Palette aufzurufen, wählen Sie im Menü „Fenster“ –> „Ebene“. Normalerweise ist das Fenster schon geöffnet. Solange Sie kein Bild geöffnet haben, ist das Fenster inaktiv. Um mehr über die Ebenentechnik zu lernen, öffnen Sie ein .JPG-Bild Ihrer Wahl. Stellen Sie sich Ebenen als durchsichtige Folien vor, die übereinander gelegt werden.

Ebenengrundlagen – Die erste Ebene
Benutzen Sie das Textwerkzeug, um auf das Bild zu klicken und schreiben Sie einen kurzen Satz. Sie werden sehen, dass im Ebenenmenü eine neue Ebene entstanden ist. Um beim Folienbeispiel zu bleiben, stellen Sie es sich einfach so vor, dass über einem Bild eine durchsichtige Folie gelegt wird, auf der geschrieben wurde.

Ebenengrundlagen – Die zweite Ebene
Durch einen Klick auf „Ebene -> Neu -> Ebene“ oder einen Klick auf den Button „Neue Ebene erstellen“ unten rechts im Ebenenfenster können Sie eine weitere leere Ebene erstellen.

Tun Sie dies und sprühen Sie mit dem Airbrush-Werkzeug einige Linien. Mit dem Verschieben-Werkzeug können Sie diese Linien bewegen als ob Sie die Folie hin und her bewegen. Die neue Ebene heißt „Ebene 1“. Sie können die Ebene umbenennen, indem Sie einen Doppelklick genau auf die Schrift machen – einfach Namen eintippen und bestätigen.

Um eine der Ebenen auszublenden, klicken Sie auf das kleine Auge neben der Ebenenminiatur. Um eine Ebene zu löschen aktivieren Sie die Ebene, so dass sie Blau markiert ist und klicken auf den Mülleimer-Button unten rechts im Ebenenfenster und bestätigen mit Okay.

Ebenenmodus
Löschen Sie die Ebene mit den Strichen. Sie sollten jetzt eine Hintergrundebene und eine Schriftebene im Ebenenfenster sehen. Falls dem nicht so ist, sorgen Sie bitte dafür. In der Dropdown-Liste „Modus“ erscheint der Hinweis: „Normal“. Aktivieren Sie die Textebene und probieren Sie alle Ebenenmodi einmal durch. Der ausgewählte Modus bestimmt, wie sich die Ebene mit den Pixel der darunter liegenden Ebene verrechnet.

Ebenendeckkraft und Ebenenmasken
Direkt neben der Auswahl für die Ebenenmodi sehen Sie die Einstellungsmöglichkeit für die Ebenendeckkraft. Sie gibt an, zu wieviel Prozent eine Ebene sichtbar sein soll mit Werten von 100%, also komplett sichtbar bis 0%, was unsichtbar entspricht.

Und wenn Sie nicht die komplette Ebene, sondern nur einen Teil unsichtbar machen möchten? Vielleicht sogar mit einem sanften Übergang? Auch da haben sich die Photoshop-Entwickler etwas einfallen lassen, die Ebenenmasken. Um einer Ebene eine Maske zu geben, aktivieren Sie die Ebene und klicken auf den Button „Ebenenmaske hinzufügen“ oder im Menü auf „Ebene –> Ebenenmaske hinzufügen“.

Mit Ebenenmasken arbeiten
Nach dem Klick auf den Button „Ebenenmaske hinzufügen“ sehen Sie im Ebenenfenster neben der Ebenenminiatur eine Ebenenmaskenminiatur. Solange diese aktiviert ist, gelten andere „Gesetze“ in Photoshop. Hier, in der Ebenenmaske, bedeutet die Farbe Schwarz unsichtbar und die Farbe Weiß sichtbar. Probieren Sie es aus.

Mit dem Buntstift, einer Werkzeugspitze Ihrer Wahl und Schwarz lassen Sie einen Teil der Schrift unsichtbar werden. Zeichnen Sie anschließend mit Weiß, um die Schrift wieder sichtbar zu machen. In der Ebenenmaskenminiatur erkennen Sie alle Änderungen. In meinen Schulungen habe ich beobachtet, dass es nicht so leicht zu verstehen ist, dass in der Maske das gleiche Werkzeug mit Schwarz etwas unsichtbar macht, normalerweise aber einen Strich zeichnet.

Deshalb noch einmal zur Wiederholung. Ist die Ebene aktiviert, können Sie mit dem Linienzeichner, dem Airbrush oder dem Buntstift und schwarzer Farbe ganz normal arbeiten. Ist die Maske aktiv gelten andere Regeln. Hier bedeutet die Farbe Schwarz immer unsichtbar und Weiß sichtbar. Um zwischen diesen beiden Bereichen zu wechseln, reicht ein Klick auf die Miniatur.

Ebenenmaskenbeispiel
Öffnen Sie ein neues Dokument mit weißem Hintergrund und erstellen Sie eine neue Ebene durch „Ebene –> Neu –> Ebene“. Zeichnen Sie mit dem Buntstift und Rot eine dicke Linie. Geben Sie der Ebene eine Ebenenmaske durch „Ebene –> Ebenenmaske hinzufügen“. Zeichnen Sie jetzt mit einer kleineren Werkzeugspitze und Schwarz kleinere Striche in den roten Strich. Zeichnen Sie per Zufallsprinzip mit Weiß ein paar Linien über die Bereiche die unsichtbar geworden sind. Sie werden wieder sichtbar. Um wieder im Normalenmodus arbeiten zu können, klicken Sie auf die Ebenenminiatur.

Verläufe von Schwarz nach Weiß
Wenn Sie eine Ebene mit einem Bild haben, in dem Teile unsichtbar werden sollen, bieten sich Masken an. Masken können aber noch mehr. Nicht nur sichtbar oder unsichtbar, sondern alle Abstufungen dazwischen. Das möchten Sie sehen? Kein Problem.

Öffnen Sie ein Bild, fügen Sie über der Hintergrundebene ein zweites Bild ein und geben Sie der Ebene eine Maske. Mit dem Verlaufswerkzeug ziehen Sie einen Verlauf von Schwarz nach Weiß auf. Das Bild verblasst langsam. Die Technik der Ebenenmasken sollten Sie jetzt verstanden haben. Ist Ihnen am Bild etwas aufgefallen? Die oberste Ebene ist neu. Dazu mehr im nächsten Beispiel.

Einstellungsebenen
Die Möglichkeiten unter „Bild –> Anpassen (Ineinanderkopieren)“ wie zum Beispiel Helligkeit/Kontrast oder Farbton/Sättigung haben Sie schon kennen gelernt. Sollen diese nicht auf Dauer in das Bild gerechnet werden, helfen Ihnen die Einstellungsebenen. Um diese kennen zu lernen, öffnen Sie ein Bild Ihrer Wahl und klicken im Menü auf „Ebene –> Neue Einstellungsebene“ und suchen Sie sich eine der Möglichkeiten aus. So können Sie Bilder mehr Kontrast oder Farbe verleihen oder die Stimmung des ganzen Bildes beinflußen, ohne diese Schritte direkt mit dem Bild zu verrechnen.

Ebeneneffekte und -stile
Zu Photoshop und ImageReady gehören Effekte wie Schatten, Schein, abgeflachte Kanten, Überlagerungen, Konturen und viele mehr, mit denen sich das Aussehen von Ebeneninhalten rasch ändern lässt. Ebeneneffekte sind mit dem Ebeneninhalt verbunden. Wenn Sie den Inhalt einer Ebene verschieben oder bearbeiten, ändern sich die Effekte entsprechend. Weisen Sie etwa einer Textebene einen Schlagschatteneffekt zu, wird der Schatten bei der Textbearbeitung automatisch angepasst.

Öffnen Sie ein beliebiges Bild und schreiben Sie mit dem Textwerkzeug ein Wort. Unter „Ebene –> Ebenenstil“ finden Sie viele Möglichkeiten, mit denen Sie zum Beispiel Text verschönern können. Aktivieren Sie einfach einige der Ebenenstile mit den Standardeinstellungen.

Kategorien
Bilder & Vektorgrafiken bearbeiten Design Inspiration Photoshop Tutorials

Photoshop Seminar: Scharfzeichnungsfilter – Stilisierungsfilter – Störungsfilter – Strukturierungsfilter – Vergröberungsfilter

Nichts als Filter… Geben Sie Bildern mehr Schärfe, versetzen Sie Pixel, um impressionistische Effekte zu erzielen oder fügen Sie Störungen und Strukturen hinzu. Photoshops Filterwelt macht fast alles möglich.

Konturen scharfzeichnen und Unscharf maskieren
Allen Filtern ist gemein, dass sie Bereiche in einem Bild, in denen deutliche Farbänderungen auftreten (also „Kanten“), scharfzeichnen.

Der Filter „Konturen scharfzeichnen“ zeichnet nur Kanten scharf. Unschärfen im Bild an sich bleiben erhalten. Verwenden Sie den Filter „Unscharf maskieren“, um das Bild im Ganzen zu schärfen. Falls es Sie interessiert, wie dieser Filter funktioniert, benutzen Sie ihn mit extremen Einstellungen. Sie können dann deutlich seine Arbeitsweise erkennen. Der Filter korrigiert den Kontrast an Kanten und erzeugt eine hellere und eine dunklere Linie auf beiden Seite der Kante. Auf diese Weise wird die Kante hervorgehoben und das Bild erscheint schärfer.

Scharfzeichnen und Stark scharfzeichnen
Ein Bild wird durch diese zwei Filter – ohne Feinabstimmung – scharf und etwas klarer. Der Filter „Stark scharfzeichnen“ wendet einen stärkeren Scharfzeichnungseffekt an als der Filter „Scharfzeichnen“. Logisch, oder?

Kacheleffekt
Dieser Filter teilt das Bild in viele Kacheln auf. Zum Auffüllen der Fugen zwischen den Kacheln wird die Hintergrundfarbe, die Vordergrundfarbe, eine umgekehrte Version des Bildes oder eine unveränderte Bildversion genutzt. Bei letzterer Option wird die gekachelte Version direkt auf das Original gelegt und Teile des Originalbildes werden unter den Kachelkanten sichtbar.

Konturen finden
Dieser Filter ermittelt die Übergänge des Bildes und hebt die Kanten hervor. dies wird erreicht, in dem die Kanten mit dunklen Linien gegen einen weißen Hintergrund nachgezeichnet werden.

Konturenwerte finden
Hier werden die Kanten der wichtigsten Helligkeitsbereiche hervorgehoben und die Konturen dieser Bereiche für jeden Kanal mit dünnen Strichen nachgezeichnet .

Korneffekt
Der Name ist etwas irreführend. Nur im Normalmodus sehen Sie deutlich „Körner“. Der Korneffekt verlagert Pixel je nach ausgewählter Option, so dass sie weniger scharf gezeichnet aussehen. „Normal“ verschiebt die Pixel nach dem Zufallsprinzip und ignoriert Farbwerte, „Nur abdunkeln“ ersetzt helle Pixel durch dunkle, „Nur aufhellen“ ersetzt dunkle Pixel durch helle Pixel. „Anisotrop“ verlagert Pixel in der Richtung der geringsten Farbänderung. Wie bei allen Filtern sollten Sie den Filter mit allen Einstellungen testen. Ein Bild sagt auch hier mehr als tausend Worte.

Leuchtende Konturen
Die Kanten des Bildes bekommen einen neonartigen Schein, der Rest wird Schwarz.

Relief
Lässt eine Auswahl reliefartig erhöht oder versenkt erscheinen. Zu den Optionen gehören der Winkel des Relief von -360 Grad zur Versenkung der Oberfläche bis +360 Grad zur Erhöhung, die Höhe und ein Prozentsatz für den Farbanteil in der Auswahl. Wenn Sie Farbe und Details beim Relief-Effekt erhalten möchten, verwenden Sie den Befehl „Verblassen“ unter „Bearbeiten“, nachdem Sie den Filter „Relief“ angewendet haben.

Solarisation
Ein Fotoabzug, der während der Entwicklung kurz dem Licht ausgesetzt wird, sieht diesem Effekt sehr ähnlich. Hier vermischt sich das Bildnegativ mit dem Bildpositiv.

Windeffekt
Erstellt winzige horizontale Linien im Bild, um einen Windeffekt zu simulieren. Zu den Methoden gehören „Wind“, „Sturm“ und, für einen etwas dramatischeren Effekt, „Orkan“.

Helligkeit interpolieren
Störungen verringert dieser Filter durch das Angleichen der Helligkeitswerte der Pixel. Der Filter durchsucht den Radius einer Pixelauswahl nach Pixeln mit ähnlicher Helligkeit. Dabei werden die Pixel verworfen, die sich zu stark von benachbarten Pixeln unterscheiden. Dieser Filter ist nützlich, um Bewegungseffekte auf einem Bild zu reduzieren oder ganz zu entfernen.

Staub und Kratzer entfernen
Um Störungen zu reduzieren probieren Sie verschiedene Kombinationen von Radius- und Schwellenwerteinstellungen aus, um den besten Kompromiss zwischen Schärfe und Fehlerausgleich zu finden.

Störungen entfernen
Ermittelt die Kanten in einem Bild und zeichnet alles außer den Kanten weich. Dabei werden Störungen entfernt, die Details bleiben aber erhalten.

Störungen hinzufügen
Fügt Pixel nach dem Zufallsprinzip in ein Bild ein. Der Filter „Störungen hinzufügen“ kann außerdem verwendet werden, um Streifenbildung bei weichen Auswahlkanten oder Verläufen zu reduzieren oder stark retuschierten Bereichen ein realistischeres Aussehen zu geben. „Gleichmäßig“ verteilt Farbwerte von Störungen mit Hilfe zufälliger Zahlen zwischen 0 plus oder minus dem angegebenen Wert und erzeugt einen subtilen Effekt; „Gaußsche Normalverteilung“ verteilt Farbwerte von Störungen entlang einer glockenförmigen Kurve und erzeugt einen gesprenkelten Effekt. Mit „Monochrom“ wird der Filter Schwarz/Weiß angewendet.

Buntglas-Mosaik
Malt ein Bild neu als einfarbige, aneinander grenzende Zellen mit Konturen in der Vordergrundfarbe. Der Filtername legt nahe, diesen Effekt für ein Tiffany-Mosaik zu nutzen.

Kacheln
Der Filter „Kacheln“ trocknet das Bild aus. Es scheint auf trockener Erde gezeichnet zu sein.

Körnung
Fügt einem Bild durch Simulieren verschiedener Körnungsarten Struktur hinzu.

Mit Struktur versehen
Wendet eine Struktur an, die Sie für ein Bild auswählen oder erstellen. Es stehen Ihnen Ziegel, Sackleinen, Leinwand und Sandstein von Haus aus zur Verfügung. Eigene Strukturen können hinzu geladen werden. Für Texturen einer der wichtigsten Filter.

Patchwork
Bricht ein Bild in Quadrate auf, die mit der dominierenden Farbe in diesem Bereich des Bildes gefüllt sind. Der Filter reduziert oder erhöht die Quadrattiefe nach dem Zufallsprinzip, um Lichter und Schatten zu simulieren. Auf ein schwarz weißes Wolkenbild angewendet bekommen Sie, nach einigen zusätzlichen Schritten, eine Kopfsteinpflaster-Textur.

Risse
Das Bild bekommt ein feines Netz von Rissen. Abstand, Tiefe und Helligkeit der Risse sind einstellbar.

Facetteneffekt
Bewirkt die Zusammenfassung aus Farbflächen oder ähnlichen Farben zu gleichfarbigen Pixelblöcken. So sieht die Welt durch die Facettenaugen eines Insekts aus.

Farbraster
Simuliert die Wirkung eines sehr groben Rasters in jedem Kanal des Bildes. Der Filter unterteilt das Bild für jeden Kanal in Rechtecke und ersetzt jedes Rechteck durch einen Kreis. Die Kreisgröße ist proportional zur Helligkeit des Rechtecks. In Schwarz/Weiß nützlich für den typischen Zeitungseffekt.

Kristallisieren
Das Bild wird aus kleinen Polygon-Formen neu erstellt.

Mezzotint
Konvertiert ein Bild in ein Muster aus schwarzweißen Bereichen bzw. aus Farben, das allerdings nur in einem Farbbild. Unterschiedliche Muster werden angeboten. Zur Auswahl stehen verschiedene Punkt-, Strich- und Linienmuster.

Mosaikeffekt
Fasst Pixel zu quadratischen Blöcken zusammen. Schöner Effekt zum Thema „digitalisieren“.

Punktieren
Bricht die Farbe in einem Bild in zufällig platzierte Punkte auf und verwendet Ihre eingestellte Hintergrundfarbe als Leinwandbereich zwischen den Punkten.

Kategorien
Bilder & Vektorgrafiken bearbeiten Design Inspiration Photoshop Tutorials

Photoshop: Jahrmarkt und Kuchenstreusel

Wer einmal blinkende Leuchtschriften auf dem Jahrmarkt gesehen hat, weiß, welche faszinierende Wirkung von ihnen ausgeht. Mit Photoshop lässt sich aber auch dieser Effekt in das Web transportieren, selbst zur Kuchendekoration lässt sich dieses Beispiel nutzen.

Dazu bedarf es einer Schrift, deren Auswahl später als Grundlage für die Umrandung dient. Diese wird im Pinselmenü erstellt. Dazu wird zunächst das Pinsel-Werkzeug gewählt, anschließend erreicht man mit F5 oder über das Fenster-Menü die Pinsel-Palette.

Screenshot
Skript angewendet

Unter „Pinselform“ muss zunächst der Malabstand auf einen Wert über 100% gesetzt werden, damit Einzelpunkte statt einer Linie erzeugt werden. Sollen die Punkte nicht statisch in einer Reihe angeordnet, sondern zufällig etwas nach oben oder unten aus der Reihe tanzen, helfen feine Änderungen in den Einstellungen zur Streuung.

Screenshot
Skript angewendet

Damit die Farbe später schön bunt herauskommt, verwenden wir einige Variationen unter „Farbton“. Der Pinsel wird mit einem Klick auf das Symbol „Neuen Pinsel erstellen“ ganz unten in der Pinsel-Palette gespeichert. Er steht nun dauerhaft als Werkzeugspitze zur Verfügung.

Screenshot
Skript angewendet

Ist der Pinsel fertig, kann ein Text erstellt werden. Von dieser Text-Ebene brauchen wir lediglich die Auswahl als solche. Man erhält sie durch einen Klick auf die Ebene bei gedrückter STRG-Taste. In der Pfad-Palette lässt sich über den Button „Auswahl aus Pfad erstellen“ ein Vektorpfad erzeugen.

Screenshot
Skript angewendet

Auf einer neuen Ebene kann nun der Pfad nachgezeichnet werden. Ein Klick auf den Button „Pfad mit Pinsel füllen“ am unteren Rand des Pfad-Menüs reicht dazu aus. Hier fällt auch sofort auf, wenn der gewählte Pinsel zu groß war, dann lässt sich trotz vieler bunter Punkte die Pfadkontur nur schwer erahnen. Für den Dr. Web Schriftzug wurde ein Pinseldurchmesser von 4 Pixeln verwendet.

Screenshot
Skript angewendet

Der Ebenenstill „Abgeflachte Kante und Relief“ gibt dem Bild am Schluss einen plastischen Eindruck: Voilá.

Kategorien
Bilder & Vektorgrafiken bearbeiten Design Inspiration Photoshop Tutorials

Photoshop Seminar – Kunstfilter – Malfilter – Renderingfilter

von Dirk Metzmacher

Erst die Filter machen Photoshop wirklich mächtig. Mit Kunst- und Malfiltern können traditionelle Maltechniken simuliert werden. Mit Rendering-Filtern werden Wolken oder Lichteinfall berechnet.

Aquarell
Wie beim „echten“ Aquarell wird hier mit einem mittelgroßen, mit Wasser und Farbe getränkten Pinsel ein Bild „nachgemalt“. Die Details werden vereinfacht, die Kanten verstärkt.

Buntstiftschraffur
Dieser Filter reagiert auf die eingestellte Hinter- und Vordergrundfarbe, wobei die Hintergrundfarbe durch die glatteren Bereiche hindurch scheint. Für brauchbare Ergebnisse testet man verschiedene Farben aus. Wichtige Kanten bleiben erhalten und bekommen eine raue Kreuzschraffur.

Diagonal verwischen
Zeichnet ein Bild mit diagonalen Strichen nach. Die dunkleren Bereiche des Bildes werden verschmiert, die helleren Bereiche sehr hell und detailarm.

Farbpapier-Collage
Das Bild wird sehr grob aus zerrissenen Papierstücken zusammen gesetzt.

Fresko
Mit kurzen, runden und eilig aufgetragenen Farbtupfen wird das Bild grob nachgemalt.

Grobe Malerei
Dieser Filter liegt genau zwischen Ölfarbe und Aquarellfarbe. Er vereinfacht das Bild, indem er dessen Farbbereiche auf Bereiche mit einheitlicher Farbe reduziert.

Grobes Pastell
Wie mit farbiger Pastellkreide auf einem strukturierten Hintergrund gemalt, wird man nach Anwendung dieses Filters sagen. In Bereichen mit heller Farbe wirkt die Kreide dick und strukturarm; in dunklen Bereichen wirkt sie abgekratzt und gibt den Blick auf die Struktur frei.

Körnung und Aufhellung
Hellere Bereiche des Bildes werden aufgehellt, dunklere Bereiche bekommen eine leichte Körnung.

Kunststoffverpackung
Über das Bild wird eine glänzende Kunststofffolie gezogen, die sich an einigen Stellen aufwellt.

Malgrund
Malt das Bild auf einem strukturierten Hintergrund. Zur Auswahl stehen Leinwand, Sackleinen, Ziegel und Sandstein.

Malmesser
Verringert Details und lässt nur große Farbflecken übrig.

Neonschein
Fügt dem Bild verschiedene Arten von Schein hinzu und eignet sich zum Kolorieren und gleichzeitigen Weichzeichnen eines Bildes. Wenn Sie für einen Schein eine Farbe auswählen möchten, klicken Sie auf das Feld „Farbe“ und wählen Sie eine Farbe aus. Die Vordergrundfarbe wird mit dieser Farbe gemischt.

Ölfarbe getupft
Sie können aus verschiedenen Pinselgrößen und -arten wählen, um einen handgemalten Effekt zu erzielen. Zu den Pinselarten gehören „Einfach“, „Aufhellend, rau“, „Abdunkelnd, rau“, „Breit, härter“, „Breit, weicher“ und „Sprenkeln“. Schöne Effekte bekommen Sie mit einer kleinen Werkzeugspitze und der Pinselart „Breit, härter“.

Schwamm
Erstellt das Bild mit stark strukturierten Bereichen aus kontrastreicher Farbe neu, die wie mit einem Schwamm gemalt aussehen.

Tontrennung und Kantenbetonung
Reduziert die Farbanzahl durch Tontrennung und ermittelt die Kanten des Bildes und zeichnet schwarze Linien auf diesen nach. Große, einheitliche Bereiche des Bildes erhalten so eine einfache Schattierung, während feine dunkle Details im Bild verteilt werden. Erinnert an einen Underground-Comic

Dunkle Malstriche
Macht dunkle Bereiche eines Bildes mit kurzen, eng aneinander liegenden Strichen schwärzer und bemalt hellere Bereiche mit langen, weißen Strichen. So entstehen sehr kontrastreiche, stimmungsvolle Bilder.

Gekreuzte Malstriche
Malt ein Bild mit Hilfe von diagonalen Strichen neu. Die helleren Bereiche eines Bildes werden mit Malstrichen erstellt, die in eine Richtung aufgetragen werden, und die dunkleren Bereiche mit Malstrichen, die in die entgegen gesetzte Richtung aufgetragen werden. Sehr schöner „Wie-Gemalt“-Effekt, nur die Kanten müssen per Wischfinger verbessert werden.

Kanten betonen
Akzentuiert die Kanten eines Bildes. Wenn „Kantenhelligkeit“ auf einen hohen Wert eingestellt ist, sehen die Akzente wie weiße Kreide aus und bei einem niedrigen Wert wie schwarze Druckfarbe.

Konturen nachzeichnen
Zeichnet ein Bild mit feinen, schmalen Linien nach. Es ähnelt einer Federzeichnung.

Kreuzschraffur
Fügt einem Bild Struktur hinzu und raut die Kanten der farbigen Bildbereiche durch simulierte Buntstiftschraffuren auf, wobei die Details des Originalbildes erhalten bleiben. Dieser Effekt wirkt eher künstlich.

Spritzer
So sieht ein Bild mit einer Spritzpistole gemalt aus. Je höher die Werte für die einzelnen Optionen, desto stärker ist der Gesamteffekt.

Sumi-e
Malt ein Bild im japanischen Stil, als würde mit einem nassen Pinsel schwarze Druckfarbe auf Reispapier aufgetragen. Dies führt zu weichen, unscharfen Kanten mit tiefen Schwarztönen.

Verwackelte Striche
Malt ein Bild mit den Bild beherrschenden Farben und schrägen, verwackelten Farbstrichen nach.

Beleuchtungseffekte
Es stehen Ihnen 17 Lichtstile, 3 Lichtarten und 4 Lichteigenschaftensätze zur Verfügung, um Lichteinfall zu simulieren. Zusätzlich können Sie Strukturen von Graustufen-Dateien verwenden (Relief-Kanäle), um 3D-ähnliche Effekte zu erzeugen.

Blendenflecke
Fällt helles Licht in das Kameraobjektiv entsteht eine Lichtbrechung, die hier nachgeahmt wird. Geben Sie eine Position für den Mittelpunkt der Lichtbrechung an, indem Sie an beliebiger Stelle in der Bildminiatur klicken oder das Fadenkreuz ziehen.

Differenz-Wolken
Verwendet nach dem Zufallsprinzip ermittelte Werte, die zwischen der Vordergrund- und der Hintergrundfarbe variieren und ein Wolkenmuster erzeugen. Dieser Filter mischt die Wolkendaten mit den vorhandenen Pixeln Ihres Bildes auf dieselbe Weise, wie die Füllmethode „Differenz“. Das mehrfache Anwenden dieses Filters erzeugt einen Marmoreffekt.

Fasern
Erzeugt mit den Vorder- und Hintergrundfarben einen Effekt ähnlich verwobenen Fasern. Ein interessanter Filter, um Holzstrukturen zu erzeugen.

Wolken
Erzeugt ein weiches Wolkenmuster mit Hilfe von Zufallswerten, die zwischen den Vordergrund- und Hintergrundfarben variieren – hier Schwarz/Weiß.

In nächsten Teil kümmern wir uns um die Scharfzeichnungs-, Stilisierungs-, Störungs- und Strukturierungsfilter.

Screenshot