<page xmlns="http://projectmallard.org/1.0/" type="topic" id="icons-and-artwork" xml:lang="cs">

  <info>

    <credit type="author">

      <name>Allan Day</name>

      <email>aday@gnome.org</email>

    </credit>

    <credit type="author">

      <name>Jakub Steiner</name>

    </credit>

    <include xmlns="http://www.w3.org/2001/XInclude" href="legal.xml"/>

    <desc>Jak vybrat a vytvořit ikony.</desc>   

  </info>

<title>Ikony a grafika</title>

Ikony hrají v uživatelském rozhraní důležitou roli. Výběr správné ikony je proto nezbytný, aby vaše aplikace byla dobře použitelná. Nezbytnou součástí aplikace je také ikona, která ji zastupuje a tvoří tak podstatnou část její identity.

<section id="using-icons">

<title>Používání ikon ve vašem uživatelském rozhraní</title>

Existuje řada situací, kdy je třeba se rozhodnout mezi použitím ikony a textového popisku, typicky třeba u tlačítek. Výhodou ikon je, že jsou menší a nevyžadují překlad do národních jazyků. Na druhou stranu, nesprávné použití ikony může ztížit, nebo dokonce až znemožnit, pochopení vašeho uživatelského rozhraní.

<list>

<item>
Ikony používejte, jen když je jejich význam všeobecně znám. Pokud běžně známá ikona není k dispozici, může být lepší místo ní použít textový popisek.

<list>

<item>
Zaběhnuté zvyklosti určují, které ikony uživatel pozná. Pokud si nejste jisti, sáhněte po ikonách, které jsou nejčastěji používané v jiných aplikacích.
</item>

<item>
Zvažte, které ikony mají smysl v konkrétním kontextu vaší aplikace. Uživatelé speciálních nástrojů jsou často navyklí na symboly specifické pro danou oblast.
</item>

</list></item>

<item>
Pamatujte, že některé ikony mají význam jen v souvislosti s jinými ikonami stejného typu. Například multimediální ikona pro zastavení je jen obyčejný čtverec a nemusí být uživatelem rozpoznána jako „stop“ bez dalších multimediálních ovládacích prvků (jako přehrát, pozastavit nebo přeskočit). Obdobně ikona pro odebrání ze seznamu je hodně abstraktní (mínus, což je jen jednoduchá čárka) a nemusí být uživatelem pochopena bez příslušné ikony „plus“.
</item>

</list>

</section>

<section id="stock-icons">

<title>Výběr standardních ikon GNOME</title>

GNOME poskytuje plnou sadu standardních ikon. Ty by měly být použity všude, kde se to hodí. Vytváření vlastních ikon se pokuste vyhnout, pokud to není absolutně nutné.

Když vybíráte, kterou ikonu použít, řiďte se jejím názvem. Název ikony by měl odrážet to, co se ikona snaží sdělit. Je to důležité pro uživatele, kteří používají čtečku obrazovky.

K vyhledání doporučených ikon můžete použít prohlížeč ikon GTK+.

<section id="color-vs-symbolic">

<title>Barevné vs. symbolické ikony</title>

GNOME 3 poskytuje dva typy ikon: plnobarevné a monochromatické symbolické. Pokyny v této příručce navádí, kdy který typ použít. Zde jsou obecné rady.

Plnobarevné ikony by měly být použity pro:

<list>

<item>
zařízení
</item>

<item>
typy souborů/typy MIME
</item>

<item>
(spouštěcí) ikony aplikací
</item>

</list>

Všechny ostatní ikony by měly používat symbolický styl. Navíc by symbolické ikony měly být použité vždy uvnitř:

<list>

<item>
tlačítek
</item>

<item>
seznamů
</item>

<item>
vstupních polí
</item>

<item>
když je pozadí poloprůhledné (například u ovládacích prvků překrývajících multimédia nebo u ovládacích prvků v režimu celé obrazovky)
</item>

</list>

</section>

</section>

<section id="application-icons">

<title>Ikony aplikací</title>

Každá aplikace by měla mít svoji jedinečnou a hezkou ikonu. Je to její tvář a první vizuální prvek, který z ní uživatel uvidí, když hledá nové aplikace. Na <link xref="application-basics">stránce se základy o aplikacích</link> jsou uvedeny podrobnosti o tom, co to aplikace je a kdy poskytnout její ikonu.

Protože ikony aplikací jsou předkládány ve velkých velikostech, původní rozměry pro styl Tango 48 × 48 px nebo jen SVG již dnes nedostačují (postrádají detaily). Je důležité, aby vaše aplikace měla ikonu 256 × 256 px. S příchodem displejů s vysokou hustotou bodů je doporučována i varianta 512 × 512 px.

<media type="image" mime="image/png" src="figures/icons/sizes.png"/>

I když to není úplně podstatné, stále existují místa, kde jsou ikony aplikací předkládány v menších velikostech. Abyste zachovali ostrost a kvalitu, je požadováno konkrétní vykreslení ve velikostech 48 × 48 px, 32 × 32 px, 24 × 24 px a 16 × 16 px. GNOME s historických důvodů šiří také ikony ve velikosti 22 × 22 px, ale není to vyloženě vyžadováno.

<media type="image" mime="image/png" src="figures/icons/sizes-small-24.png"/>

Chcete-li u nízkých rozlišení zachovat ostrost, zahoďte většinu detailů a použijte jednopixelovou čáru k obtažení obrysu objektu.

Více informací o návrhu ikony aplikace najdete níže v části Vlastní plnobarevné ikony.

</section>

<section id="custom-symbolic-icons">

<title>Vlastní symbolické ikony</title>

Symbolické ikony mají jednoduchou formu a jsou vykreslovány v mřížce 16 × 16 jednotek. Programově jsou pak škálovány a obarveny podle aktuálního uživatelského prostředí.

<list>

<item>
Při hledání vhodného symbolu ikony si určete jen jednu vlastnost a zaměřte se na to, co je pro myšlenku, kterou chcete zdělit jedinečné. Například, když popisujete činnost, která se provádí na obrázku, není třeba v každé ikoně opakovat myšlenku obrázku. Místo toho se zaměřte na jednotlivé konkrétní činnosti (např. otočení, štítek, zarovnání).
</item>

<item>
U symbolických ikon se vyhněte použití perspektivy, držte se čistě plošného zobrazení.
</item>

<item>
Vyplněné tvary lidské oko rozpoznává obecně lépe než pouhé obrysy.
</item>

<item>
Symbolické ikony jsou za běhu přebarvované, obdobně jako text, aby zapadly do kontextu. Ačkoliv jsou způsoby, jak „vystínovat“ části ikony pomocí průhlednosti nebo vytvořením dvoubarevného šrafovacího vzoru, snažte se těmto věcem vyhnout.
</item>

<item>
V případě, že je symbolické znázornění založeno na negativní ploše, ujistěte se, že bude správně vypadat i s prohozenými barvami. Například vymezení/zvýraznění objektivu fotoaparátu u ikony níže bude fungovat, jen když bude tenčí než objektiv samotný.
</item>

</list>

<media type="image" mime="image/svg" src="figures/icons/inverting.svg"/>

<section id="size-and-grid">

<title>Velikost a mřížka</title>

I když jsou ikony škálovatelné a měly by fungovat v libovolné velikosti, základní plátno má mřížku 16 × 16 bodů mřížky. Musíte zaplnit celou mřížku, ale uvědomte si, že když vyplněný obdélníkový objekt umístíte vedle položky, která má jen tenké obrysy, bude se opticky jevit silnější/větší. Pokuste se pro celou sadu udržet jednotný kontrast.

</section>

</section>

<section id="custom-full-color-icons">

<title>Vlastní plnobarevné ikony</title>

Plnobarevné ikony jsou vykreslovány v různých předvolených velikostech.

<section id="perspective">

<title>Prespektiva</title>

Většina ikon bude mít nejlepší provedení s perspektivou půdorysu, jakoby by pozorovatel stál před objektem a díval se na něj téměř kolmo dolů (představte si věc položenou na stole). Hodně ikon lze nakreslit také v perspektivě nárysu, jako byste se na objekt dívali přímo ze předu v úrovni očí (představte si věc položenou na poličce).

</section>

<section id="palette">

<title>Paleta</title>

Když navrhujete plnobarevné ikony aplikací nebo zařízení, používejte barevnou paletu Tango.

máslová

<media type="image" mime="image/svg" src="figures/icons/palette/butter.svg"/>

švestková

<media type="image" mime="image/svg" src="figures/icons/palette/plum.svg"/>

oranžová

<media type="image" mime="image/svg" src="figures/icons/palette/orange.svg"/>

jasně červená

<media type="image" mime="image/svg" src="figures/icons/palette/scarlet-red.svg"/>

čokoládová

<media type="image" mime="image/svg" src="figures/icons/palette/chocolate.svg"/>

hliníková

<media type="image" mime="image/svg" src="figures/icons/palette/aluminium1.svg"/>

žabičková

<media type="image" mime="image/svg" src="figures/icons/palette/chameleon.svg"/>

<media type="image" mime="image/svg" src="figures/icons/palette/aluminium2.svg"/>

blankytně modrá

<media type="image" mime="image/svg" src="figures/icons/palette/sky-blue.svg"/>

Můžete volně použít i jiné odstíny těchto barev, podle požadovaných materiálových efektů. Ale tyto základní barvy jsou dobrým základem, ze kterého byste měli vyjít. Všechny hlavní svobodné grafické balíky obsahují paletu Tango předinstalovanou.

</section>

</section>

<section id="see-also">

<title>Viz také</title>

<link href="http://tango.freedesktop.org/Tango_Icon_Theme_Guidelines">Příručka k ikonám Tango</link>

</section>

</page>