Метод последовательных приближений

Метод последовательных приближений. База знаний для веб-дизайнера

Выдано в печать 2014-10-09

…И вот ты, прочитав бриф, кладёшь перед собой чистый лист бумаги и начинаешь рисовать прототип. Ээээ… Ммм….. с чего бы начать?

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

Суть в том, что я не начинаю делать полноценный прототип сразу. Вот как выглядит схема работы:
1. Прочитай бриф и выпиши на бумагу перечень ключевых элементов страницы. Такой перечень всегда есть: на сайте (обычно) должна быть шапка с логотипом, промо-блок с лучшими услугами, контакты и так далее. Вот таких крупных элементов нужно выписать штук 10 (в зависимости от объема страницы), чтобы они были всегда перед глазами;
2. Отсортируй эти пункты по важности. Что из них главное, а что второстепенное?
3. Рядом нарисуй прямоугольник, который обозначит наше рабочее пространство;
4. Начинай расставлять в этом прямоугольники выписанные объекты. Грубо, контурами – здесь область логотипа, тут силуэт человека и так далее.

Уже на этом этапе решается ГЛАВНАЯ ЗАДАЧА ИНФОРМАЦИОННОГО ДИЗАЙНА САЙТОВ– расстановка приоритетов. Обрати внимание, здесь не делается никакого макета, не делается даже прототип. Это просто визуальный образ, который передает содержание будущего сайта. Но уже сейчас можно понимать, что, например, один блок будет в 2 раза больше другого, а третий должен быть выше этих двух.

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

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

6. Бери новый лист бумаги. Делаем новый скетч! Поглядываем на уже сделанный набросок и начинаем его перерисовывать. Тоже в контурах, тоже карандашом, но с большей аккуратностью. Обращай внимание не только на расположение и размер элементов, но и на их форму, сочетаемость. На этом этапе от компоновочной части дизайна мы переходим к графической.

В зависимости от сложности проекта таких итераций может быть несколько. Обычно хватает двух: совсем грубый эскиз-набросок и нормальный карандашный скетч с разумной детализацией.

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