В эпоху развития мобильных технологий юзабилити сайтов стали уделять больше внимания. Это неудивительно, ведь при малейшем неудобстве или непривычной навигации пользователь скорее покинет сайт в поисках более удобного и привычного интерфейса. Предварительное создание прототипа позволяет владельцу сайта увеличить продолжительность среднего сеанса и уменьшить показатель отказов.
Прототип сайта — это схема расположения пользовательских блоков на страницах. Это очень удобный инструмент планирования юзабилити будущего ресурса. Случается, веб-мастеру или копирайтеру кажется, что текст или сайдбар должны располагаться в определенном порядке. При создании прототипа становится ясно, что схема интерфейса должна быть совсем другой.
Как выглядит прототип
Прототип, как и дизайн сайта, может выглядеть по-разному в зависимости от используемой программы и ожиданий специалиста. Раньше дизайнеры и разработчики сайтов делали прототип с помощью ручки и блокнота, а после уже переносили схему на сайт. Сейчас в этом нет необходимости, так как есть много программ для создания примерной структуры страницы или всего сайта. Далее несколько примеров.
Прототипы бывают статическими и динамическими. В первом случае речь идет о стандартной схеме с возможными описаниями блоков. Второй вариант — более продвинутый. Он подразумевает возможность навигации по сайту, нажатие на кнопки. Так более ясно вырисовывается картина того, как будет выглядеть
Что должно быть в прототипе
В одном прототипе может быть:
- шапка;
- текстовая часть;
- сайдбар;
- футер;
- комментарии;
- отзывы;
- разделы и категории;
- форма подписки;
- окно чата;
- кнопки подписки;
- ссылки «Читай дальше»;
- логотип, контакты и т.д.
Макеты большинства сайтов выглядят одинаково. И это не потому что у дизайнера нет фантазии. Стандартный интерфейс — признак того что посетителю сайта будет комфортно, он сможет быстро найти нужный раздел. Особенно это важно для мобильной версии. Если человек привык к меню, открывающемуся в левой части через три полоски, ему будет трудно при другом расположении блоков.
Как создать прототип
Для этого можно использовать привычные программы: Microsoft Word, Office, Power Point, Adobe Photoshop. Но есть и специальные сервисы для создания прототипов. Например, JustMind, Marvel, InVision. С их помощью можно создать более профессиональный прототип, благодаря богатому функционалу. В итоге получается вполне ясная картина того, как будет выглядеть сайт.
При создании схемы страниц и сайта в целом не забывайте о вспомогательных элементах, таких как поиск, кнопка наверх, стрелки и указатели. С ними посетителям будет еще проще «путешествовать» по площадке. Пусть все будет в общем стиле, без ярких и разных цветов. Представьте себя на месте нового посетителя вашего сайта, и будет проще создать правильную схему.
Нужна помощь? Напишите мне!