Jak vytvářet obrázky SVG: 13 kroků (s obrázky)

Obsah:

Jak vytvářet obrázky SVG: 13 kroků (s obrázky)
Jak vytvářet obrázky SVG: 13 kroků (s obrázky)

Video: Jak vytvářet obrázky SVG: 13 kroků (s obrázky)

Video: Jak vytvářet obrázky SVG: 13 kroků (s obrázky)
Video: PNG vs JPG 2024, Duben
Anonim

Škálovatelná vektorová grafika (SVG) umožňuje více interaktivních prvků na webových stránkách, aniž by využívala tolik šířky pásma jako jiné obrazové formáty jako JPEG nebo GIF, což je činí ideální pro web design. Některé programy digitální ilustrace, jako je Adobe Illustrator, nabízejí možnosti SVG a existují online webové stránky převaděče SVG, na které je přístup zdarma. Tento wikiHow vám ukáže, jak vytvořit vlastní obrázky SVG.

Kroky

Metoda 1 ze 2: Použití převaděče Convertio-j.webp" />
Vytvořte obrázky Svg Krok 1
Vytvořte obrázky Svg Krok 1

Krok 1. Otevřete webový prohlížeč a přejděte na

Tím se dostanete na stránku převaděče Convertio-j.webp

Vytvořte obrázky Svg Krok 2
Vytvořte obrázky Svg Krok 2

Krok 2. Vyberte zdroj pro svůj obrázek JPG

V horní části nabídky převaděče byste měli vidět červený panel nástrojů se seznamem různých zdrojů, ke kterým máte přístup, a nahrát soubor obrázku JPG, který chcete převést do SVG.

Vytvořte obrázky Svg Krok 3
Vytvořte obrázky Svg Krok 3

Krok 3. Přejděte na soubor, který chcete převést

Jakmile vyberete zdroj, mělo by se objevit dialogové okno s knihovnou složek vašeho počítače. Odtud přejděte do složky se souborem, který chcete převést, a vyberte soubor.

Vytvořte obrázky Svg Krok 4
Vytvořte obrázky Svg Krok 4

Krok 4. Klikněte na Převést

Po nahrání souboru se v pravém dolním rohu obrazovky nabídky zobrazí červené tlačítko. Spustí se proces převodu, který může v závislosti na velikosti souboru trvat několik minut.

Vytvořte obrázky Svg Krok 5
Vytvořte obrázky Svg Krok 5

Krok 5. Klikněte na Stáhnout

Po dokončení převodu souboru se vpravo od názvu souboru v nabídce převaděče zobrazí modré tlačítko. Jakmile na něj kliknete, obrázek se poté stáhne do vašeho počítače jako soubor SVG.

Metoda 2 ze 2: Použití aplikace Adobe Illustrator

Vytvořte obrázky Svg Krok 6
Vytvořte obrázky Svg Krok 6

Krok 1. Otevřete Adobe Illustrator

Adobe Illustrator je aplikace pro grafický design, která vám umožňuje vytvářet vlastní umění pomocí řady nástrojů a funkcí.

Vytvořte obrázky Svg Krok 7
Vytvořte obrázky Svg Krok 7

Krok 2. Vytvořte si obrázek

Jakmile otevřete Illustrator, můžete na panelu nástrojů na levé straně obrazovky vybrat kterýkoli z nástrojů, abyste mohli začít s návrhem obrázku.

Vytvořte obrázky Svg Krok 8
Vytvořte obrázky Svg Krok 8

Krok 3. Aplikujte efekty SVG na určité vrstvy obrázku

Pokud chcete do svého obrázku přidat libovolné vlastní efekty, můžete vybrat vrstvu a poté kliknout Účinek > SVG filtry > Použijte filtr SVG. Poté stačí kliknout na Upravit filtr SVG tlačítko, upravte výchozí kód a klikněte OK pro uložení efektů SVG.

Vytvořte obrázky Svg Krok 9
Vytvořte obrázky Svg Krok 9

Krok 4. Klikněte na kartu Soubor

Toto se nachází v levém horním rohu obrazovky.

Vytvořte obrázky Svg Krok 10
Vytvořte obrázky Svg Krok 10

Krok 5. Vyberte v nabídce Exportovat

Aby byl váš soubor SVG připraven k prohlížení a používání mimo Illustrator, budete jej muset exportovat.

Můžete také vybrat Uložit jako…, i když tím se soubor uloží, takže jej bude možné prohlížet a upravovat pouze v Illustratoru.

Vytvořte obrázky Svg Krok 11
Vytvořte obrázky Svg Krok 11

Krok 6. Klikněte na Exportovat jako…

Tím se otevře nová nabídka, kde můžete exportovat soubor z aplikace Illustrator do formátu podle vašeho výběru.

Můžete také vybrat Export pro obrazovky… aby byl váš obrázek SVG uložen způsobem, ke kterému je přístup na zařízeních iOS nebo Android.

Vytvořte obrázky Svg Krok 12
Vytvořte obrázky Svg Krok 12

Krok 7. Vyberte SVG v seznamu typů souborů

Illustrator nabízí řadu typů souborů, ze kterých si můžete vybrat, včetně souborů SVG připravených pro web.

Vytvořte obrázky Svg Krok 13
Vytvořte obrázky Svg Krok 13

Krok 8. Klikněte na Uložit

Váš obrázek bude nyní k dispozici pro použití jako soubor SVG.

Doporučuje: