Принцип Гутенберга при разработке web интерфейсов
При проектировании интерфейса приложения или веб-сайта, как и любого иного визуального носителя разработчик должен придерживаться ряда базовых правил и принципов, которые позволят улучшить эффективность дизайна.
Принцип Гутенберга менее известен, чем звучащие всюду отсылки к принципу Парето или бритве Оккама. Даже в профильных тусовках о принципах знаменитого книгопечатника вспоминают реже, чем о законах Миллера, Хика или Фитса, однако используют повсеместно, иногда считая психологическим паттерном.
Принцип Гутенберга является основополагающим описанием движения глаз при взгляде на любую конструкцию без явных визуальных акцентов. Правило работает в любых составных системах элементы которых равномерно распределены. Иногда это движение глаз называют - Z-паттерном .
Следи за моими глазами ...
Проектируя любой объект визуального дизайна мы должны помнить, что взгляд зрителя не статичен, мы постоянно "скользим" по поверхности дизайна в поисках зацепок, триггеров, ориентиров и даже точек отдыха для глаз.
Говоря про web мы понимаем, что дизайнер обязан обеспечить наилучшее взаимодействие пользователя с продуктом через осмысленное расположение элементов интерфейса - фигуры, линии, цвета, текстуры, изображения и т.д.
Дизайнер - это создатель навигационной карты для взгляда пользователя без привязки к сфере применения. Правило едино для печати, интернет, пользовательских интерфейсов, верстки книг, городской навигации ... и т.п.
Z-паттерн и гравитация внимания.
Принцип Гутенберга предполагает, что проектное пространство разделено на 4 равных квадранта.
Активные квадранты - верхний левый и нижний правый. Пассивные квадранты-нижний левый и верхний правый.
Верхние квадранты являются первичными по отношению к соответствующим нижним квадрантам.
Для пользователей в регионах с письменностью справа-налево правило справедливо, но отражено зеркально.
Схема гравитации внимания Гутенберга © Milinevskyy Sergii
Если в дизайне не предусмотреть акценты и направляющие, подсознательно, зритель сам просмотрит макет по Z-образному маршруту. Понимая эту особенность поведения мы можем проектировать иные точки взаимодействия (точки входа/выхода внимания).
Можно и не менять схему и просто расположить все элементы интерфейса вдоль пути потока гравитации, что облегчит восприятие. Схеа идеальна для восприятия текста и понимания контекста прочитанного.
При наличии "ритма" схема масштабируется по мере изменения зоны внимания.
Принцип Гутенберга при многоколоночной верстке
Понимая столько простое правило мы можем играть с взглядом пользователя как вовлекая его в истории, (например, в комиксах и storytelling проектах) так и намеренно обрывать внимание цепляя в нужной точке.
Манипулирование гравитацией внимания в книге 17 века
Дизайнер, фотограф, иллюстратор, архитектор и любой иной представитель креативной индустрии осознав простоту правила может проще понять как ее воспримет зритель.