fbpx

Прототип сайта — как создать, чтобы разработчик не налажал :-)

Прототип сайта — как создать, чтобы разработчик не налажал :-)
31.08.2018 indexrun

Прототип сайта — как создать, чтобы разработчик не налажал 🙂

Прототипирование страницпродумывание содержания и расположение важных элементов страницы таких как:

  • навигация;
  • контактная информация;
  • CTA-элементы;
  • контент;
  • логотипы;
  • header (шапка сайта);
  • footer (подвал) и так далее;

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

Давайте разбираться!

Для чего нужно создание прототипа

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

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

Он ожидает увидеть что-то подобное, потому что он привык, что сайты выглядят так. Это совпадает с его пользовательским опытом.

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

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

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

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

Как создать прототип

Сначала у вас может возникнуть вопрос, что использовать для создания прототипа. Ответ очень простой – все. Любую программу, которая позволяет рисовать. Это может быть Adobe Photoshop, MS Paint, Adobe Illustrator, Gimp и другие. Можно воспользоваться Balsamiq, Axure, MS Word или Google.Docs.

Пример прототипа созданного в программе Balsamiq

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

А вот копирайтер, создавая прототип лендинга, должен делать это в программе, из которой можно будет скопировать текст в сверстанные элементы. Потому что копирайтер использует настоящий текст, а дизайнер, скорее всего, вставит lorem ipsum.

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

Пробуйте, рисуйте, создавайте! Обрисовка своих идей сильно облегчит работу подрядчику и сбережёт ваши время и деньги 🙂

 

Есть идеи, но нет времени создавать прототип?

Оставьте заявку, Мы сделаем всё сами! 

ЗАКАЗАТЬ ЗВОНОК

Понравилась статья? Поделись с друзьями 😉 

Комментариев нет

Оставьте отзыв

Ваш e-mail не будет опубликован.