Příručka projektanta k vizuální interpunkci
Interpunkce je více než jen období a vykřičníky. Pokud jde o design, interpunkce může být cokoli, co způsobí, že čtenář nebo uživatel zastaví nebo pozastaví. Může se to stát při čtení textu nebo při pohybu očí z jednoho prvku na druhý. Tyto kousky vizuální interpunkce jsou všude a jsou důležitou součástí jakéhokoli konceptu designu.
Mezi klíčové prvky vizuální interpunkce patří běžné čitelné interpunkční znaménka a také prostor, čáry, pravidla, ikony a barva.
Prozkoumejte prvky Envato
Co je to vizuální interpunkce?
Vizuální interpunkce se vyskytuje ve dvou primárních formách - značky, které způsobují, že jste zastavili proces čtení nebo prvky, které vytvářejí pauzu při pohledu z jednoho objektu na druhý. Oba typy interpunkčních znamének jsou stejně důležité a přestože je interpunkční interpunkce poměrně známá a běžná, ne každý často přemýšlí o jiných vizuálních narážkách.
Vizuální interpunkce je důležitá, protože může udržovat lidi při pohledu na návrh a zabraňuje únavě při čtení nebo při pohledu na návrh. Přírodní pauzy jsou součástí lidské přirozenosti a vytvořením je vytvoříte zastávky, ke kterým dojde, kdy a kde je chcete. Pomáhá přidat kontext a vizuální tok.
To také usnadňuje váš návrh pro uživatele / čtenáře strávit. Když je pro ně „práce“ hotová, prohlížení designu může být snazší a vyžaduje méně úsilí nebo přemýšlení. (A všichni víme, že v dnešním rušném světě je lepší usnadnit práci těm, kdo se dívají na naše návrhy.)
Stručně řečeno, vizuální interpunkce je cokoli, co návrhář používá k oddělení, seskupení nebo zdůraznění prvků, fotografií nebo slov v rámci designu. Vizuální interpunkce úmyslně či nikoliv způsobí, že se někdo zastaví a podívá se na určitou část plátna.
Čitelná interpunkční znaménka
Nejčastěji známým typem interpunkce je… dobře… skutečná interpunkce. Všechny značky, které se objevují v textu a způsobují, že se během čtení zastavíte, se považují za interpunkci.
Mezi běžné symboly patří tečka, otazník, vykřičník, hvězdička, pomlčka, středník, závorky, závorky, elipsa, uvozovky, dvojtečka, spojovník, apostrof a čárka. Značky mohou být použity v kontextu psaní nebo vytváření vět, ale často se používají také pro vizuální účely.
Někdy budou tyto postavy použity jako součást loga nebo v umění designu k vyjádření významu nebo důrazu. Díky své společné povaze a často dobře srozumitelným významům se tyto symboly snadno používají různými způsoby.
Prostor
Využití prostoru jako formy vizuální interpunkce také pochází z textu a psaní. Prostor se používá k nezačátku nového odstavce v bloku textu nebo dokonce k začátku nové kapitoly v knize. Vesmír může fungovat způsobem, který je zřetelný jako období nebo plynulejším způsobem, jako je em pomlčka.
Prostor se také používá k vytvoření vizuálních startů a zastávek a vytvoření směru pro vaše oči k cestování. Velikost prostoru použitého mezi prvky může představovat, jak blízko nebo daleko od sebe jsou ve vztahu k jinému obsahu. Prostor může také vytvořit prostor pro samostatné zaměření na více prvků.
Podívejte se na obrázek výše od United Strands. Mezi hromadou košil a jednoduchým textem je velký prostor. Prostor dává uživateli čas podívat se na každou položku a strávit ji samostatně a poté jako celek. Prostor slouží jako připomenutí ke zpomalení a jako způsob, jak spojit prvky na obrazovce.
Space přináší jiný výsledek na stránce Nice a Serious výše. Z důvodu konzistentního rozestupu mezi čtyřmi podobnými, ale odlišnými položkami v červených kruzích, přirozeně seskupujete prvky jako jeden obrázek. Prostor mezi jednotlivými prvky je poměrně těsný a konzistentní od jedné položky k další, díky čemuž se „cítí“ jako jediný prvek.
Řádky a pravidla
Řádky jsou pravidla vytvářející zřetelné oddělení mezi objekty. (Stejného efektu můžete dosáhnout také s boxovacími prvky.) Linka vymezuje, kde končí jedna věc a druhá začíná; je to jako období na konci každé věty odstavce.
Řádky se často používají ve spojení s prostorem, ale to není vždy pravda. Čáry, které jsou blízko sebe nebo nemají mezery, mohou přispět k pocitu těsnosti nebo někdy mohou spojovat položky přes toto oddělení.
Ve výše uvedených příkladech jsou řádky použity dvěma způsoby. Na stránce Čtverec se používá více řádků k vytvoření imaginárního tlačítka nebo tlačítka „duch“. Čáry oddělují klikatelnou část stránky od ostatních. Na stránce Agra Culture Kitchen & Press jsou řádky použity dvěma způsoby: Aby se oko pohybovalo od prvku k prvku a upozornilo na konkrétní důležitý obsah, jako je logo, hlavní text a tlačítko výzvy k akci na domovské stránce. .
Ikony a prvky návrhu
Použití ikon a dalších prvků (a nástrojů uživatelského rozhraní pro digitální projekty) je sice výsledkem funkce, ale také poskytuje designový směr. Tyto nástroje uživatelům říkají, kam mají v designu jít, jak interagovat s obsahem a pomáhají utvářet celkové akce, které uživatel provede při interakci s konkrétní položkou.
Například v tiskových projektech jsou loga Facebook a Twitter často používána k tomu, aby uživatelům řekla, že společnosti mají stránky, které se jim mohou líbit nebo sledovat. Ikony spíše než delší nebo obtížnější adresy URL se stávají normou. Stejné ikony se často používají v digitálních projektech jako odkaz na tyto weby, na který lze kliknout, nebo které uživatelům umožňují sdílení možností na těchto sociálních sítích.
Ikony a designové prvky mohou mít i jiné využití. Slouží jako vizuální divoty v procesu vyprávění a mohou být použity k lákání čtenářů prostřednictvím textu nebo od jedné položky k další na plátně. (Přemýšlejte o nich téměř jako čárky, které vám umožňují pozastavit se, ale nepřestat se pohybovat po cestě.) Chobotnice například používá velké ikony jako odkazy v barevných polích a jako vizuální navigační prvky v bodech níže. Openbox používá ikony podobným způsobem, různé vzory trojúhelníků, které uživatelům pomáhají procházet obsahem na webu. (+ Nebo x, v závislosti na orientaci, provádí totéž.) Dalším prvkem poznámky jsou tečky pod hlavním textem, které fungují jako pravidlo a navigační nástroj.
Barva
Barva vám může poskytnout zábavnou atmosféru, pokud chcete vytvořit oddělení prvků v designu. A existuje spousta způsobů, jak toho dosáhnout. Od barev versus černé a bílé po ostré kontrasty až po tematické barevné schéma nebo barevné panely je použití různých odstínů snadným způsobem, jak zajímavým způsobem upozornit na konkrétní části designu.
Výše uvedené příklady ukazují dva ostře odlišné způsoby použití barvy k vytvoření pauzy. Na stránce P'unk Ave plave jasně červená ikona na jednobarevném pozadí. Získává okamžitý vizuální dopad a spojení. (Považujte to za vykřičník.)
Stránka Jižní Austrálie používá barvu zcela odlišným způsobem. Každá odlišná sekce obsahu (a koordinační obrazovka v rámci paralaxy) používá jinou barevnou obrazovku. To vám pomůže zjistit, jakou sekci čtete a jaký další obsah má přijít. Tyto vizuální „středníky“ vám poskytnou čas na dokončení jedné myšlenky při přechodu na další.
Závěr
Vizuální interpunkce je všude. Zpočátku to nemusí být tak zřejmé jako malé znaky stejného jména v textu, ale je stejně důležité. Vizuální interpunkce pomáhá vytvářet tok, směr a zabraňuje únavě čtenáře (a uživatele).
Pomáhá vytvářet harmonii a vizuální harmonii. Větší otázkou není, zda jej použijete, ale pokud o tom přemýšlíte v procesu návrhu. Stáváte se vizuální interpunkční znaménka nebo je plánujete? Rádi bychom se dozvěděli více o vašem návrhu v komentářích.