Seltsame Artefakte in GIF-animiertem Bild mit Transparenz

Ich versuche, ein animiertes GIF einer Biene zu erstellen. Dieses Bild ist ein GIF mit Transparenz. Ich exportiere es in Adobe Animate CC 2018 mit solchen Einstellungen:

Geben Sie hier die Bildbeschreibung ein

aber als Ergebnis: Ich kann dieses Bild nicht im Web verwenden. Es gibt zu viele Artefakte (wenn der Hintergrund meiner Webseite eine Farbe hat):

Geben Sie hier die Bildbeschreibung ein

Was ich falsch mache?

Hier ist mein Animate-Projekt: https://www.dropbox.com/s/6s9qs8vow8bs8kn/bee.fla?dl=0 (.fla)

Haben Sie versucht, mit nur zwei (oder vier) Farben zu exportieren? Transparenz und NUR schwarz?
@SZCZERZOKŁY ja, es ist dasselbe
Da Sie sagen, dass es auf einer Website läuft ... Je nach Anwendungsfall möchten Sie es möglicherweise in eine HTML5-Leinwand oder als Sprite-Sheet-Animation exportieren. Leider habe ich keine Ahnung, welche Art von Unterstützung Adobe Animate für diese hat. Ich bin mir ziemlich sicher, dass es eine Art Canvas-Export hat ...

Antworten (1)

Einige mögliche Lösungen:

  1. Stellen Sie die transparente Matte- Farbe auf die gleiche wie den Hintergrund der Webseite ein.

matte Einstellung

  1. Vermeiden Sie Antialiasing bei der Animation, das bedeutet verpixelten Rand, klingt hart, aber es ist eine gute Lösung. Dazu benötigen Sie eine Datei mit guter Auflösung, um Ihre Animation zu entwickeln und die Ränder zu simulieren. Vor einiger Zeit verwendete Kenzo auf ihrer Webseite ein sehr gut gemachtes animiertes GIF über statischen Bildern ohne weiche Ränder. Hier ist das Ergebnis:

Kenzo

  1. Verwenden Sie eine APNG- oder PNG-Animationsdatei . Der Nachteil ist, dass es nicht in allen Browsern unterstützt wird, einige von ihnen zeigen ein statisches Bild an. Hier ist eine Liste: https://caniuse.com/#feat=apng . Bei PNG- und APNG-Dateien können Sie die Transparenz oder den Alphakanal beibehalten. Dieses Bild ist dasjenige, das Wikipedia bei der PNG-Animationsdefinition verwendet .

PNG