Подписаться
Я согласен на обработку персональных данных в соответствии с политикой конфиденциальности и пользовательским соглашением

* Поля обязательные для заполнения

ЗАКАЗАТЬ ЗВОНОК
Я согласен на обработку персональных данных в соответствии с политикой конфиденциальности и пользовательским соглашением

* Поля обязательные для заполнения

Зачем нужны скетчи сайта?

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

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

1.jpg

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

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

2.jpg


Прежде, чем приступить к скетчам, необходимо собрать требования. Хороший проект появляется на пересечении требований бизнеса, пользователя и технологий. Мы используем скетчи, чтобы думать, документировать, экспериментировать, объяснять и общаться, совершать 80% ошибок и найти верное решение. 

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

1. Исследовательский 

3.jpg


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

2. Изящный

4.jpg

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

3. Детальный

5.jpg


В данном случае идет речь об оформлении интерфейса в специальной программе, но без дизайна. То есть, у таких скетчей нет стиля, они черно-белые, цвет используется только для привлечения внимания к ключевым моментам, причем цвет желательно использовать только один. Разноцветные макеты сложнее воспринимаются, так как внимание рассеивается.

Основные правила скетчинга:

6.jpg


  • Чем быстрее, тем продуктивнее.

  • Чем «страшнее», тем лучше.

  • Чем больше скетчей, тем больше идей.

  • Не критикуйте качество.

  • Не стремитесь к совершенству в оформлении, стремитесь к совершенству в решении бизнес-задачи.

  • Не фокусируйтесь на деталях, но думайте о юзабилити.


7.jpg


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

Скетчи экономят средства. Если ошибка замечена на последнем этапе разработки сайта, то придется начинать все сначала, а это очень большие затраты денег и времени. Крайне выгодно совершить все возможные ошибки на самом начальном этапе, потому что дальше, размер ошибки будет заметно увеличиваться.

8.jpg

Созданием скетчей занимаются представители профессий, в которых требуется креатив, конструирование, понимание основных принципов юзабилити и желание сделать проще жизнь пользователя сайта. Мы работаем в программе Balsamiq Mockups — это сервис для построения макетов пользовательских интерфейсов веб-сайтов, мобильных приложений и обычных программ. Программа обладает отличной функциональностью и продуманностью своей работы. 

9.jpg


Итак, мы разобрались с понятием «скетч» и как его создать, и подошли к ответу на самый главный вопрос: зачем нужны скетчи?

Любой сайт начинается с идеи. Постановка задачи звучит примерно таким образом: «Я хочу сайт, который будет выполнять задачи: А, В и С.» Но такой формулировки недостаточно для того, чтобы создать сайт. Необходимо представление того, что увидит пользователь на каждой странице сайта. Создание скетча заставляет задуматься о пользовательском поведении. Вы уже знаете, ЧТО вы хотите, осталось выяснить, КАК это должно работать, ведя пользователя к желаемому результату. Скетчинг визуализирует интерфейс, который направляет пользователя.

10.jpg


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

11.jpg


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

Создавайте скетчи, отсекайте 80% ошибок, думайте о пользователе и ваши сайты будут здоровы! 


Поделиться в соцсетях