5 kroků k vytvoření slovního mraku

Ahoj kluci a holky,

v dnešním článku si společně vytvoříme zajímavý grafický prvek, který může zkrášlit Vaše webové stránky. Tomuto grafickému prvku se říká slovní mrak (v anglickém originále wordcloud). Na jeho vytvoření použijeme webovou aplikaci, která základní obrázky slovních mraků generuje zdarma. Stačí v ní provést 5 kroků a můžeme vytvořit třeba následující slovní mrak.

Pojďte si nyní vytvořit Váš vlastní slovní mrak!
Zadejte adresu webové aplikace: https://wordart.com/create a dostanete se přímo na stránku, kde slovní mrak společně vytvoříme. 

1. krok: SLOVA (anglicky WORDS) 

V tomto kroku je třeba vytvořit seznam slov, které budou do mraku vložené. Můžete je přímo zapsat v aplikaci nebo je importovat ze souboru. V našem příkladu použijeme jen několik slov, bude tedy stačit slova dopsat do políček, které jsou zvýrazněné na následujícím obrázku. 

První tři slova je třeba přepsat vždy kliknutím do políčka. Další slova se vkládají přes spodní řádek, kde je uvedeno Type in a new word, tzn. napiš nové slovo.  Klikněte tedy do tohoto pole, napište slovo a potvrďte klávesou Enter. Tímto způsobem vytvořte seznam asi 5 – 10 slov. V našem ukázkovém příkladu použiju značky jazyka HTML, vy můžete vytvořit vlastní seznam slov, např. jména Vašich kamarádů.

2. krok: TVARY (anglicky SHAPES) 

Klikněte vlevo dole na políčko SHAPES a rozbalí se Vám možnosti různých tvarů, které můžete pro svůj slovní mrak použít. Tvar vyberte z nabídky a klikněte na něho. U vybraného tvaru se zobrazí zelené ozubené kolečko. 

Nyní už můžete zkusit slovní mrak vygenerovat pomocí červeného tlačítka Visualize.

3. krok: FONTY (anglicky FONTS) 

Klikněte vlevo dole na políčko FONTS a rozbalí se Vám možnosti fontů. Vyberte písmo, které se Vám líbí a klikněte na něho. Vybraný font je podbarvený modře. 

Po výběru fontu můžete opět vygenerovat slovní mrak pomocí tlačítka Visualize. Generování je možné spustit kdykoliv během tvorby a promítnou se do něho všechny nastavené možnosti.

4. krok: ROZLOŽENÍ (anglicky LAYOUT) 

Klikněte vlevo dole na políčko LAYOUT a rozbalí se Vám možnosti rozvržení slov do slovního mraku. V tomto oddílu máme více možností. Po každé změně nastavení můžete vygenerovat slovní mrak přes tlačítko Visualize jako v předchozích krocích. 

Nejdříve, jak budou slova do mraku rozmístěné, např. horizontálně, vertikálně nebo náhodně. Vybírejte podle obrázků rozmístění. . 

Počet slov (words amount) – tady bych nechala hodnotu Auto (tzn. aplikace zvolí sama počet slov). 

Hustotu (density) – zde se zadává procento hustoty slov, můžete nechat výchozí nastavení 20% nebo zase experimentovat s různou hustotou slov.

Poslední možnost slova i uvnitř písmene (wodrs inside letter) nechte zaškrtnutou, pokud chcete mít slova i uvnitř písmene. 

5. krok: STYL (anglicky STYLE) 

Klikněte vlevo dole na políčko STYLE a rozbalí se Vám možnosti, jak upravit styl slovního mraku. V tomto oddílu je opět více možností. 

Barva mraku (words colors) – možnost Shape znamená, že se použijí barvy podle zvoleného tvaru nebo je možné vybrat Custom a zvolit barvy dle svého výběru.

Zvýraznění barvy (color emphasis) – pomocí procent se nastavuje zvýraznění barvy, opět je dobré vyzkoušet různé hodnoty a vygenerovat výsledek pomocí Visualize.

Barva pozadí (background color) – kliknutí na čtvereček vyberte barvu pozadí.

Obrázek na pozadí (backroung image) – podobné jako u zvýraznění barvy. Čím víc procent, tím víc je zvýrazněná barva zvoleného tvaru.

Poslední dvě možnosti rychlost animace (animation speed) a barvy pro animace (rollover text color a box color) není třeba upravovat, protože soubor s animací již není zdarma ke stažení jako obrázek.

Výborně! Výsledný slovní mrak si stáhneme do počítače přes tlačítko Download a možnost Standard JPEG. 

Máme hotovo! Pochlubte se se svým výsledkem a zašlete mi Váš slovní mrak na e-mail janca@webohratky.cz. 

Join our Mailing list!

Get all latest news, exclusive deals and academy updates.