Ръководството на дизайнера за визуална пунктуация
Пунктуацията е повече от периоди и удивителни знаци. По отношение на дизайна пунктуацията може да бъде всичко, което кара читателя или потребителя да спре или да направи пауза. Това може да се случи по време на четене на текст или докато окото се движи от един елемент към друг. Тези битове на визуална пунктуация са навсякъде и са жизненоважни части на всяка дизайнерска концепция.
Ключовите елементи на визуалната пунктуация включват общи четими препинателни знаци, както и интервал, линии, правила, икони и цвят.
Разгледайте елементи Envato
Какво е визуална пунктуация?
Визуалната пунктуация се предлага в две първични форми - белези, които ви карат да спрете в процеса на четене или елементи, които създават пауза, когато гледате от един обект в друг. И двата типа пунктуация са еднакво важни и макар контекстуалната пунктуация да е доста известна и често срещана, не всеки често мисли за други визуални сигнали.
Визуалната пунктуация е важна, тъй като може да задържи хората да гледат дизайна ангажиран и предотвратява умората при четене или гледане на дизайн. Естествените паузи са част от човешката природа и като ги проектирате, вие създавате спирания, които се появяват, когато и където искате. Помага за добавяне на контекст и визуален поток.
Освен това прави дизайна по-лесен за усвояване от потребител / читател. Когато „работата“ е свършена за тях, разглеждането на дизайн може да бъде по-лесно и да изисква по-малко усилия или мисъл. (И всички знаем, че в днешния натоварен свят е по-добре да се направят нещата по-лесни за тези, които гледат на дизайна ни.)
С две думи визуалната пунктуация е всичко, което дизайнерът използва за разделяне, групиране или подчертаване на елементи, снимки или думи в рамките на дизайна. Умишлено или не, визуалната пунктуация ще накара някой да спре и да погледне определена част от платното.
Четеща (Текстова) препинателна точка
Най-известният тип пунктуация е ... ами ... действителната препинателна точка. Всички марки, които се появяват в текст, които ви карат да спрете, докато четете, се считат за препинателни знаци.
Общите символи включват периода, въпросителен знак, удивителен знак, звездичка, тире, запетая, скоби, скоби, елипсис, кавички, двоеточие, тире, апостроф и запетайката. Марките могат да се използват в контекста на писане или формиране на изречения, но често се използват и за визуални цели.
Понякога тези знаци ще бъдат използвани като част от лого или в изкуството на дизайн, за да предадат смисъл или акцент. Поради тяхната обща природа и често добре разбираеми значения, тези символи са лесни за използване по различни начини.
пространство
Използването на пространството като форма на визуална пунктуация също идва от текст и писане. Пространството се използва, за да не се стартира нов параграф в блок текст или дори началото на нова глава в книга. Пространството може да функционира по начин, който е различен като период или по-течащ начин, като например тире.
Пространството също се използва за създаване на визуални стартирания и спирки и създаване на посока за пътуване на очите ви. Количеството пространство, използвано между елементите, може да представлява колко близо или далеч са по отношение на другото съдържание. Пространството също може да ви създаде място да се съсредоточите върху множество елементи независимо.
Вижте изображението от United Strands. Между стека от ризи и простия текст има голямо пространство. Пространството дава на потребителя време да разгледа всеки елемент и да го усвои самостоятелно, а след това като единица. Пространството служи като напомняне за забавяне и като начин за свързване на елементите на екрана.
Пространството дава различен резултат в страницата Ница и Сериозно по-горе. Поради последователното разстояние между четири подобни, но различни елементи в червените кръгове, вие естествено групирате елементите като едно изображение. Пространството между всеки елемент е доста тясно и последователно от един елемент до друг, което ги кара да се чувстват като един елемент.
Редове и правила
Линиите са правила, които създават ясно разделяне между обектите. (Можете също така да постигнете същия ефект с бокс елементи.) Линията очертава къде свършва едно нещо и започва друго; това е много като период в края на всяко изречение в абзац.
Линиите често се използват заедно с пространството, но това не винаги е така. Линиите, които са близо една до друга или нямат разстояние, могат да допринесат за усещане за стегнатост или понякога могат да свързват елементи през това разделяне.
В горните примери линиите се използват по два начина. На страницата Квадрат се използват няколко реда, за да образуват въображаем или „призрак“ бутон. Линиите разделят частта на страницата, която може да се кликне, освен останалите. На страницата на Agra Culture Kitchen & Press линиите се използват по два начина: За да се задържи окото да се придвижва от елемент към елемент и да се обърне внимание на конкретно важно значение, като логото, основния текст и бутон за повикване на действие на началната страница,
Икони и елементи на дизайна
Докато използването на икони и други елементи (и инструменти за потребителски интерфейс за цифрови проекти) са резултат от функцията, те също така осигуряват насока за проектиране. Тези инструменти казват на потребителите къде да отидат в дизайна, как да взаимодействат със съдържанието и да помогнат за оформянето на цялостните действия, които ще предприеме потребителят, когато взаимодейства с конкретен елемент.
Например в печатните проекти, логовете на Facebook и Twitter често се използват, за да кажат на потребителите, че компаниите имат страници, които могат да харесат или следят. Иконите, а не по-дългите или по-трудни URL адреси, стават норма. Същите тези икони често се използват в дигитални проекти като връзка за кликване към тези сайтове или които отвеждат потребителите да споделят опции в тези сайтове за социални медии.
Иконите и дизайнерските елементи могат да имат и друга употреба. Те служат като визуални дивоти в процеса на разказване на истории и могат да бъдат използвани за примамване на читателите чрез текст или от един предмет на следващия върху платното. (Мислете за тях почти като запетаи, които ви позволяват да направите пауза, но не спирате да се движите по пътеката.) Октоподът например използва големи икони като връзки в цветните полета и като елементи за визуална навигация в точките на куршума по-долу. Openbox използва икони по подобен начин, като варира дизайн на триъгълници, за да помогне на потребителите да се движат през съдържанието на сайта. (+ Или x, в зависимост от ориентацията, прави същото.) Друг елемент на забележка тук са точките под основния текст, които действат като правило и инструмент за навигация.
цвят
Цветът може да добави забавен усет, когато търсите да създадете отделяне на елементи в дизайна. И има много начини да го постигнем. От цвят срещу черно и бяло до остри контрасти на тематични цветови схеми или цветни панели, използването на различни нюанси е лесен начин да привлечете вниманието към конкретни части от дизайна по интересни начини.
Примерите по-горе показват два рязко различни начина за използване на цвят за създаване на пауза. На страницата на P'unk Ave ярко червена икона плува в пространството на едноцветен фон. Събира незабавно визуално въздействие и връзка. (Считайте го за вид възклицание.)
Страницата в Южна Австралия използва цвета по съвсем различен начин. Всеки различен раздел със съдържание (и координиращ екран в рамката на паралакса) използват различен цветен екран. Това ви помага да знаете каква секция четете и какво друго съдържание предстои. Тези визуални „точка и запетая“ ви дават време да завършите една мисъл, докато преминете към следващата.
заключение
Визуалната пунктуация е навсякъде. В началото може да не е толкова очевидно, колкото малките символи със същото име в текст, но е също толкова важно. Визуалната пунктуация помага да се създаде поток, посока и предотвратява умората на читателя (и потребителя).
Той помага да се създаде хармония и визуална хармония. По-големият въпрос не е дали го използвате, а ако мислите за това в процеса на проектиране. Визуални препинателни знаци просто се случват или ги планирате? Ще се радваме да научим повече за процеса на проектиране в коментарите.
