Дизайн
ADN Agency
2733

Как правильно принимать прототип будущего сайта

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

В закладки
Аудио

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

Договоритесь о разрешении экрана

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

Поэтому уточните, под какое разрешение экрана сделан макет. Если вы привыкли работать на определённом устройстве, можно заранее попросить прототип именно под разрешение его экрана. Например, наш внутренний стандарт для прототипов — это экраны MacBook Pro, Air 13 или 1440 по ширине.

Сфокусируйтесь на структуре и функциональности

Прототип не должен вызывать эмоции своим внешним видом. До дизайна сайта ещё далеко. Шрифты в прототипе используются самые простые, цвета — нейтральные, ведь они не должны отвлекать внимание от структуры.

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

Прототипы собирают на основе детального исследования бизнеса. Главное, на чём здесь фокусируется проектировщик, — логика, поведение пользователя и последовательность его действий. Когда вы принимаете прототип, попробуйте представить себя на месте пользователя и пройти его путь на сайте.

Блоки из серых квадратов на презентации — это абсолютно нормально

Обсуждайте и вносите корректировки

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

Нужно забыть фразы: «решим потом», «позже посмотрим, когда будет готов дизайн» — на этапе дизайна и разработки те же самые изменения обойдутся вам гораздо дороже.

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

Определитесь с внешними сервисами

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

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

Так может выглядеть выбор способа доставки на прототипе

Уточните, было ли проведено семантическое проектирование

Семантическое проектирование — это подбор поисковых слов, которые описывают компанию и её продукт. Оно помогает при создании структуры сайта или каталога, поэтому должно быть проведено уже при создании прототипа.

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

Так выглядит структура сайта после полной проработки семантического ядра каталога

Соберите обратную связь

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

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

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

Готово. Вы восхитительны!

  • Теперь вы знаете, как будет выглядеть продукт. Чего не хватало — добавили, лишнее — отсекли.
  • Правки согласованы заранее, и на это не ушло много ресурсов.
  • В проект заложили все нужные вам и вашим коллегам сервисы и инструменты.
  • Проведено семантическое проектирование — сайт будет готов к продвижению сразу после запуска.

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

Материал опубликован пользователем.
Нажмите кнопку «Написать», чтобы поделиться мнением или рассказать о своём проекте.

Написать
{ "author_name": "ADN Agency", "author_type": "self", "tags": [], "comments": 6, "likes": 27, "favorites": 50, "is_advertisement": false, "subsite_label": "design", "id": 73308, "is_wide": false, "is_ugc": true, "date": "Fri, 28 Jun 2019 11:29:10 +0300", "is_special": false }
0
{ "id": 73308, "author_id": 107621, "diff_limit": 1000, "urls": {"diff":"\/comments\/73308\/get","add":"\/comments\/73308\/add","edit":"\/comments\/edit","remove":"\/admin\/comments\/remove","pin":"\/admin\/comments\/pin","get4edit":"\/comments\/get4edit","complain":"\/comments\/complain","load_more":"\/comments\/loading\/73308"}, "attach_limit": 2, "max_comment_text_length": 5000, "subsite_id": 199114, "last_count_and_date": null }
6 комментариев
Популярные
По порядку
Написать комментарий...
0

В целом все по делу, кратко и в точку. Есть один только вопрос:
Зачем делать семантическое проектирование именно на этапе проектирования?

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

Ответить
0

На мой взгляд, для начала бизнесу нужно ответить на вопрос, планируется ли в будущем продвигать сайт в поисковиках?

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

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

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

Ответить
0

Согласен с вами, но частично.

Просто зачастую бывают случаи в ИМ, когда семантику подготовить не так сложно, однако собственник еще не определился с множеством факторов, например, не знает какая будет выгрузка товаров (а под готовые разделы делать выгрузку из 1С прибавит дополнительных расходов и немаленьких. Даже был случай, когда в прототипе заложили одно название (максимум 3 строки), а уже после этапа дизайна приходит выгрузка и получается, что название не только в 3 строки, а еще и дублируется на английском. Это приводит к еще большим трудозатратам.) или не определился будет ли доставка в другие регионы и ее стоимостью (а разделы уже проработаны и в случае отказа они либо отложатся в долгий ящик, либо будут излишне израсходованные средства).

По поводу продвижения тоже спорный вопрос.
Допустим есть компания, которая решила запустить свою линию одежды в онлайн. Товарных позиций не так много 50-70, с размерным рядом и цветом получаем где-то 300-400 торговых предложений. Семантику для них сделать очень просто - это несколько разных разделов и только (это можно сделать после этапа верстки и программирования), а вот продвижение? Просто добавив SEO теги с SEO фильтрами мы расширим товарные предложения до 1,5-2 тысяч. Причем эту компанию с ее мизерной товарной матрицей удалось вывести в топы (да, не на первую позицию, но в пятерке.) Так что начальное продвижение только по семантике - это ОЧЕНЬ спорный вопрос. Да, это один из примеров, но это подавляющее большинство сайтов с среднем и низшем сегменте.

Ответить
0

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

Ответить
0

Тут наверное имелось ввиду к ЛПРам.
Например, если прототип утверждают несколько лиц: владелец бизнеса и несколько начальников.
Владелец будет смотреть на то, решает ли прототип задачи бизнеса. Маркетолог будет оценивать какой конверсии удастся добиться. Отдел продаж - как быстро и удобно найти нужный товар для дальнейшей коммуникации с клиентами.

Ответить
0

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

Ответить
{ "page_type": "article" }

Прямой эфир

[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "Article Branding", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "cfovx", "p2": "glug" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "bscsh", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-1104503429", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=bugf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Баннер в ленте на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudx", "p2": "ftjf" } } }, { "id": 16, "label": "Кнопка в шапке мобайл", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byzqf", "p2": "ftwx" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvc" } } }, { "id": 19, "disable": true, "label": "Тизер на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "p1": "cbltd", "p2": "gazs" } } } ] { "page_type": "default" }