Wie einen "Bevel-Effekt" programmieren?



  • durito schrieb:

    k.A. was n'Bevel-Effekt ist 🙂
    Wozu brauchst Du das? Für ne Textur? dynamisch? Wenn ja, sowas wie auf dem Bild kriegst Du mit ner Normalmap hin, d.h. in einer zusätzlichen Textur speicherst Du die Normalen auf Deiner Textur. Daraus kann das Licht für jeden Pixel auf der Textur berechnet werden.

    siehe http://www.green-coding.de/bevel1.jpg :

    solche Grafiken (oder shapes) sollen dynamisch mit einem bevel-effekt versehen werden.



  • Aufgrund einer Lichtquelle, die sich ändern kann? ->Normalmap (OpenGL/D3D)
    sonst: Weiss auch nicht 🙂



  • Liest du eigentlich hin und wieder die Anworten, oder willst du einfach nur noch'n bissl dein Bild posten?

    Bye, TGGC (Dem beste BdT)



  • Mit TGGCs Vorschlag sollte es doch gehen.



  • TGGC schrieb:

    Liest du eigentlich hin und wieder die Anworten, oder willst du einfach nur noch'n bissl dein Bild posten?

    Bye, TGGC (Dem beste BdT)

    Natürlich, es macht freude das Bild zu posten 😡 Wenn ich damit deine Gefühle verletzt haben soll dann entschuldige ich mich! Warum schreibst du solche Beiträge??

    Ich poste das Bild weil ich glaube bisher hat noch niemand wirklich verstanden was das Problem ist.

    Dein Zitat: Ich denke mal, die erkennen einfach die Kante des Objekts, erzeugen dann eine Rand mit n Pixeln und beleuchten den je nach Winkel.

    In Etwa ist das Richtig, Kante könnte ich noch detektieren, aber die Beleuchtung des Randes würde Probleme bereiten.



  • interpreter schrieb:

    Mit TGGCs Vorschlag sollte es doch gehen.

    Die Kanten könnte ich herausfinden, nur wie den Lichteinfall berechnen?



  • vielleicht könntest du den Rand, den du ermittelt hast, aus den Bilddaten extrahieren und in ein dreidimensionales Objekt umrechnen, und dann die Beleuchtung ermitteln.
    😃
    Das klingt eigentlich total abenteuerlich und wird warscheinlich auch nicht so gemacht. Aber einen Versuch ist es wert 👍 😉



  • Gewöhn Dich an solche Beiträge hier.. *g*
    Aber eigentlich würds tatsächlich reichen, einmal das Bild zu posten..

    Was willst Du denn damit machen? n'Spiel? Mal überlegt, ob Du diese Arbeit in Deinem Projekt nicht an OpenGL/D3D abgeben kannst? Wie siehts mit der Lichtquelle aus, ist die dynamisch? etc, etc...



  • Uebrigens, da faellt mir ein, hab mal n'Bumpmap-Generator geschrieben. Hab Dein Bild mal durchrattern lassen und diese normalmap rausbekommen:

    http://home.zhwin.ch/~bcd/bump.JPG

    Das waer doch schon mal was..



  • randa schrieb:

    vielleicht könntest du den Rand, den du ermittelt hast, aus den Bilddaten extrahieren und in ein dreidimensionales Objekt umrechnen, und dann die Beleuchtung ermitteln.
    😃
    Das klingt eigentlich total abenteuerlich und wird warscheinlich auch nicht so gemacht. Aber einen Versuch ist es wert 👍 😉

    Vermutlich wäre das eine Lösung, aber vermutlich auch zu aufwendig. Trotzdem danke.



  • durito schrieb:

    Uebrigens, da faellt mir ein, hab mal n'Bumpmap-Generator geschrieben. Hab Dein Bild mal durchrattern lassen und diese normalmap rausbekommen:

    http://home.zhwin.ch/~bcd/bump.JPG

    Das waer doch schon mal was..

    hi,

    danke für die "geBumbmappte" Grafik, irgendsowas in der Richtung wirds wohl werden.

    Mittels OpenGL zu implementieren hatte ich nicht vor, es wäre einfach zu aufwendig, aus der Shape ein 3D Objekt generieren, die Kanten "Fasen" oder "Abflachen" und dann den Lichteinfall berechnen und daraus wieder eine Bitmap generieren.

    Das ganze wird jegendlich dazu dienen Hintergründe für beliebige Windowsfenster zu generieren, quasi Rahmen und Kanten durch den Beveleffekt zu berechnen, wobei diese Formen allerdings beliebig sein können.
    Falls du Photoshop hast kannst du dir das ja mal angucken,
    die Funktion gibts im Layer-Fenster und heißt "Abgeflachte Kanten und..."
    Was denen im Photoshop möglich ist sollte man doch auch programmieren können.



  • Naja, obwohl: Um die Beleuchtung für den entsprechenden Rand zu bekommen, kannst dus auch ganz einfach machen: Du hast das licht, und die Ränder kennst du auch, zusammen mit dem gesamten Bild. Nun kannst du auf zweidimensionaler Ebene checken, ob der Lichvektor das Bild bereits schneidet, bevor er zum Rand hinkommt. Wenn ja, dann ist der Rand nicht beleuchtet, da das Licht den Rand nicht erreicht und vorher irgendwo das Bild berührt hat. Wenn er es nicht schneidet, dann gibts kein hindernis zwischen Rand und Licht, und du kannst den entsprechenden Randbereich hell machen.
    Natürlich funktioniert das nicht für Licht, das direkt von oben einstrahlt, dann müsstest du es schon dreidimensional machen. Wenn du andere Hindernisse zwischen Bild und Licht berücksichtigen willst, musst du das Pixelgenau machen. In dem Fall müsstest du auch nur die Randpixel des Bildes testen, und keinen Pixel innerhalb des Bildes.
    Für dreidimensional würde ich vorschlagen, dass du für jeden Pixel des Bildes eine Höheninformation einträgst und damit den Winkel zwischen Licht und Pixel bestimmst, also ähnlich dem Phong-Shading.



  • randa schrieb:

    Naja, obwohl: Um die Beleuchtung für den entsprechenden Rand zu bekommen, kannst dus auch ganz einfach machen: Du hast das licht, und die Ränder kennst du auch, zusammen mit dem gesamten Bild. Nun kannst du auf zweidimensionaler Ebene checken, ob der Lichvektor das Bild bereits schneidet, bevor er zum Rand hinkommt. Wenn ja, dann ist der Rand nicht beleuchtet, da das Licht den Rand nicht erreicht und vorher irgendwo das Bild berührt hat. Wenn er es nicht schneidet, dann gibts kein hindernis zwischen Rand und Licht, und du kannst den entsprechenden Randbereich hell machen.
    Natürlich funktioniert das nicht für Licht, das direkt von oben einstrahlt, dann müsstest du es schon dreidimensional machen. Wenn du andere Hindernisse zwischen Bild und Licht berücksichtigen willst, musst du das Pixelgenau machen. In dem Fall müsstest du auch nur die Randpixel des Bildes testen, und keinen Pixel innerhalb des Bildes.
    Für dreidimensional würde ich vorschlagen, dass du für jeden Pixel des Bildes eine Höheninformation einträgst und damit den Winkel zwischen Licht und Pixel bestimmst, also ähnlich dem Phong-Shading.

    Bei "geschlossenen" Shapes würde das vermutlich funktionieren. Bei Shapes mit "Löchern" (Siehe Grafik die ich ja nimmer posten darf), würde der Lichstrahl (oder Vektor) wieder seine gültigkeit erreichen sobald er wieder einen freien (transparenten) bereich des Bildes gekreuzt hat. So mit darf der dann den nächsten Rand den er schneidet wieder aufhellen.

    Das wäre zumindest mal einen Versuch wert 🙂 danke vielmals



  • ich denk mal das schwierigste wird es sein, die Randbereiche zu bestimmen. Das mit dem Licht ist imho recht einfach.
    Wenn du das mit den Randbereichen mal gelöst hast, poste mal hier, mich würd das interessieren 🙂
    Ich hätte da nämlich auch Lösungsvorschläge 😃

    Edit: Ach ja, wenn du den Beleuchtungseffekt so haben willst, wie beim Link den du gepostet hast, musst du sowieso eine Phong-ähnliche Technik anwenden, damit die Beleuchtung weich und fließend ist.



  • randa schrieb:

    ich denk mal das schwierigste wird es sein, die Randbereiche zu bestimmen. Das mit dem Licht ist imho recht einfach.
    Wenn du das mit den Randbereichen mal gelöst hast, poste mal hier, mich würd das interessieren 🙂
    Ich hätte da nämlich auch Lösungsvorschläge 😃

    Edit: Ach ja, wenn du den Beleuchtungseffekt so haben willst, wie beim Link den du gepostet hast, musst du sowieso eine Phong-ähnliche Technik anwenden, damit die Beleuchtung weich und fließend ist.

    da meinen shapes eine transparente Farbe zugrunde liegt ist vieleicht gar nicht notwendig die "Kanten" herauszufinden. Werd mich heute Abend mal dahinter klemmen, aber frühstens morgen wieder posten. Thx



  • Newton1976 schrieb:

    durito schrieb:

    Uebrigens, da faellt mir ein, hab mal n'Bumpmap-Generator geschrieben. Hab Dein Bild mal durchrattern lassen und diese normalmap rausbekommen:

    http://home.zhwin.ch/~bcd/bump.JPG

    Das waer doch schon mal was..

    hi,

    danke für die "geBumbmappte" Grafik, irgendsowas in der Richtung wirds wohl werden.

    Mittels OpenGL zu implementieren hatte ich nicht vor, es wäre einfach zu aufwendig, aus der Shape ein 3D Objekt generieren, die Kanten "Fasen" oder "Abflachen" und dann den Lichteinfall berechnen und daraus wieder eine Bitmap generieren.

    Das ganze wird jegendlich dazu dienen Hintergründe für beliebige Windowsfenster zu generieren, quasi Rahmen und Kanten durch den Beveleffekt zu berechnen, wobei diese Formen allerdings beliebig sein können.
    Falls du Photoshop hast kannst du dir das ja mal angucken,
    die Funktion gibts im Layer-Fenster und heißt "Abgeflachte Kanten und..."
    Was denen im Photoshop möglich ist sollte man doch auch programmieren können.

    Nene, ich will nicht sagen, Du sollst n'3D-Objekt erzeugen. Aber mit Hilfe einer 3D-Karte kannst Du einfacher die resultierende Farbe bei der Kante berechnen. Du musst nur ne Map haben, welche beinhaltet welches Pixel Deiner Grafik welche Normale hat (die normalmap), und anschliessend anhand des Licht-Vektors und der Normale die resultierende Farbe berechnen (das tut die GraKa für Dich).
    Naja, das ganze ist natürlich für dynamische Szenen gedacht, wo sich die Lichtquelle bewegt. Photoshop macht das bestimmt nicht so.



  • Schritt 1: such dir alle pixel raus,die den rand bilden und berechne ihre normalen.

    Schritt 2: teste jeden anderen pixel des objekts, ob er sich in einem bestimmten radius x(die breite deiner erhöhung) um einen randpixel befindet,für ihn berechnest du wieder die normale die sich aus dem richtungsvector zum nächsten randpixel und der normale des randpixels ergeben sollte.

    Schritt 3: normale lichtberechnung der randpixel,man hat ja jetzt die normalvectoren

    Schritt 4: fluchen weils so arsch langsam ist^^



  • Sorry, nur spätestens nach dem 2. Link hatte es ja wohl jeder gesehen.

    Ich denke mal folgendes: Du musst einfach nur die Normalen im Randstreifen senkrecht zum Verlauf des Bildes schwenken, je nachdem wie schräg der Rand sein soll. Dann Normale x Lichteinfall, und darauf Kosinusgesetz (lamberts law?).

    Bye, TGGC \-/



  • Ich hab mal gegoogelt und nen Link zu ner bevel.c Datei gefunden, der Leider down war. Aber die Beschreibung war folgende:

    This is a math based bevel algorithm. It's very useful in 3D graphics as well as in 2D. Unlike the smooth effects that you usually see, this will often require meshing and tessalating.

    Ich weiß nicht inwiefern das nützlich ist. Tesselation ist doch irgendwie das aufteilen eines Polygons in verschiedene Faces oder?

    Ansonsten kann man sich ja auch den Source von TheGimp oder so runterladen und gucken, wie die es gemacht haben. 🙂



  • Erst mal danke für an alle für die vielen Antworten,
    daraus wird sich sicherlich etwas bewerstelligen lassen.

    thanks all

    Newton1976


Anmelden zum Antworten