Exportera SVG-filer

  1. Användarhandbok för Adobe Animate
  2. Introduktion till Animate
    1. Nyheter i Animate
    2. Visuell ordlista
    3. Systemkrav för Animate
    4. Tangentbordsgenvägar för Animate
    5. Arbeta med flera filtyper i Animate
  3. Animering
    1. Grunderna vid animering i Animate
    2. Så här använder du bildrutor och nyckelbildrutor i Animate
    3. Animering bildruta för bildruta i Animate
    4. Arbeta med klassiska interpolerade animeringar i Animate
    5. Pensel
    6. Rörelseguide
    7. Rörelseinterpoleringar och ActionScript 3.0
    8. Om animeringar med rörelseinterpolering
    9. Animeringar med rörelseinterpolering
    10. Skapa en animering med rörelseinterpolering
    11. Använda nyckelbildrutor för egenskaper
    12. Animera placering med en interpolering
    13. Så här redigerar du rörelseinterpoleringar med rörelseredigeraren
    14. Redigera rörelsebanan för en interpolerad animering
    15. Ändra rörelseinterpoleringar
    16. Lägga till anpassade övergångar
    17. Skapa och använda förinställda rörelser
    18. Konfigurera interpoleringsintervall för animeringar
    19. Arbeta med rörelseinterpoleringar sparade som XML-filer
    20. Rörelseinterpoleringar jämfört med klassiska interpoleringar
    21. Forminterpolering
    22. Använda animeringar med benverktyget i Animate
    23. Arbeta med figurriggning i Animate
    24. Så här använder du maskeringslager i Adobe Animate
    25. Så här arbetar du med scener i Animate
  4. Interaktivitet
    1. Så här skapar du knappar med Animate
    2. Konvertera Animate-projekt till andra dokumenttypsformat
    3. Skapa och publicera HTML5 Canvas-dokument i Animate
    4. Lägga till interaktivitet med kodfragment i Animate
    5. Skapa anpassade HTML5-komponenter
    6. Använda komponenter i HTML5 Canvas
    7. Skapa anpassade komponenter: Exempel
    8. Kodfragment för anpassade komponenter
    9. God praxis - annonsera med Animate
    10. Redigera och publicera VR
  5. Arbetsyta och arbetsflöde
    1. Skapa och hantera målarpenslar
    2. Använda Google Fonts i HTML5 Canvas-dokument
    3. Använda Creative Cloud Libraries och Adobe Animate
    4. Använda scen- och verktygspanelerna i Animate
    5. Arbetsflöde och arbetsyta i Animate
    6. Använda webbteckensnitt i HTML5 Canvas-dokument
    7. Tidslinjer och ActionScript
    8. Arbeta med flera tidslinjer
    9. Ange inställningar
    10. Använda redigeringspanelerna i Animate
    11. Skapa tidslinjelager med Animate
    12. Exportera animeringar för mobilprogram och spelplattformar
    13. Flytta och kopiera objekt
    14. Mallar
    15. Söka och ersätta i Animate
    16. Ångra, gör om och panelen Historik
    17. Kortkommandon
    18. Så här använder du tidslinjen i Animate
    19. Skapa HTML-tillägg
    20. Optimeringsalternativ för bilder och animerade GIF-filer
    21. Exportinställningar för bilder och GIF-filer
    22. Panelen Resurser i Animate
  6. Multimedia och video
    1. Omforma och kombinera grafikobjekt i Animate
    2. Skapa och arbeta med symbolinstanser i Animate
    3. Bildkalkering
    4. Så här använder du ljud i Adobe Animate
    5. Exportera SVG-filer
    6. Skapa videofiler för användning i Animate
    7. Så här lägger du till en video i Animate
    8. Arbeta med videoreferenspunkter
    9. Rita och skapa objekt med Animate
    10. Omforma linjer och former
    11. Linjer, fyllningar och övertoningar med Animate CC
    12. Arbeta med Adobe Premiere Pro och After Effects
    13. Färgpaneler i Animate CC
    14. Öppna Flash CS6-filer i Animate
    15. Arbeta med klassisk text i Animate
    16. Placera grafik i Animate
    17. Importerade bitmappar i Animate
    18. 3D-grafik
    19. Arbeta med symboler i Animate
    20. Rita linjer och former med Adobe Animate
    21. Arbeta med bibliotek i Animate
    22. Exportera ljud
    23. Markera objekt i Animate CC
    24. Arbeta med Illustrator AI-filer i Animate
    25. Tillämpa mönster med sprejpenseln
    26. Använda blandningslägen
    27. Ordna objekt
    28. Automatisera uppgifter med kommandomenyn
    29. Flerspråkig text
    30. Använda kameran i Animate
    31. Använda Animate med Adobe Scout
    32. Arbeta med Fireworks-filer
    33. Grafikfilter
    34. Ljud och ActionScript
    35. Ritinställningar
    36. Rita med ritstift
  7. Plattformar
    1. Konvertera Animate-projekt till andra dokumenttypsformat
    2. Stöd för anpassade plattformar
    3. Skapa och publicera HTML5 Canvas-dokument i Animate
    4. Skapa och publicera ett WebGL-dokument
    5. Så här paketerar du AIR för iOS-program
    6. Publicera AIR for Android-program
    7. Publicera för Adobe AIR för datorprogram
    8. Inställningar för ActionScript-publicering
    9. God praxis – organisera ActionScript i ett program
    10. Så här använder du ActionScript med Animate
    11. God praxis – riktlinjer för hjälpmedel
    12. Hjälpmedel på arbetsytan i Animate
    13. Skriva och hantera skript
    14. Aktivera stöd för anpassade plattformar
    15. Översikt över stöd för anpassade plattformar
    16. Skapa hjälpmedelsanpassat innehåll
    17. Arbeta med plugin-program för anpassade plattformar
    18. Felsöka ActionScript 3.0
    19. Aktivera stöd för anpassade plattformar
  8. Exportera och publicera
    1. Så här exporterar du filer från Animate CC
    2. OAM-publicering
    3. Exportera SVG-filer
    4. Exportera bilder och video med Animate
    5. Publicera AS3-dokument
    6. Exportera animeringar för mobilprogram och spelplattformar
    7. Exportera ljud
    8. Exportera QuickTime-videofiler
    9. Styra extern videouppspelning med ActionScript
    10. God praxis – tips för att skapa innehåll på mobila enheter
    11. God praxis – videokonventioner
    12. God praxis – riktlinjer för utveckling av SWF-program
    13. God praxis – strukturera FLA-filer
    14. De bästa sätten att optimera FLA-filer för Animate
    15. Inställningar för ActionScript-publicering
    16. Ange publiceringsinställningar för Animate
    17. Exportera projektorfiler
    18. Exportera bilder och animerade GIF-filer
    19. Publiceringsmallar för HTML
    20. Arbeta med Adobe Premiere Pro och After Effects
    21. Dela och publicera animeringar snabbt

Vad är SVG?

SVG (Scalable Vector Graphics) är ett XML-språk för att beskriva tvådimensionella bilder. SVG-filer är upplösningsoberoende HiDPI-bilder för webben, tryck och mobilenheter i ett kompakt format. Du kan inkludera CSS i en SVG-fil, och stödet för skript och animeringar innebär att SVG är en integrerad del av webbplattformen.

Vissa vanliga bildformat för webben, som GIF, JPEG och PNG, är utrymmeskrävande och har oftast låg upplösning. SVG-formatet erbjuder betydligt mer, eftersom du kan beskriva bilder med vektorformer, text och filtereffekter. SVG-filer är kompakta och högkvalitativa bilder som passar webben och handenheter med resursbegränsningar. Du kan förstora visningen av en SVG-bild på skärmen utan att skärpa, detaljer eller klarhet förloras. Dessutom ger SVG överlägset stöd för text och färger, vilket garanterar att du ser bilderna som de visas på scenen. SVG-formatet är helt XML-baserat och är fördelaktigt för både utvecklare och andra användare.

Obs!

Nu kan du exportera SVG-filer från Animate utan några oönskade definitioner och ID som skapas. Innehållet i SVG har förbättrats i Animate 19.1. Detta exportalternativ höjer kvaliteten av SVG-filer som importeras i Character Animator.

Arbetsflödet för SVG-export i Animate

I Animate kan du exportera till SVG-format, version 1.1. Du kan skapa visuellt utförlig grafik med de kraftfulla designverktygen i Animate och sedan exportera till SVG-format.

I Animate kan du exportera markerade bildrutor och nyckelbildrutor i en animering. Och eftersom den exporterade grafiken är av vektortyp förblir bildens upplösning hög, även om den skalas till olika storlekar.

Funktionen för SVG-export ersätter den tidigare funktionen för FXG-export (borttagen från Animate (juni 2013)). Du kommer att märka att SVG-exporten och kvaliteten på dess utdata är betydligt bättre. Jämfört med FXG är innehållsförlusten dessutom minimal i SVG.

Grafik med filtereffekter

Med SVG kanske inte filtereffekter visas på exakt samma sätt som i Animate, eftersom det inte finns 1:1-mappning mellan filtren i Animate och SVG. Animate utnyttjar emellertid kombinationer av olika primitiva filter som finns i SVG för att simulera en liknande effekt.

Hantera flera symboler

SVG-exporten hanterar problemfritt flera symboler, utan att något innehåll går förlorat. Utdata påminner mycket om grafiken på scenen i Animate.

Exportera teckningar i SVG-format

  1. Dra eller flytta spelhuvudet i Animate till önskad bildruta.
  2. Välj Arkiv > Exportera > Exportera bild. Du kan också välja Arkiv > Publiceringsinställningar (välj alternativet SVG-bild i delen Andra format).
  3. Ange eller bläddra till den plats där du vill spara SVG-filen. Se till att du väljer SVG på menyn Filformat.
  4. Klicka på OK.
  5. I dialogrutan för SVG-export väljer du om du vill bädda in eller länka till SVG-filen.
    • Inkludera dolda lager Exporterar alla dolda lager i Animate-dokumentet. Om du avmarkerar Inkludera dolda lager hindras alla dolda lager (inklusive lager som är kapslade i filmklipp) från att exporteras till den resulterande SVG-filen. På så vis kan du lätt testa olika versioner av Animate-dokument genom att göra lager osynliga.
    • Bädda in: Bäddar in en bitmapp i SVG-filen. Använd det här alternativet om du vill bädda in bitmappar direkt i SVG-filen.
    • Länk: Skapar en länk till sökvägen för bitmappfiler. Använd det här alternativet när du inte vill bädda in bitmappar direkt i SVG-filen, utan länka till dem i stället. Om du markerar alternativet Kopiera bilder till en mapp och uppdatera länkar sparas bitmapparna i mappen images, som skapas på samma plats till vilken SVG-filen exporteras. Om alternativet Kopiera bilder till en mapp och uppdatera länkar inte är markerat refererar SVG-filen till bitmapparna på deras ursprungliga källplats. Om källplatsen för bitmapparna inte är tillgänglig bäddas de in i SVG-filen.
    • Kopiera bilder till /Bilder: Kopierar bitmappen till mappen /Bilder. Mappen /Bilder skapas på den plats SVG-filen exporteras till, om den inte redan finns.
    • Optimera för Character Animator: Du kan exportera SVG som fungerar bra med Character Animator.

  1. Klicka på OK.
Obs!

Visa funktioner i Animate stöds inte i SVG-formatet. Innehåll som skapas med dessa funktioner tas bort eller ändras till en funktion som stöds vid export. Du hittar mer information i den här artikeln.

Du kan också använda dialogrutan Publiceringsinställningar för att exportera SVG-filer från Animate (Arkiv >Publiceringsinställningar). Välj SVG i delen Andra format om du vill exportera SVG-filer.

Obs!

Du bör bara visa SVG-filer i moderna webbläsare med de senaste uppdateringarna. Det beror på att vissa grafikfilter och färgeffekter kanske inte återges korrekt i äldre versioner av webbläsare, som Internet Explorer 9.

Utbyta SVG-filer med Adobe Illustrator

I Animate kan du utbyta innehåll med Adobe Illustrator. Det här arbetsflödet ersätter funktionen för FXG-export som har tagits bort från Animate (13.0). Du kan exportera SVG-filer från Animate och importera dem i Adobe Illustrator. Mer information om att använda SVG-filer i Adobe Illustrator finns i det här hjälpavsnittet.

Använd det här arbetsflödet om du vill göra små redigeringar av teckningar och lägga till detaljer. Du kan också använda Illustrator för att lägga till effekter, t.ex. skuggning, i teckningar.

Så här redigerar du SVG-filer i Adobe Illustrator och använder det redigerade innehållet i Animate:

  1. Exportera till SVG i Animate.
  2. Redigera teckningen genom att öppna SVG-filen med Adobe Illustrator.
  3. Spara SVG-filen som en .ai-fil och importera den till Animate. Mer information om hur du använder Illustrator-filer i Animate.

Adobes logotyp

Logga in på ditt konto