Диаграмма Гутенберга и экспертное оценивание (1950-е)

Что произошло

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

Эдмунд Арнольд и диаграмма Гутенберга. Эдмунд Клифтон Арнольд (1913–2007) — человек, которого типографы называли «отцом современного газетного дизайна». Профессор журналистики Сиракузского университета, консультант более двухсот газет и журналов, автор десятка книг о типографике и макетировании. В начале 1950-х Арнольд описал модель, которая стала известна как диаграмма Гутенберга — схему движения глаз по странице с равномерно распределённой информацией.

Модель проста и элегантна. Представьте прямоугольную страницу, разделённую на четыре зоны:

  • Верхний левый угол — «первичная оптическая область» (primary optical area). Здесь взгляд начинает путь. Для носителей языков с письмом слева направо это естественная точка входа: мы с детства приучены начинать чтение отсюда.

  • Верхний правый угол — «сильная область бесполезного хода» (strong fallow area). Взгляд проходит через неё горизонтально, но задерживается здесь меньше. Информация в этой зоне замечается, но без акцента — проскальзывает.

  • Нижний левый угол — «слабая область бесполезного хода» (weak fallow area). Самая «мёртвая» зона. Взгляд редко задерживается здесь — он скользит по диагонали из верхнего правого к нижнему правому, минуя этот угол.

  • Нижний правый угол — «терминальная область» (terminal area). Здесь взгляд завершает путь. Финальная точка — точка действия.

Если соединить точки — получится Z: верхний левый → верхний правый → нижний левый → нижний правый. Отсюда второе название — Z-паттерн.

Арнольд назвал модель в честь Иоганна Гутенберга — изобретателя печатного станка, — хотя сам Гутенберг, разумеется, никаких исследований движения глаз не проводил. Имя было данью уважения: Гутенберг создал печатную страницу, Арнольд описал, как человек её читает.

Важная оговорка, которую сам Арнольд подчёркивал: диаграмма Гутенберга описывает сканирование однородной страницы — без ярких заголовков, без контрастных изображений, без акцентных элементов. Это модель «по умолчанию»: как глаз движется, когда ничто не привлекает его принудительно. Любой визуальный акцент — крупный заголовок, яркая фотография, цветная кнопка — ломает паттерн и перетягивает взгляд на себя.

Экспертное оценивание — знание из голов. В те же 1950-е годы, в совершенно другом мире — мире военной аналитики и исследования операций — оформился метод, который назовут экспертным оцениванием (expert judgment, expert elicitation).

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

После войны эти методы были систематизированы. В 1948 году корпорация RAND — мозговой центр ВВС США — начала разработку формализованных процедур получения экспертных оценок. В 1950–1953 годах Олаф Хелмер и Норман Далки создали метод Дельфи — процедуру, при которой группа экспертов независимо друг от друга оценивает вероятности событий, затем знакомится с анонимными ответами коллег и корректирует свои оценки. Несколько итераций — и мнения сходятся к консенсусу, очищенному от влияния авторитетов и группового давления.

Параллельно развивались и другие формы экспертного оценивания: метод мозгового штурма Алекса Осборна (1953), метод номинальных групп, метод парных сравнений. Все они решали одну задачу: как извлечь из группы экспертов суждение, которое будет надёжнее, чем мнение любого отдельного эксперта?

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

Контекст эпохи

1950-е годы — эпоха массовых коммуникаций. Телевидение врывалось в каждый американский дом: в 1950 году телевизор имели 9% домохозяйств, к 1960 году — уже 87%. Газеты и журналы конкурировали за внимание читателя с новым медиа — и проигрывали.

Арнольд работал именно в этом контексте. Он консультировал газеты, которые теряли читателей, и его диагноз был одинаковым: газетный дизайн застрял в XIX веке. Плотные колонки текста, одинаковые заголовки, никакой визуальной иерархии. Глаз читателя блуждал по странице, не находя точки входа. Арнольд учил редакторов думать о странице как о маршруте для глаза: первичная область — сюда поместите главный заголовок. Терминальная область — сюда поместите призыв к действию. Слабая область бесполезного хода — не кладите сюда ничего важного, глаз всё равно проскочит мимо.

Это была революция для газетной индустрии. До Арнольда макетировщики размещали материалы по традиции: самая важная новость — верхний правый угол первой полосы (потому что «так всегда делали»). Арнольд спросил: а вы проверяли, что читатель смотрит туда первым? И показал, что нет — первый взгляд падает на верхний левый угол. Традиция ошибалась.

Экспертное оценивание развивалось в контексте холодной войны. RAND Corporation, созданная в 1948 году как аналитический центр для ВВС, решала задачи стратегического планирования: ядерное сдерживание, прогнозирование развития технологий, оценка военных сценариев. Метод Дельфи был засекречен до 1963 года — его считали стратегическим преимуществом. Когда он стал публичным, выяснилось, что он применим далеко за пределами военного планирования: в бизнесе, медицине, образовании — везде, где нужно принять решение в условиях неопределённости, опираясь на экспертное знание.

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

Значение для UX

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

Z-паттерн и проектирование лендингов. Каждый лендинг — одностраничный сайт с призывом к действию — по сути является реализацией диаграммы Гутенберга. Верхний левый угол: логотип и название компании (первичная оптическая область — пользователь должен сразу понять, где он). Верхний правый угол: навигация или контактный телефон (сильная область — замечается, но не перетягивает фокус). Центр: основное сообщение и ключевые преимущества (диагональ взгляда проходит через центр). Нижний правый угол: кнопка «Записаться», «Купить», «Попробовать бесплатно» (терминальная область — точка действия).

Это не совпадение. Это прямое применение модели Арнольда к цифровому экрану. Логика та же, что в газете: направить взгляд от точки входа к точке действия по естественному маршруту.

Конечно, реальность сложнее модели. Якоб Нильсен в 2006 году описал F-паттерн — модель чтения текстовых веб-страниц, где пользователь читает первую строку целиком, затем сканирует начала следующих строк, формируя букву F. F-паттерн и Z-паттерн не противоречат друг другу — они описывают разные ситуации. Z-паттерн — для визуальных страниц с минимумом текста (лендинги, плакаты, слайды презентаций). F-паттерн — для текстовых страниц (статьи, результаты поиска, каталоги). А исследования Ярбуса напоминают, что оба паттерна — лишь тенденции: конкретный маршрут взгляда определяется задачей пользователя.

Терминальная область и CTA. Одно из самых практичных следствий диаграммы Гутенберга: кнопка призыва к действию (Call to Action) должна располагаться в терминальной области — нижнем правом углу видимой части экрана. Это не догма — яркая кнопка в центре тоже работает, потому что визуальный акцент ломает паттерн по умолчанию. Но на страницах с равномерным распределением информации размещение CTA в терминальной области увеличивает конверсию, потому что совпадает с естественным завершением маршрута взгляда.

Экспертное оценивание и UX-аудит. В 1990 году Якоб Нильсен и Рольф Молич опубликовали метод эвристической оценки — процедуру, при которой 3–5 UX-экспертов независимо проверяют интерфейс на соответствие набору эвристик (принципов юзабилити). Каждый эксперт находит свой набор проблем. Результаты объединяются. Три эксперта находят примерно 60% проблем, пять — около 75%.

Узнаёте структуру? Это и есть экспертное оценивание, адаптированное для UX. Независимость экспертов, агрегирование результатов, статистическая надёжность за счёт множественности оценок — всё это из методологии 1950-х. Нильсен, разумеется, не изобретал экспертное оценивание — он применил его к конкретной задаче. Но метод Дельфи, мозговой штурм Осборна, парные сравнения — все эти инструменты 1950-х годов продолжают жить в UX-практике.

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

Арнольд учил смотреть на страницу глазами читателя. Хелмер и Далки учили извлекать знание из голов экспертов. Два урока, два инструмента — и оба работают в каждом UX-проекте. Когда дизайнер размещает кнопку в нижнем правом углу лендинга — он следует Арнольду. Когда три эксперта независимо оценивают интерфейс по списку эвристик — они следуют методологии RAND. 1950-е годы продолжают проектировать наши интерфейсы.

Связанные статьи

Диаграмма Гутенберга и экспертное оценивание связаны с ключевыми концепциями UX:

  • Эвристики Нильсена — метод эвристической оценки (1990) — это экспертное оценивание, адаптированное для UX. Нильсен формализовал процедуру, определил оптимальное число экспертов (3–5) и создал набор принципов для проверки.
  • Принципы гештальта — законы восприятия, описанные гештальтпсихологами, объясняют, почему работает диаграмма Гутенберга: закон близости, закон непрерывности и закон замкнутости определяют, как глаз группирует и сканирует элементы на странице.
  • Закон Фиттса — размещение CTA в терминальной области учитывает не только паттерн взгляда, но и моторику: кнопка должна быть достаточно крупной и расположенной так, чтобы до неё было легко «дотянуться» курсором.
  • Что такое юзабилити — экспертная оценка и тестирование с пользователями — два комплементарных метода оценки юзабилити, описанные в стандарте ISO 9241.
  • Что такое UX — диаграмма Гутенберга напоминает: UX начинается с понимания того, как человек физически воспринимает интерфейс — куда смотрит, что замечает, что пропускает.

Из других статей серии «История UX»:

Вопросы и ответы

Что такое диаграмма Гутенберга и как она работает?

Диаграмма Гутенберга (Z-паттерн) — модель, описывающая, как глаза сканируют страницу с равномерно распределённой информацией. Взгляд начинается в верхнем левом углу (первичная оптическая область), движется к верхнему правому (сильная область бесполезного хода), затем скользит по диагонали к нижнему левому (слабая область бесполезного хода) и завершается в нижнем правом (терминальная область). Модель названа в честь Иоганна Гутенберга, изобретателя печатного станка, хотя он не имел к ней отношения. Автор — Эдмунд Арнольд, американский типограф и профессор журналистики.

Чем отличается Z-паттерн от F-паттерна?

Z-паттерн (диаграмма Гутенберга) описывает сканирование страниц с равномерным распределением визуальных элементов — плакатов, рекламы, лендингов. F-паттерн, открытый Якобом Нильсеном в 2006 году, описывает чтение текстовых страниц: человек читает первую строку полностью, затем сканирует начала следующих строк, формируя букву F. Z-паттерн — для визуального контента, F-паттерн — для текстового. В реальности паттерны зависят от задачи пользователя, как показал Ярбус в своих экспериментах.

Что такое экспертное оценивание в UX и откуда оно взялось?

Экспертное оценивание — метод получения оценки на основе мнения квалифицированных специалистов. Метод зародился в 1940–1950-х годах в военных исследованиях операций (RAND Corporation, метод Дельфи), а затем распространился на бизнес и проектирование. В UX экспертное оценивание трансформировалось в эвристическую оценку Якоба Нильсена (1990) — метод, при котором эксперты проверяют интерфейс на соответствие набору принципов юзабилити. Это один из самых быстрых и экономичных методов UX-аудита.