Что делает оформление
Оформление часто считают украшением: текст написан, осталось сделать красиво. На деле оно делает другую работу — решает, дойдёт ли человек до чтения вообще.
| Шаг | Что происходит | Сколько длится |
|---|---|---|
| увидел | глаз выхватывает крупное и контрастное | доли секунды |
| понял устройство | где заголовок, где список, где действие | пара секунд |
| прочитал | собственно текст | сколько нужно |
Первые два шага человек делает не читая. Он смотрит на страницу целиком и за мгновение решает: это про меня? это долго? отсюда начинать? Если на этих шагах непонятно, до третьего дело не доходит — он уходит, и текст, каким бы хорошим он ни был, остаётся непрочитанным.
Отсюда главная мысль курса: оформление — это не про красоту, а про порядок чтения. Оно отвечает на вопросы, которые человек задаёт до того, как начал читать. Красота бывает следствием, но она не цель и не мерка.
Различие это не философское, а очень практическое. Мерку «красиво» проверить нечем: она у каждого своя, спор о ней не заканчивается, и работа не имеет признака готовности. Мерку «понятно с первого взгляда» проверить можно, и проверяется она не на себе, а на другом человеке — тот, кто макет собирал, уже знает, где что лежит, и видит не страницу, а свою память о ней. Поэтому автор — худший проверяющий собственной работы, и это верно и для дизайнера, и для того, кто делает объявление в подъезд.
Три вопроса
Второе — три вопроса, которыми проверяют любой макет. Они короткие, и отвечать на них надо глядя, а не читая.
| Вопрос | Чем на него отвечают | Что сломано, если непонятно |
|---|---|---|
| что здесь главное? | размер, вес, положение | порядок важности |
| что с чем связано? | близость, выравнивание | группировка |
| что делать дальше? | контраст, одно заметное действие | призыв |
Проверка занимает секунду и устроена просто: посмотрите на макет и отведите взгляд. Что запомнилось первым? Если это не то, что должно быть главным, порядок важности сломан — и никакие правки цвета этого не починят.
Второй вопрос ловит самую частую ошибку начинающих: подпись стоит ближе к чужой картинке, чем к своей. Человек читает связь расстоянием, а не логикой, и уверенно связывает не то. Рамки тут не помогают — они лечат следствие.
Порядок вопросов не случайный. Пока непонятно, что главное, человек не начнёт разбираться в связях: он ещё не решил, стоит ли вообще тратить на это время. А пока непонятны связи, он не найдёт нужного действия — оно окажется среди чужих. Поэтому чинить макет начинают сверху этого списка: починенная группировка не поможет, если порядок важности сломан, а выделенная кнопка не поможет, если человек не понял, куда попал.
Восемь средств
Третье — из чего вообще состоит оформление. Средств немного, они давно известны и все перечисляются на одной странице.
| Средство | Что делает |
|---|---|
| размер | показывает важность |
| вес и насыщенность | то же, но тише |
| положение | что выше и левее — то раньше |
| близость | что рядом — то связано |
| выравнивание | невидимые линии, по которым читается порядок |
| контраст | выделяет одно из многих |
| повторение | делает набор элементов системой |
| воздух | отделяет и даёт дышать |
Восемь средств, и первые семь уроков курса — это они по одному. Ни одно из них не про красоту: каждое отвечает на конкретный вопрос человека, и работает независимо от моды, инструмента и года.
Отсюда полезное следствие для новичка: если макет не работает, чинить его надо средством, а не подбором. «Покрутить, пока не станет лучше» — самый долгий путь: он не заканчивается, потому что мерки «лучше» нет. А вопрос «какой из восьми здесь не сделал свою работу» заканчивается за минуту.
И ещё одно, что стоит сказать в самом начале: эти средства работают вместе, а не по очереди. Размер спорит с цветом, воздух спорит с плотностью, повторение спорит с контрастом — и почти всякий разбор заканчивается тем, что два средства тянут в разные стороны. Урок про каждое из них по отдельности нужен ровно затем, чтобы потом различать их в этом споре: пока средство не названо, спор выглядит как «что-то не то».