Forum - Tutorials - Kantenglättung bei Pixelwerken (Anti-Aliasing)


zurück zur Übersicht
Beiträge 1 - 2 (2)    
Zeige 

Kantenglättung bei Pixelwerken (Anti-Aliasing) link
Erstellt vonBeiträge
  
Seele07gepostet: 09.03.2010 09:37 link

User-Rating:
Willkommen zu meinem kleinen Anti-Aliasing Tutorial!

Anti-Aliasing ist eine Methode, um bei Pixelwerken den typischen "Treppchen-Effekt" einzudämmen ^_^ .

Wie sieht das nun in der Praxis aus? Hier mal ein Beispielbild:



Wie man sehen kann, ist die eine Kurve deutlich pixelig und die andere "weicher", dafür aber auch leicht unscharf. Diese Art "Weichzeichner-Effekt" nennt man im Computer-Jargon Anti-Aliasing .

Pixelkünstler verzichten dabei auf automatisches Anti-Aliasing, wie es viele Bildbearbeitungsprogramme bieten und zeichnen ihr Antialiasing von Hand!

Nun hat man bei Pixelwerken in der Regel maximal 256 ( bzw. 255 Farben plus Transparenz ) zur Verfügung. Deswegen zeige ich euch noch eine Variante der oben gezeigten Kurve mit weniger Farben für die Schattierung bzw. das Anti-Aliasing:



Noch etwas möchte ich ansprechen, was das Thema Anti-Aliasing angeht. Und zwar, ob man bei Pixelwerken, die einen wechselnden Hintergrund haben, auch aussen - im Transparenzbereich - mit Anti-Aliasing versehen sollte, oder nicht?!

In der Regel wird davon abgeraten bei einem transparenten Hintergrund die Aussenlinien an der Aussenkante auch mit Anti-Aliasing zu versehen. Was heisst das nun konkret?

Schauen wir uns ein Bild an:



Der rote Pfeil zeigt eine Smiley-Aussenkante mit Anti-Aliasing aussen im Weissbereich (Hintergrund) - In diesem Fall wäre das Oke, denn der Hintergrund ist ja weiss und ändert sich nicht ( hoffentlich ) .

Der grüne Pfeil zeigt eine Aussenkante ohne Anti-Aliasing - das wäre die einzige Wahl bei einem wechselnden Hintergrund, also beispielsweise wie hier in PP, da ja dort die Werke aussen transparent sind.

Einzig das PNG Dateiformat unterstützt Halb-Transparenzen und somit könnte man dort auch Anti-Aliasing einzeichnen, welches sich automatisch an jeden beliebigen Hintergrund anpasst .

Fazit: Anti-Aliasing kann ein Pixelwerk - besonders in der Vergrösserung - aufwerten, aber man sollte die Aussenkanten möglicherweise nicht mit Anti-Aliasing versehen, wenn der Hintergrund transparent sein soll und somit auch wechselt was den Bildinhalt angeht.

  
Seele07gepostet: 09.03.2010 11:08 link

User-Rating:
Wie geht man nun dabei vor?

Als erstes zeichnet euer Werk ganz normal ohne Anti-Aliasing, aber beachtet, dass ihr genug freie Farbpaletteneinträge frei lasst für die Anti-Aliasing-"Farbtöne", also die Farben, die ihr für das Anti-Aliasing braucht.



Von A nach B - aber wie?!

In Schritt 1 seht ihr den normalen Bogen ohne Anti-Aliasing.

Bei Schritt 2 habe ich schon mal im groben die Einzel-Linien des Bogens bzw. der Kurve leicht heller gemacht mit einem entsprechenden Farbton ( hier: Dunkelgrau ) . Dabei schaue ich welche Pixel in der Kurve an einer "Treppenstufe" sind, wo also ein Knick bzw. Bruch ist in der Linie. Es gilt dabei die Regel: Je länger die beiden Linien der jeweiligen "Trepenstufe", umso länger auch die Anti-Aliasing Schattierungen. Also am Oberen Teil der Kurve haben wir folglich längere Dunkelgraue Striche als unten wo die Kurve "runder" wird.

Im dritten und somit letzten Schritt verfeinere ich die Anti-Aliasing Schattierung graduell, also füge so lange immer hellere Schattierungen ein, bis es "stimmig" aussieht. Dabei gilt: Je weiter die Anti-Aliasing Schattierung gegen den Hintergrund geht, umso heller wird die Schattierung. Entsprechend ist es auch bei Anti-Aliasing innerhalb einer Form ( wie beispielsweise bei dem Smiley weiter oben ) -> Je weiter wir von der einen Form ( Nr. 1 ) zur anderen Form ( Nr. 2 ) antialiasing-schattieren, umso mehr nimmt es die Farbe der anderen Form ( Nr. 2 ) an.

Ich hoffe ich konnte etwas Klarheit in die Sache bringen und möchte betonen, dass Anti-Aliasing noch Neuland für mich ist und die gezeigten Beispiele keineswegs zu 100% stimmen müssen.

Wenn Fragen oder Anmerkungen hierzu sind, bitte hier stellen in einem neuen Posting oder mir eine PN schreiben.

Grosser Dank geht an topixel für die Smileyüberarbeitung und Taruner für hilfreiche Kritik!

Danke,
.Ingo.

  
Beiträge 1 - 2 (2)    
Zeige 

Um das Forum zu benutzen musst Du registriert und eingeloggt sein