Файл: Сценарий по которому пользователь взаимодействует с приложением, программой для выполнения какоголибо действия для достижения конкретной цели.docx

21. Разный вид Date Picker

22. Разные Text Fields

HIG куда менее требователен к Text Fields, по сравнению с Material.

23. App Store vs Google Play

Ваше приложение для iOS будут скачивать из App Store. Приложение для Android — из Google Play. Чтобы разместить приложение в сторах правильно, нужно соблюдать их требования. Требования App Store стоит прочесть здесь, а Google Play — здесь. Там много особенностей, поэтому рекомендую изучить перед публикацией.

24. Особый паттерн в iOS — Undo and Redo

Это особый паттерн iOS: если потрясти смартфон, приложение предложит пользователю отменить или повторить последнее совершенное действие. Как правило, этот жест используется для удаления введённого текста.



Design system, UI Kit / Style guide

UI KIT - это просто набор компонентов(кнопки,поля ввода,хлебные крошки, меню и тп), которые распределены согласно категорий.
Style guide - это полноценный документ, который указывает на дизайн принципы и правила применения компонентов, отступов и прочих правил.

Грубо говоря, это док в котором прописаны жесткие правила применения компонентов, блоков и стилей друг с другом.
Дизайн-система — это структура, которая приводит в порядок все инструменты и процессы проектирования. Это больше чем цвета, шрифты, изображения, макеты и руководства по стилю. Дизайн-система — это философия и язык, которые направляют дизайнеров, помогая создавать продукты более осмысленно.



Примеры готовых диз систем:

• 
  альфабанк
  
• 
  мегафон
  
• 
  рамблер
  
• 
  майл ру
  

Graphic part

• 
  Core Design Theory(Fundamental principles like contrast, alignment, repetition proximity, Dot/Line/Shape etc)
  
• 
  Color Theory
  
• 
  Typography principles
  
• 
  Graphics creation (Icons and Illustrations)
  

Основная теория дизайна(фундаментальные принципы, такие как контраст, выравнивание, близость повторения, Точка/линия/форма и тп)

---

10 базовых принципов визуального дизайна

1.Точка, линия и форма


Это основные строительные блоки любого дизайна, не важно чего. С ними вы можете создать всё что угодно, от простых иконок до очень сложных иллюстраций, всё сделано сочетанием этих простых элементов.

2.Цвет
3.Типографика
4. Пространство=воздух
5. Баланс

Баланс обеспечивает стабильность и структуру дизайна. Баланс - это смысловой вес, распределяемый в дизайне путем размещения элементов. Элементы не обязательно должны быть одинакового размера. Баланс может быть достигнут путем размещения большого элемента на одной стороне дизайна и нескольких маленьких элементов на другой стороне. Баланс может быть достигнут двумя способами: симметричным или асимметричным. Симметричный баланс достигается, когда вес элементов на обеих половинках конструкции равномерный, с учетом центральной линии. Асимметричный баланс достигается использованием контраста. Темный элемент должен быть сбалансирован несколькими более светлыми элементами.
Ритм

Повторение усиливает дизайн, связывая отдельные элементы. Это помогает создать ассоциацию и последовательность. Последовательное повторение элемента широко используется в многостраничных документах и веб-сайтах. Элементами повторения могут быть простые вещи такие как цвет, форма, шрифт или даже текстура.
Контраст

Контраст позволяет подчеркнуть или выделить ключевые элементы в вашем дизайне. Контраст создается, когда два элемента являются полными противоположностями.

6. Масштаб

Масштаб поможет создать не только ритм, контраст и баланс, но ещё и иерархию. Обычно не все элементы вашего дизайна должны иметь одинаковую важность, и один из лучших способов сообщить это — размер. иерархия — это структурирование элементов в порядке важности. Так, более важный объект вашего дизайна вы можете сделать крупнее и ярче, а вторичные элементы — меньше и бледнее.

7. Сетка и выравнивания

8. Фрейминг
Это ключевая концепция в фотографии, но она также применима и в визуальном дизайне.

---

9. Текстуры и паттерны

10. Визуальная концепция
Это идея за вашим дизайном. Что вы имеете в виду и каков скрытый смысл за этим поверхностным изображением.


Принципы композиции:

• 
  Акцентирование-акцент внимания на главном
  
• 
  Контрастирование- Элементы с высокой степенью контрастирования выглядят четкими и обособленными
  
• 
  Выравнивание
  
• 
  Баланс между элементами
  
• 
  Повторение=ритм
  

Правило третей----Все начинается с правила третей, с которым знакомы не только дизайнеры, но и фотографы. Это самый базовый принцип построения композиции, базирующийся на основе “золотого сечения”. По этой теории нужно разделить страницу на 9 равных частей – проведи две вертикальные и две горизонтальные линии. Пересечения точек и будут теми местами, в которых люди больше всего концентрируют внимание. А правильное использование такой схемы поможет сделать гармоничную картинку.


Теория цвета
Основные термины колористики:
Тон указывает на цветовой пигмент и может полноправно называться соответствующим цветом.

Хроматичность описывает чистоту цвета. Высокая хроматичность тона указывает на то, что в нем отсутствует черный, серый и белый.

Насыщенность определяет, как выглядит тон при различный условиях освещения.

Тональности представляют цвета, получающиеся после добавлении в тон серого.

Тени используются для затемнения цвета путем добавления в его тон черного.

Значение (яркость) цвета отражает его светлоту или темноту.

Оттенок противоположен тени и отражает, сколько белого было добавлено к цвету.

Виды цветовых палитр:

• 
  Монохроматическая
  Подразумевает использование одного цвета, его тональностей и теней. Монохроматическая цветовая гармония всегда оказывается предпочтительным выбором. За счет уникального контраста оттенков она делает дизайн более привлекательным.
  
• 
  Аналоговая
  Аналоговые палитры основываются на цветах, располагающихся рядом на цветовом круге. Такие палитры используются в случаях, когда нужно создать дизайн без контрастов. В оформлении сайтов это означает соблюдение гармонии цвета за счет заполнения фона страницы аналоговыми цветами.
  
• 
  Комплементарная
  Комплементарная палитра строится на основе двух противоположных цветов круга и используется для создания эффекта контраста.
  
• 
  Сплит-комплементарная
  В основе сплит-комплементарной схемы лежит та же контрастная пара цветов, только в этом случае один из них разбивается на два соседних.
  
• 
  Триадическая
  Триадическая цветовая схема строится из трех равноудаленных друг от друга цветов круга. С помощью такой палитры удается одновременно добиться и контраста, и гармонии.
  
• 
  Прямоугольная
  Прямоугольная палитра включает две пары комплементарных цветов. Наиболее опытные дизайнеры используют ее для создания завораживающих изображений.
  

---

Культурные различия в восприятии цветов

Очень важным фактором в дизайне, не подчиняющимся никакому своду правил, являются культурные различия. В нашем полном разнообразия мире каждый регион имеет свои психологические отличия, сформированные разными культурными особенностями. К примеру, в некоторых западных странах белый цвет считается символом чистоты и надежды, но в то же время в других культурах он ассоциируется с печалью и утратой.
Психология цвета:

• 
  Красный: страсть, любовь, гнев
  
• 
  Оранжевый: энергия, счастье, жизненная сила
  
• 
  Желтый: счастье, надежда, обман
  
• 
  Зеленый: новые начинания, изобилие, природа
  
• 
  Синий: спокойствие, ответственность, печаль
  
• 
  Фиолетовый: творчество, царственность, богатство
  
• 
  Черный: загадочность, элегантность, зло
  
• 
  Серый: угрюмость, консерватизм, формальность
  
• 
  Белый: невинность, чистота, добродетель
  
• 
  Коричневый: природа, целостность, надежность
  
• 
  Бежевый: консерватизм, набожность, скука
  
• 
  Кремовый: спокойствие, элегантность, чистота
  

Typography principles

Типографика-исскуство оформления текста
Гарнитура-группа шрифтов, а шрифт — это отдельное начертание (обычное, курсивное, полужирное, жирное). Самые известные гарнитуры — это Arial, Helvetica, Futura, Roboto и другие. То есть правильнее говорить не «шрифт Arial», а «гарнитура Arial», если речь идет о шрифте, то это, например, Arial Italic. Но привычнее называть гарнитуры и начертания просто шрифтами. 
Все шрифты делятся на виды:

• 
  антиква (шрифты с засечками, serif)
  
• 
  гротески (без засечек, san serif) и декоративные.
  

Насыщенность определяется толщиной линий. Чем толще линии, тем выше насыщенность.

Контраст определяется разницей толщины штрихов. Чем больше разница между тонкими и толстыми линиями, тем выше контрастность.
Интер­ли­ньяж — это межстрочное расстояние, которое зависит от размера шрифта и длины строки. 
Чем длин­нее стро­ка по коли­че­ству слов, тем боль­ше дол­жен быть интер­ли­ньяж. И наобо­рот, слиш­ком узкая колон­ка из корот­ких строк так себе смот­рит­ся даже со стан­дарт­ным интер­ли­нья­жем.

---

Обычно интерлиньяж составляет 120-125% от используемого размера шрифта.
Кернинг — это увеличение·или уменьшение·интервала между определенными парами символов. Трекинг — это метод увеличения или уменьшения плотности текстового блока.

Трекинг определяет пробел между буквами в целом слове и предложении, позволяя контролировать пространство в тексте равномерно.
Кернинг — это межбуквенный интервал. В большинстве классических шрифтов он уже оптимальный, поэтому кернинг лучше не менять, чтобы не потерять читабельность.
Расстояние между буквами меньше, чем между словами.

Расстояние между словами меньше, чем между строками.

Расстояние между строками меньше, чем между абзацами.

Расстояние между заголовком и последующим текстом меньше, чем расстояние между концом этого текста и следующим заголовком.

Принципы хорошей типографики: 

• 
  создать правильную визуальную иерархию (различными способами, например, с помощью веса, размера, цвета или контраста. Ее главная цель — установить на странице правильную структуру, благодаря которой текст будет прост для восприятия и чтения. 
  

• 
  не использовать слишком мелкий текст
  

• 
  использовать простой шрифт для основного текста
  

• 
  не использовать много начертаний шрифтов на 1ой стр( лучше брать пару—2)
  

• 
  устанавливать оптимальные line-height (расстояния между строками) чтобы текст не слипался и хорошо читался
  

• 
  Капслок использовать- муветон
  

• 
  не использовать выравнивание по центру слишком часто(Центрированный текст труднее читать, т.к. края каждой строки неровные и у нас нет так называемой отправной точки. Поэтому, использовать центрирование нужно в умеренных количествах, больше выбирая выравнивание по левому краю.)
  

• 
  Ограничивайте длину строки 50-60 символами .Все очень просто. Если строка слишком длинная у пользователя возникнуть проблемы с переходом на другую строку. Если она слишком короткая, можно нарушить ритм т.к. «перескакивание» по строкам будет очень частым. Отсюда оптимальная длина должна составлять примерно 50-60 символов.
  

---