Wie erstelle ich einen randlosen Avatar mit Transparenz?

Hagen · 22.12.2007, 19:36

Hallo,

ich frage mich immer wieder, wie ich diese .gif - Avatare machen kann, die keinen Rand haben und sich jedem Foren-Style schön anpassen. Kami1205, Robert und -Alex- haben solche Avatare. Wie erstelle ich sowas? Geht das mit jedem Bild? Was brauche ich dafür?

Vielen Dank!

22.12.2007, 20:08

Kami1205 und Robert (und 64Bit-Monster und Mr.GiZMO, etc.) haben PNG-Avatare, die den vollen Farbraum und Alphakanäle (für Transparenz) nutzen können. Ich hab' ein GIF-Avatar. Dei Dinger können leider nur max. 256 Farben benutzen, dafür sind aber Animationen möglich. Meine Animation sieht sicher nicht auf anderen Foren genauso toll aus und passt sich nicht an. Außerdem kannst du bei GIF nicht wählen ob etwas nur halbdurchlässig oder 60% durchlässig ist, entweder ganz transparent oder nicht. Also wenn du keine Animation in deinem Avatar haben willst, ist PNG die deutlich bessere Wahl.

Gehen sollte das mit jedem Bild. Als Freeware sollte GIMP dazu recht nützlich sein und ich benutze Photoshop, da es damit für mich doch am einfachsten geht.

Poste mal das Bild, das du benutzen möchtest. Vielleicht kann ich da schnell etwas draus zaubern.

Alex

Hagen · 22.12.2007, 20:31

Photoshop richte ich gerade ein. Ich melde mich dann wenn ich Hilfe brauche. Aber vielleicht kannst du mir sagen, wie ich das anstelle. So paar Hinweise. Dann bastle ich mal.

Muss ich dann das "Bild aus dem Original" schneiden oder wie?

22.12.2007, 20:36

Zitat:

Zitat von Hagen

Muss ich dann das "Bild aus dem Original" schneiden oder wie?

Jap, bzw. den Hintergrund wegschneiden, kommt drauf an, was einfacher ist.

Poste einfach mal das Bild, das du bearbeiten willst...

Alex

Hagen · 22.12.2007, 20:40

Hab ja noch keins^^ Aber ich schau mir das mal an. Was hat es mit diesem "fürs Web speichern" da auf sich?

22.12.2007, 20:46

Zitat:

Zitat von Hagen

Hab ja noch keins^^ Aber ich schau mir das mal an. Was hat es mit diesem "fürs Web speichern" da auf sich?

Puuuh, das gibt's glaube ich erst ab CS3 und ist, glaube ich, für Slices und animierte GIFs da.

Alex

//EDIT: Achte darauf, dass der Transparente Bereich so ein Caromuster aufzeigt und keine Ebene mit dem Namen Hintergrund existiert:
http://666kb.com/i/aulhgmhm40gmx72xy.png

Bei Datei > Neu musst du als Hintergrundinhalt "Transparent" wählen.

http://666kb.com/i/aulhkmdndnqa9n3qe.png

tele · 22.12.2007, 20:46

Hallo,

pass doch mal bitte auf, in welchem Unterbereich du solche Fragen postest. Im Tutorials Berech werden nur __umfrangreiche__ Anleitungen gesammelt.

Gruß

tele

dr_mordio · 23.12.2007, 03:46

manchmal gibts auch probleme mit der transparenz.
gerade alte IEs haben probleme mit PNG-transparenzen

und Gifs sind auch nicht immer problemfrei.
manchmal gibt es einen 1 pixel breiten rand zwischen bild und transparentem hintergrund.

daher gibt es noch methode 3:
screenschot von der seite machen wo das bild hin soll. (z.b. hier bei TPC ist links ein leichter farbverlauf von 229er grau zu 241er grau und nicht UNI-farbig)

dann einfach einen teil des bereiches kopieren und größenmäßig anpassen und als Hintergrund für das aktuelle wunschbild nehmen, welches man vorher wie oben freistellt.

so hab ich es z.b. gemacht

ist zwar nicht weniger aufwändig, aber dafür auf allen browsern perfekt

MfG
Alex

Hagen · 23.12.2007, 10:33

Also ich habe da jetzt ein Bild. Das vordere Männchen sollte mit perfektem Rand sein und sich eben auf jedem Hintergrund anpassen. Maximale Größe wäre 100x100 Pixel.

Wie stelle ich das an? Will das ja auch lernen^^

http://www.hitmangames.de/Specials/c...ike_source.jpg

Lite · 23.12.2007, 10:57

Ausschneiden, verkleinern, auf Transparenten Hintergrund pappen und dann als .png speichern

Hagen · 23.12.2007, 11:16

Das Männchen ausschneiden? Das ist doch kaum machbar, wenns ordentlich werden soll... Und wie mache ich das mit dem transparenten Hintergrund? Ich habe Photoshop seit ca. 10h und habe noch 9h geschlafen

Kannst du das bitte erklären? Vielleicht mit Screenshot.

redfalcon · 23.12.2007, 11:40

Zitat:

Zitat von Hagen

Das Männchen ausschneiden? Das ist doch kaum machbar, wenns ordentlich werden soll... Und wie mache ich das mit dem transparenten Hintergrund? Ich habe Photoshop seit ca. 10h und habe noch 9h geschlafen

Kannst du das bitte erklären? Vielleicht mit Screenshot.

100% ordentlich wird das eh nicht gehen. Du wirst wohl (z.B., gibt mehrere Möglichkeiten) mit dem magnetischen Lasso den Typ nach und nach ausschneiden müssen. Dann rauskopieren und in ein neues Bild einfügen.

Hier wirds ganz gut erklärt:
Photoshop Tutorial: Freistellen von Bildern mit Pfaden*::*[Traum-Projekt.com]

Hagen · 23.12.2007, 11:46

Gibt es keinen Ersatz für dieses Lasso? Das habe ich entdeckt....
Also mit Ersatz meine ich so eine Randerkennung. Kenne ich von Picture It. Habe ich aber leider nicht mehr.

23.12.2007, 12:02

Zitat:

Zitat von dr_mordio

daher gibt es noch methode 3:
screenschot von der seite machen wo das bild hin soll. (z.b. hier bei TPC ist links ein leichter farbverlauf von 229er grau zu 241er grau und nicht UNI-farbig)

Mach mal einen Rechtsklick auf mein Bild und dann "Grafik anzeigen". Ich hab' genau diese Methode innerhalb dieser Kurven verwendet, da sonst die Animation sehr mies ausschauen würde.

Wegen dem Counter-Strike: Source Bild, würde ich mal da gucken:
Render Gallery - Clantemplates.com
http://www.clantemplates.com/renders...rce_normal.png

"Grafik speichern unter" und dann mit Photoshop öffnen und das unnötige wegschneiden.

Alex

PS: So könnte das (auf die Schnelle) ausschauen:
http://666kb.com/i/aum47itnj8m2crr73.png

Hagen · 23.12.2007, 12:54

OK, ich beschäftige mich mal mit dem Programm. Danke an alle, die mir geholfen haben!