Цветовые схемы | Мастер-класс «Понимание цвета» ч.3

Часть 3. Цветовые гармони

Цветовая гармония | color harmonies

Цветовые гармонии имеют отношение к выбору сочетающихся цветов. Имеется ввиду, что какие-то краски подходят лучше друг другу, чем другие.

Существуют даже схемы взаимодополнительных цветов, цветовые гармонии, — они по-разному называются.

Мы поговорим о 6 популярных и распространенных цветовых гармониях, которые никогда не подводят.
Читать далее Цветовые схемы | Мастер-класс «Понимание цвета» ч.3

Share

Насыщенность и яркость | Мастер-класс «Понимание цвета» ч.2

Часть 2. Насыщенность и яркость

Насыщенность — это интенсивность или чистота цвета и она является одним из основных пособников уродливых цветорешений. Яркость — она имеет отношение к светлым или темным тонам красок.
Saturation and value
Читать далее Насыщенность и яркость | Мастер-класс «Понимание цвета» ч.2

Share

Почему цвета так важны? | Мастер-класс «Понимание цвета» ч.1

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

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

Здесь я собираюсь выделить 3 главных идеи:

  1. Почему цвета так важны?
  2. Насыщенность и яркость
  3. Цветовая гармония

Читать далее Почему цвета так важны? | Мастер-класс «Понимание цвета» ч.1

Share

Модульные сетки в веб-дизайне | Базовая часть

Привет! В сегодняшней статье разберёмся с сетками в веб-дизайне.

Одна из самых первых вещей, о которой задумывается веб-дизайнер, после брифования клиента и наброска будущего сайта — это выбор сетки. В этом нет сложностей, но есть тонкости.

Именно набросок будет первой вещью, которую делает веб-дизайнер, потому что уже исходя из того, что мы там нарисовали, мы подбираем сетку. Набросок — это по сути прототип т.е. черновая идея сайта изображённая в виде блоков (модулей) на обычной бумажке.

Для начала давайте разберёмся, что такое модуль?

Модуль — любая единица измерения. Модуль устанавливается для того, чтобы измерить что либо по отношению к чему-либо. Т.е. грубо говоря 1 сантиметр — это модуль, по отношению к метру. Вот примерно так же сайт строится из модулей. Модуль — это мельчайшая единица и составляющая дизайна сайта.
Читать далее Модульные сетки в веб-дизайне | Базовая часть

Share

Модульные сетки и колонки

Сложность работы с системой сеток на веб страницах, в количестве колонок.

Обычно я продвигаюсь туда и сюда между создаваемыми органическими макетами с интуитивными пропорциями и создаю сетку, на которой смогу расположить различные элементы. В последнее время я был более заинтересован в последнем. Часто я ловил себя на мысли, что высчитываю сколько будет 750 разделить на 3 минус 2 равных поля по 10px.

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

Фокусируйтесь на обычном горизонтальном расположении, что обычно означает колонки. (Кстати, если вы всегда удивляетесь почему фиксированные макеты так популярны среди дизайнеров, это во многом объясняется тем что — это ужасно сложно построить любые формы сетки если вы теряете контроль над пропорциями в обоих направлениях сразу).

1 колонка

1 Column

Для простоты начнём с одноколоночного макета, который берёт начало у истоков веба. 1994-й дал нам серый фон и чёрный шрифт Times в одиночных колонках до самого низу окна браузера, одна-колонка наиболее примитивная форма из возможных (хотя назвать её так можно с натяжкой. Смотрите: ранняя версия Yahoo). Они отлично развились с тех пор и некоторые недавние переделывания сделали их ещё лучше.
Читать далее Модульные сетки и колонки

Share

Ужасные отступы в тексте

Пока писал обзор «Живой типографики» осознал, что на сайте просто беда с отступами.

Вот например, строка между списками непонятно к чему относится, даже больше того, отступ сверху меньше, чем снизу, а должно быть как минимум визуально понятно к чему относится заголовок/подзаголовок, а как максимум всё должно быть продумано до пикселя (pixel perfect).

Неправильные отступы:
Неправильные отступы

Правильные отступы:
Правильные отступы

Хотя конечно никаких «правильно» или «неправильно» в дизайне не существует, поэтому следует уточнить, что отступами мы определяем некую иерархичность контента и самое главное упрощаем для читателя в данном случае «сплошное» восприятие текста.

Share

«Живая типографика» | Обзор

Обзор книги Александры Корольковой «Живая типографика» я бы начал с вступительных слов автора: «Эта книга для тех, кто ещё не достаточно много знает о шрифте и типографике, но кому предстоит работать с оформлением текста, для тех, кому это интересно, — главным образом, для студентов–дизайнеров».

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

Пару слов о книге:
Во–первых, прелесть книги в том, что она выходит далеко за рамки основ. В начале каждой главы даются определения на русском и в скобочках на английском: антиква (sans), кегль (point size), межколонник (gutter) и пр. Это на мой взгляд важно, поскольку читая англоязычный текст на тему типографики легко запутаться в терминах.

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

Три разворота из книги «Живая типографика»:

Шрифт как наукаШрифт как инструментОбщая композиция

Читать далее «Живая типографика» | Обзор

Share

Выбор шрифта

Первый принцип

Типографика — это не наука. Типографика — это искусство. Есть те, кто хотел бы её ‘науконизировать’; те, кто считает, что этого достаточно для получения хорошей типографики. Однако, эта колбасная-машина получит развитие, только если будет делать колбасу. Так типографика и выбор шрифта это не наука сковывающая всё своими аксиомами и правилами и это здорово.
Читать далее Выбор шрифта

Share