Категория: Бланки/Образцы
Онлайн ресурсы занимают в настоящее время главенствующие позиции среди способов торговли, информатизации, и иных направлений общественной жизни. Без интернета современному человеку будет очень сложно существовать. Реальность заставляет систематизировать, структурировать и регулировать правоотношения, связанные с созданием и обслуживанием сайтов, регламентировать разработку проектов и технических заданий. Техническое задание на разработку сайта - это уникальный письменный акт подписываемый заказчиком и исполнителем услуг.
Техническое задание и разработка проекта - один из важнейших пунктов работы. На первом этапе важно знать и учитывать в бумагах все существенные исключительные компоненты. Конкуренция заставляет субъектов производить неповторимые творения, чтобы добиться успеха в бизнесе. Техническое задание является неотъемлемой частью контракта и подписывается одновременно с ним в необходимом количестве экземпляров. Разработка сайта должна осуществляться в строгом соответствии с техническим заданием.
Обязательные пункты технического задания на разработку сайтаДругие новости по теме:
Практическое занятие 1
«Составление технического задания на разработку web-сайта»
1.1 Научиться правильно составлять техническое задание на разработку web-сайта
Пояснение к работе
2.1 Краткие теоретические сведения
Техническое задание – первый и самый важный шаг на пути создания сайта. Это документ на основе которого Исполнитель разрабатывает сайт, а Заказчик оценивает качество готового продукта.
Техническое задание является неотъемлемой частью договора на разработку сайта и не может быть подправлено в течение всего периода создания web-сайта.
Техническое задание разделяется на три части:
· Назначение и цели создания сайта
ОБРАЗЕЦ ТЕХНИЧЕСКОГО ЗАДАНИЯ НА РАЗРАБОТКУ WEB-САЙТА
Техническое задание на разработку Веб-сайта
•1. Имя сайта (название домена) .
www._______.ru
Если домен www._____.ru будет занят, возможна замена имени.
•2. Название сайта.
Сайт ООО "______________". Далее - Фирма.
•3. Назначение сайта (цель создания сайта).
Представление Фирмы в Интернет: информация о Фирме, история Фирмы, партнёры Фирмы, Заказчики Фирмы, цены на оказываемые услуги, справочная техническая и юридическая информация, советы клиентам, сопроводительные графические рисунки, юридический адрес, почтовый адрес, схема проезда, контактная информация, банковские реквизиты, сведения об имеющихся вакансиях. Сайт должен способствовать привлечению клиентов и нахождению деловых партнеров.
•5. Основные ключевые слова, по которым сайт должны находить по запросам в поисковых системах и Интернет - каталогах .
Согласно материалам Заказчика.
Примечание:
Перечень ключевых слов для Веб-дизайнера сайта носит справочный характер и не входит в число обязательных параметров, подлежащих проверке при приемке сайта. Занимаемые сайтом позиции в рейтингах, каталогах и поисковых системах не оговариваются.
•6. Объём и состав текстовой и графической информации в электронном виде .
Согласно материалам Заказчика.
•7. Предполагаемая возрастная аудитория сайта .
От 30 лет и старше.
7.1. Предполагаемое возрастное ядро аудитории от 35 до 50 лет.
7.2. Данная информация носит рекомендательный характер. Цифровые показатели контролю и проверке при приёмке сайта не подлежат.
•8. Количество страниц сайта.
Сайт должен содержать следующие html страницы: 1 - Главная (домашняя) страница; 2 - Прайс-лист; 3 - Фото (каталог) товаров; 4,5,6,7,8,9,10 - Справочная информация; 11 - О Фирме; 12 - Офис; 13 - Партнёры; 14 - Вакансии; 15 - Потребности; 16 - Сервисы.
Количество html страниц сайта определяется Веб-дизайнером самостоятельно, исходя из объёма предоставленных материалов Заказчика.
•9. Кнопки управления (навигация сайта) .
Определяются Веб-дизайнером самостоятельно.
С каждой страницы сайта должен быть обеспечен переход (установлена гиперссылка) на главную страницу сайта. Сайт должен содержать страницу "Содержание" (карта сайта).
•10. Блок схема сайта .
Определяется Веб-дизайнером самостоятельно.
Головная (начальная) страница сайта должна содержать гиперссылки, обеспечивающие переход с нее на не менее чем 95% страниц сайта, но не более чем 160 гиперссылок.
•11. Объём сайта, Мб.
Не оговаривается.
•12. Оформление рисунков .
Все рисунки объемом более 1 Кб должны быть выполнены с замещающим текстом. Рисунки размером более 15 Кб должны быть выполнены с предпросмотром. Формат всех рисунков gif или jpg (jpeg).
•13. Пропускная способность линии связи .
Среднее время загрузки страниц не должно превышать 28 секунд при скорости соединения 28.8 Кбит/сек. Допускается увеличение времени загрузки отдельных страниц до 36 секунд, но не более чем на 30% числа страниц сайта. Головная (начальная) страница должна иметь время загрузки не более 40 секунд.
Примечание :
Во всех случаях не учитывается время загрузки подгружаемых элементов (счетчики, баннеры, информеры и т.д.).
•14. Основной диапазон разрешения мониторов, на которых будет просматриваться сайт .
От 600х800 до 1240х1024 пикселей.
Основное разрешение, на которое оптимизируется сайт: 1024х768 пикселей.
•15. Минимальное разрешение монитора, на котором будет просматриваться сайт .
600 х 800 пикселей. При указанном разрешении возможность просмотра страниц сайта без горизонтальной прокрутки браузера не предусматривается.
•16. Основной браузер, которым будет просматриваться сайт, и его минимальная версия .
IE 5.5 и выше.
•17. Цветовая палитра .
Основной режим мониторов, на которых будет просматриваться сайт: 15 разрядов цветов и выше (число цветов 65536 и выше).
При разработке сайта должен быть обеспечена возможность его просмотра при использовании безопасной цветовой палитры (разрядность цветов 8). Изменения оттенков цветов, при просмотре сайта с использованием безопасной цветовой палитры, не оговариваются.
•18. Общий фон сайта .
Общий фон сайта светлый (белый). Допускается использование светлого фонового рисунка.
•19. Размер и вид шрифта сайта .
Размер шрифта сайта должен быть в пределах 10-12 для оформления текста. Размер шрифта для оформления заголовков, названия страниц и т.д. не оговаривается. Вид (название) шрифта не оговаривается.
•20. Регистрация сайта в каталогах, рейтингах, топах и пр .
Оговаривается дополнительно.
•21. Проведение рекламной кампании по раскрутке сайта.
Раскрутка сайта определяется отдельным техническим заданием.В настоящем техническом задании раскрутка сайта не оговаривается и не входит в состав выполняемых работ (услуг).
•22. Срок разработки сайта.
Три недели со дня зачисления 70% предоплаты на расчётный счёт Веб-студии.
•23. Порядок передачи сайта .
Веб-дизайнер передает сайт на CD ROM, а также логин, пароль и название (код передачи данных) по протоколу ftp.
Заказчик обязан проверить наличие грамматических и орфографических ошибок на сайте в течение трех рабочих дней. Обнаруженные ошибки Веб-дизайнер обязан устранить в течение трех рабочих дней.
•24. Сопровождение сайта.
Сопровождение сайта определяется отдельным техническим заданием.В настоящем техническом задании сопровождение сайта не оговаривается и не входит в состав выполняемых работ (услуг).
•25. Дополнительные условия.
Каждая страница сайта должна содержать логотип и название Фирмы.
Внизу на каждой странице сайта должна быть указана контактная информация.
Сайт должен содержать не менее двух счетчиков подсчета посетителей.
Материалы предоставляемые Заказчиком:
Текстовая (формат Word) и графическая информация (формат jpeg и gif), представленные на CD ROM.
«Составление технического задания на разработку web-сайта»
1.1 Научиться правильно составлять техническое задание на разработку web-сайта
Пояснение к работе
2.1 Краткие теоретические сведения
Техническое задание – первый и самый важный шаг на пути создания сайта. Это документ на основе которого Исполнитель разрабатывает сайт, а Заказчик оценивает качество готового продукта.
Техническое задание является неотъемлемой частью договора на разработку сайта и не может быть подправлено в течение всего периода создания web-сайта.
Техническое задание разделяется на три части:
· Назначение и цели создания сайта
ОБРАЗЕЦ ТЕХНИЧЕСКОГО ЗАДАНИЯ НА РАЗРАБОТКУ WEB-САЙТА
Техническое задание на разработку Веб-сайта
•1. Имя сайта (название домена) .
www._______.ru
Если домен www._____.ru будет занят, возможна замена имени.
•2. Название сайта.
Сайт ООО "______________". Далее - Фирма.
•3. Назначение сайта (цель создания сайта).
Представление Фирмы в Интернет: информация о Фирме, история Фирмы, партнёры Фирмы, Заказчики Фирмы, цены на оказываемые услуги, справочная техническая и юридическая информация, советы клиентам, сопроводительные графические рисунки, юридический адрес, почтовый адрес, схема проезда, контактная информация, банковские реквизиты, сведения об имеющихся вакансиях. Сайт должен способствовать привлечению клиентов и нахождению деловых партнеров.
•5. Основные ключевые слова, по которым сайт должны находить по запросам в поисковых системах и Интернет - каталогах .
Согласно материалам Заказчика.
Примечание:
Перечень ключевых слов для Веб-дизайнера сайта носит справочный характер и не входит в число обязательных параметров, подлежащих проверке при приемке сайта. Занимаемые сайтом позиции в рейтингах, каталогах и поисковых системах не оговариваются.
•6. Объём и состав текстовой и графической информации в электронном виде .
Согласно материалам Заказчика.
•7. Предполагаемая возрастная аудитория сайта .
От 30 лет и старше.
7.1. Предполагаемое возрастное ядро аудитории от 35 до 50 лет.
7.2. Данная информация носит рекомендательный характер. Цифровые показатели контролю и проверке при приёмке сайта не подлежат.
•8. Количество страниц сайта.
Сайт должен содержать следующие html страницы: 1 - Главная (домашняя) страница; 2 - Прайс-лист; 3 - Фото (каталог) товаров; 4,5,6,7,8,9,10 - Справочная информация; 11 - О Фирме; 12 - Офис; 13 - Партнёры; 14 - Вакансии; 15 - Потребности; 16 - Сервисы.
Количество html страниц сайта определяется Веб-дизайнером самостоятельно, исходя из объёма предоставленных материалов Заказчика.
•9. Кнопки управления (навигация сайта) .
Определяются Веб-дизайнером самостоятельно.
С каждой страницы сайта должен быть обеспечен переход (установлена гиперссылка) на главную страницу сайта. Сайт должен содержать страницу "Содержание" (карта сайта).
•10. Блок схема сайта .
Определяется Веб-дизайнером самостоятельно.
Головная (начальная) страница сайта должна содержать гиперссылки, обеспечивающие переход с нее на не менее чем 95% страниц сайта, но не более чем 160 гиперссылок.
•11. Объём сайта, Мб.
Не оговаривается.
•12. Оформление рисунков .
Все рисунки объемом более 1 Кб должны быть выполнены с замещающим текстом. Рисунки размером более 15 Кб должны быть выполнены с предпросмотром. Формат всех рисунков gif или jpg (jpeg).
•13. Пропускная способность линии связи .
Среднее время загрузки страниц не должно превышать 28 секунд при скорости соединения 28.8 Кбит/сек. Допускается увеличение времени загрузки отдельных страниц до 36 секунд, но не более чем на 30% числа страниц сайта. Головная (начальная) страница должна иметь время загрузки не более 40 секунд.
Примечание :
Во всех случаях не учитывается время загрузки подгружаемых элементов (счетчики, баннеры, информеры и т.д.).
•14. Основной диапазон разрешения мониторов, на которых будет просматриваться сайт .
От 600х800 до 1240х1024 пикселей.
Основное разрешение, на которое оптимизируется сайт: 1024х768 пикселей.
•15. Минимальное разрешение монитора, на котором будет просматриваться сайт .
600 х 800 пикселей. При указанном разрешении возможность просмотра страниц сайта без горизонтальной прокрутки браузера не предусматривается.
•16. Основной браузер, которым будет просматриваться сайт, и его минимальная версия .
IE 5.5 и выше.
•17. Цветовая палитра .
Основной режим мониторов, на которых будет просматриваться сайт: 15 разрядов цветов и выше (число цветов 65536 и выше).
При разработке сайта должен быть обеспечена возможность его просмотра при использовании безопасной цветовой палитры (разрядность цветов 8). Изменения оттенков цветов, при просмотре сайта с использованием безопасной цветовой палитры, не оговариваются.
•18. Общий фон сайта .
Общий фон сайта светлый (белый). Допускается использование светлого фонового рисунка.
•19. Размер и вид шрифта сайта .
Размер шрифта сайта должен быть в пределах 10-12 для оформления текста. Размер шрифта для оформления заголовков, названия страниц и т.д. не оговаривается. Вид (название) шрифта не оговаривается.
•20. Регистрация сайта в каталогах, рейтингах, топах и пр .
Оговаривается дополнительно.
•21. Проведение рекламной кампании по раскрутке сайта.
Раскрутка сайта определяется отдельным техническим заданием.В настоящем техническом задании раскрутка сайта не оговаривается и не входит в состав выполняемых работ (услуг).
•22. Срок разработки сайта.
Три недели со дня зачисления 70% предоплаты на расчётный счёт Веб-студии.
•23. Порядок передачи сайта .
Веб-дизайнер передает сайт на CD ROM, а также логин, пароль и название (код передачи данных) по протоколу ftp.
Заказчик обязан проверить наличие грамматических и орфографических ошибок на сайте в течение трех рабочих дней. Обнаруженные ошибки Веб-дизайнер обязан устранить в течение трех рабочих дней.
•24. Сопровождение сайта.
Сопровождение сайта определяется отдельным техническим заданием.В настоящем техническом задании сопровождение сайта не оговаривается и не входит в состав выполняемых работ (услуг).
•25. Дополнительные условия.
Каждая страница сайта должна содержать логотип и название Фирмы.
Внизу на каждой странице сайта должна быть указана контактная информация.
Сайт должен содержать не менее двух счетчиков подсчета посетителей.
Материалы предоставляемые Заказчиком:
Текстовая (формат Word) и графическая информация (формат jpeg и gif), представленные на CD ROM.
Я уже писал пост о том, какие страницы должны быть в интернет-магазине. писал другой пост — «Почему хороший дизайн — это одно из конкурентных преимуществ магазина». Этот пост — продолжение. На этот раз про серьезный подход к заказу дизайна, о том, что потребуется учесть, чтобы получилось хорошо, какие основные ошибки допускает заказчик и что в конечном итоге дает правильное написание ТЗ на дизайн интернет-магазина.
Каждый раз, когда дизайнер просит заказчика выслать требования, в мире умирает один котик, заказчик начинает гуглить, в надежде найти образец технического задания. Часто образцы ТЗ очень общие и обычно представляют собой простой бриф с основной информацией о компании. Не удивительно, ведь товары в магазинах разные, цели разные, аудитории отличаются, соответственно и дизайны должны отличаться, значит, найти шаблон технического задания, по-быстрому заполнить и отправить — плохая идея.
В этой статье разберемся, что мечтает увидеть дизайнер в техническом задании, что в нем писать, и на какие вопросы ответить.
Сразу предупреждаю, речь про тщательный подход. Поэтому если вы хотите управиться за час, лучше продолжайте искать шаблон ТЗ.
Парадокс заказчикаКазалось бы, заказчик — это максимально заинтересованное лицо в получении качественного, продающего дизайна для своего интернет-магазина. Ему этот дизайн оплачивать и с ним жить, от качества и продуманности дизайна во многом зависит конверсия магазина. Но почему-то заказчики постоянно норовят скинуть с себя работы по подготовке контента и присылают «рыбу» вместо чистовика, копируют у конкурента и т. п. Как результат, заказанный и оплаченный дизайн, получается «не про них», решает не их задачи, а какие-то «типовые».
В дизайне, сделанном без реального контента, нет акцента на важных продающих моментах в тексте, который появляется на сайте позже, когда дизайн уже готов, сверстан, а веб-сайт работает.
Поэтому, если нет желания всерьез готовить материал для магазина — не заказывайте дизайн, используйте готовое решение. Там как раз все универсально и усреднено. Поставите свой логотип, вобьете товары и текст, выделите важные места жирным и красным и окей. Кстати, у меня в блоге есть подробная статья о преимуществах готовых решений. Прочитайте, возможно, это решение действительно вам подойдет, тогда вы сэкономите много денег на разработке.
С чего начинается дизайн интернет-магазинаМногие полагают, что работа начинается с письма дизайнеру: «Уважаемый %дизайнер%, нам нужен дизайн интернет-магазина %название%. Сколько это будет стоить, и успеете ли вы до понедельника? Другие думают, что сначала нужен некий схематичный рисунок — скетч, вайрфрейм.
В обоих случаях результат будет, а если дизайнер опытный (делал много проектов вашей тематики), то получится не только красиво, но и удобно. Но все равно не совсем то.
Потому что разработка тех. задания на дизайн начинается с подготовки контента.
Под контентом я подразумеваю помимо текстов и фото еще и дополнительную информацию (пол и возраст аудитории, целевые действия для разных страниц, УТП, перечень и краткое описание маркетинговых программ и т. п.)
Что включать в техническое задание на дизайнЧем больше информации про будущий сайт вы предоставите – тем лучше дизайнер проработает общую концепцию дизайна и каждую страницу в отдельности, тем больше макет будет соответствовать вашим задачам.
Все идеи у дизайнера появляются только после ознакомления с информацией по заказу (контентом). Его может быть мало, например, только это:
Так делают почти все. Это самый распространенный список материалов, которые обычно заказчик включает в техническое задание на разработку дизайна своего интернет-магазина. Все прочее остается за кадром на усмотрение дизайнера и на его совести. Что-то переходит по эстафете на усмотрение верстальщика и далее на откуп программиста. Как вы понимаете, при таком подходе проблемы накапливаются на каждом шаге.
Более полный перечень материалов для дизайнера должен быть примерно таким:
Этот список значительно подробнее того минимума что обычно предоставляют дизайнеру (см. выше) но на полноту не претендует. Тем не менее, если пропустил что-то важное — пишите в комментах к этой статье.
Название магазинаФирменный стиль. Если есть обязательно дайте дизайнеру брендбук, чтобы дизайн интернет-магазина сочетался с общим стилем компании. Если брендбука нет, что вполне обычное дело, то могут пригодиться любые элементы вашего фирменного стиля (визитки, буклеты и т. п.) или пришлите хотя бы логотип. Если и логотипа нет, тогда дайте напишите рекомендации, что будет на сайте вместо логотипа. Например, это может быть просто название магазина, набранное текстом. Возможно, дизайнер согласится подумать над вашим лого за дополнительную оплату. Обсудите это с ним.
Общие требования и пожеланияНе стоит сначала писать, что адаптивный дизайн не нужен, а потом, когда дизайн почти готов передумать. Это не в ваших интересах. Может выйти как в том анекдоте. Лучше сделать адаптив сразу, тогда дизайнер сможет лучше продумать, как будет выглядеть мобильная версия дизайна, как складываться блоки и т. п.
Структура разделовГлавная, Каталог товаров, О магазине, Контакты, Поддержка и т. п. Про все разделы магазина есть отдельная статья. Достаточно подготовить в вордовском файле в виде нумерованного дерева или таблицы.
Структура каталога товаровТо же самое что структура разделов, но в данном случае это структура конкретно одного раздела «Каталог товаров». Если интернет-магазин небольшой и разделов в нем мало, то лучше будет объединить этот пункт с предыдущим. Если разделов и подразделов много, то удобнее вынести его в отдельный файл. Подготовить можно в формате Ворд, в виде маркированного списка в несколько уровней вложенности.
Обязательно отметьте наиболее важные разделы в каталоге товаров, чтобы на них сделать акцент.
Примерное количество товаровМагазины с маленьким ассортиментом отличаются от супермаркетов, поэтому дизайнер должен знать какой интернет-магазин он рисует. Обозначьте, пусть примерно, сколько товаров у вас будет в обозримом будущем. Не через 3–5 лет, когда вы захватите мир, а в ближайшие полгода.
Список страниц, которые должны быть нарисованы дизайнеромПосмотрите мою статью с таблицей (там можно скачать таблицу), в статье дается список, какие страницы нужно заказывать дизайнеру, кратко сказано зачем и расставлены приоритеты (высокий, средний, низкий).
Каждая страница, которую вы будете заказывать обязательно должна быть в структуре разделов (см. пункт выше «Структура разделов»). Не должно быть ситуации, когда в списке страниц к разработке есть, например, страница «Контакты» а в структуре ее нет. Это неверно. В обратную сторону вполне допустимо, т. е. список страниц к разработке может быть существенно меньше, чем общая структура магазина.
УТПУникальное торговое предложение (википедия ). Дайте дизайнеру ваше УТП, чтобы он хорошо показал его в дизайне. Небольшой пример УТП:
100% гарантия доставки. Мы гарантируем что ваш заказ будет вам доставлен и совершенно точно не потеряется по дороге. Как мы можем давать такие гарантии? Очень просто, мы берем ответственность на себя! Если заказ вдруг потеряется мы за свой счет продублируем заказ либо вернем вам полную стоимость заказа, включая расходы на доставку.
Конечно, только одного пункта для УТП недостаточно. Должны быть и другие, показывающие чем ваш магазин лучше. Мне нравится когда УТП обрабатывает страхи клиента.
Целевые действия для основных страницОб этом позже будет отдельная статья – подписывайтесь в соцсетях, чтобы не пропустить. Понятно, что в интернет-магазине основная цель – покупка. Но есть промежуточные цели: выбор товара, добавление в корзину, просмотр определенных страниц, просмотр или клик баннера акции и др.
Целевая аудиторияНа каких покупателей ориентирован магазин. Как минимум нужно указать пол и возраст.
Например, если у вас магазин женской одежды для полных, то скажите об этом дизайнеру, постарайтесь точно очертить целевую аудиторию, желательно уточнить, почему вы считаете что ваша целевая аудитория именно эта.
Для разработки правильного дизайна важно знание аудитории. Согласитесь, подача материала в интернет-магазине одежды для 40-50 летних пышек и толстушек из молодежной аудитории должна отличаться, так же как и стиль одежды для них.
Если в магазине разные разделы ориентированы на разные группы покупателей (по полу / возрасту / платежеспособности и т. п.) об этом тоже нужно сказать дизайнеру. Прочитайте статью о целевой аудитории и советах как составлять портрет покупателя .
Доступ в Я.Метрику, Google Analitics или LiveInternetЭтот пункт желателен, если вы переделываете дизайн у уже работающего магазина. Данные из этих систем аналитики многое могут сказать опытному дизайнеру. Если у вас работающий магазин, на нем установлена какая-то система аналитики, не упускайте возможность — сделайте к ней доступ дизайнеру. Как давать гостевой доступ к счетчикам. я писал в отдельной статье.
Контент для каждой страницыСамый объемный пункт при написании технического задания к дизайну. Желательно чтобы присутствовало содержимое для каждой страницы из «Списка страниц, которые должны быть разработаны дизайнером». Если в этом списке 50 страниц — для каждой должен быть свой контент. Либо если не контент, то описание что на странице будет размещено.
Контент, который вы отправляете дизайнеру, должен быть чистовиком! Не черновиком не тестовым, не для пробы, не временным, не скопированным у конкурентов, не «вставьте пока так, а позже доделаем». Чистовиком!
Если у вас не готов контент, значит, заказывать дизайн рано!
Не контент должен подгоняться под дизайн, а наоборот, правильный дизайн усиливает сказанное.
Информацию для каждой страницы можно вставить в отдельные файлы или все в один. Главное, чтобы дизайнеру было легко понять, что к какой странице относится. Обязательно картинки отдельно от текста.
Иногда заказчик присылает дизайнеру кучу неструктурированных файлов, среди которых винегрет из картинок, архивов, текстов, презентаций и pdf`ок. Заказчику самому лень разбираться в них, и он надеется, что разберется дизайнер. Это неправильно и неуважительно.
Если вы затрудняетесь сказать, что должно быть на системных страницах таких как «404 (страница не найдена)» и других подобных, то оставьте их стандартными, такими, как их выдает CMS или подсмотрите у конкурентов (о заимствовании сказано ниже). Можно честно написать в ТЗ что эти страницы нужны, но вы затрудняетесь дать им содержимое, и полагаетесь на его усмотрение (это только для системных страниц допустимо, для остальных заказчик должен собрать и прислать контент).
Давать что-то на усмотрение дизайнера можно только в том случае если вы ему доверяете.
Часто заказчик сначала говорит, что полагается на мнение дизайнера, а когда видит результат, у него появляются идеи, он начинает требовать корректировки, хотя ранее писал, что не знает как сделать правильно — это порядком бесит, не надо так.
Пример описания товараПри составлении ТЗ, нужно дать дизайнеру описание, как товар будет представлен на карточке товара. Какие у него будут характеристики, параметры, описание.
Не забудьте указать, какие из перечисленных параметров покупатель может выбирать. Например, для одежды обычно выбирается цвет и размер.
Понятно, что не у каждого товара одновременно будут присутствовать все перечисленное, но, как вы понимаете, дизайнер должен нарисовать универсальную карточку товара, чтобы учесть в ней место для всей информации.
Перечислю некоторые параметры и характеристики, наиболее часто встречающиеся при описании товара:
Этот список далеко не полный — только пример, что нужно указывать при описания товара в ТЗ для дизайнера. Посмотрите статью «Главные кнопки в интернет-магазине», в которой говориться что и в каких случаях писать на кнопке «Купить» .
Разные карточки товараЕсли у вас в магазине продаются товары очень разные, например, телевизоры и одежда, то описание карточки товара нужно сделать свое для каждого такого типа товара. Как минимум потому что у них существенно отличаются описания, параметры и характеристики. Поэтому универсальности может не получиться. А еще потому что иногда имеет смысл не грести все под одну гребенку, а сделать разный дизайн карточек товара для очень разных типов товаров.
То же самое, если товары сильно отличаются по аудитории и/или цене. Например, если в продаже есть обычные свадебные платья и вип-платья, они отличаются по цене и по платежеспособности аудитории, то есть смысл сделать другой дизайн карточки товара для таких платьев, чтобы дополнительно подчеркнуть их особый статус. А то и вообще сделать свой дизайн всему разделу.
Кто-то, может быть, помнит, как выглядел магазин «Евросеть» в исполнении Студии Артемия Лебедева? Там как раз был реализован подобный подход — отличались карточки товаров для обычных телефонов и вип моделей. Кому интересно, посмотрите в Веб-архиве. Ссылки я дал.
Инструменты на сайтеКакие будут, на какой странице / разделе. В ТЗ на дизайн обязательно нужно перечислить функционал каждой страницы. В интернет-магазине обычно это:
Работает магазин на один город, на несколько или на всю страну.
Если у вас несколько магазинов или точек самовывоза, скажите об этом сразу, чтобы страница «Контакты» была сделана правильно, а в корзине не забыли функционал по выбору точек самовывоза.
Поля в корзинеПоля которые будет заполнять покупатель, чтобы оформить заказ, способы доставки, способы оплаты, взаимозависимость их между собой .
Готовность к обсуждениюЕсли вы непрофессионал и допускаете что можете быть неправы, при этом доверяете опыту дизайнера, стоит написать в ТЗ примерно следующее: «Если вы считаете что я ошибаюсь в каком-то из своих пожеланий, или что-то в моих идеях можно улучшить / упростить / сделать оптимальнее — давайте обсуждать, я с радостью прислушаюсь к вашему мнению».
Прорабатывая дизайн нужно помнить что некоторые, на первый взгляд простые вещи в функционале могут сильно усложнить работу программисту, а значит, увеличить цену разработки. Или, что хуже, усложнить вашу дальнейшую работу над сайтом, добавив большой пласт рутинной ручной работы, которой нужно избегать и автоматизировать (ручная работа приводит к накоплению ошибок на сайте).
Для разных проектов пункты, конечно, могут меняться и дополняться. Но даже этот усредненный перечень материалов, которые нужно давать в ТЗ на дизайн, если будет с должным вниманием подготовлен заказчиком, существенно улучшит качество дизайна для вашего интернет-магазина. Конечно, если попадет к адекватному дизайнеру.
Три типа дизайнеровРаз уж говорим про правильный подход к разработке дизайна интернет-магазина, следует отметить, что важная часть успеха — правильный дизайнер. Если дизайнеру безразличен результат, который получит клиент и важно сделать ровно настолько, чтобы работа была принята, то даже самое подробное ТЗ на дизайн сайта не гарантирует качественного результата. Хотя нужно отметить, что имея на руках детально описанное задание, заказчику проще контролировать ход работы и указывать на недостатки.
Для простоты я делю дизайнеров всего на 3 группы:
Хороший дизайнерИмеет большой опыт работы, ему важно непросто заработать, но и чтобы у клиента был результат. Понимает что цель дизайна — эффективность решения задач. Знает о существовании целевых действий, понимает как среди них расставлять акценты и приоритеты. Такой дизайнер задает много вопросов, вытягивать из клиента как можно больше информации. Часто у заказчика после общения с ним появляется неприятное ощущения «я так мало понимаю в этом». Такой дизайнер старается вникнуть в проект, предлагает свои идеи решения или даже функционал. Мыслит не только как художник, но и как UX-специалист и маркетолог.
Мастер фотошопаДизайнер, которому не все равно какие работы у него получаются — сделает красиво. Красота — высшая целесообразность. Удобность вторично, эффективность — нет, не слышал. Красивые дизайны нравятся заказчикам и легко ими принимаются, поэтому работы у такого дизайнера обычно много. Если дать ему хорошее ТЗ — сделает хорошо, но по привычке будет уходить в красивости.
Х1як, Х1як и в продакшнДизайнер, который работает просто за деньги, сделает, «как получится», на основе той инфы что уже есть, внесет правки, поступившие от клиента и готово. Следующий!
Клиентоориентированная версия этого дизайнера предложит заказчику несколько цветовых схем и поиграет со шрифтами.
Такие дизайнеры не привыкли работать качественно, в их отношении к работе всегда будет заметен подход «поскорее отвязаться от этого заказа и взять следующий», они постоянно пытаются «забыть» о каких-то пунктах в ТЗ, имеют низкий уровень работы в целом, для скорости используют клипарты, библиотеки иконок, пиратские шрифты, часто не заморачиваются на удобную компоновку слоев в исходнике, что затрудняет работу верстальщика. Но плохому дизайнеру наплевать на это, равно как на эффективность дизайна, который он сделал. Даже самое продуманное ТЗ на дизайн не существенно улучшит его работу.
Три приведенных типа дизайнеров — это неполная «классификация». Есть промежуточные варианты. Многое зависит от заказчика. Можно и хорошего дизайнера задолбать глупыми требованиями, он устанет спорить, махнет рукой и персонально для вас спустится со своего первого места на второе или даже третье.
Кто-то сейчас подумал, что для успеха достаточно найти правильного дизайнера, а уж он даже с минимальным ТЗ сделает дизайн магазина на отлично. Это так, но только отчасти. Хотите действительно хороший результат, тогда не забывайте, о чем было сказано в начале статьи — главное в дизайне — контент. А за вас его никто не подготовит / разработает / соберет.
Почему не нужно копировать лидеров рынкаПродумывая задание на дизайн интернет-магазина не всегда нужно смотреть на крупных конкурентов – лидеров рынка.
Какие-то вещи перенимать нужно, но осознанно, понимая, зачем вы это делаете. Нельзя слепо копировать функционал, только потому, что так сделано у лидера.
Сайты больших интернет-магазинов имеют свою специфику в силу количества групп товаров, большого числа разделов и подразделов, огромного ассортимента. Поэтому небольшим интернет-магазинам не пойдет на пользу копирование крупных. Да и не всегда у лидера все идеально в плане юзабилити и SEO.
Почему-то принято считать, что лидеры постоянно тестируют свои магазины на эффективность, внедряют новшества, семь раз отмерив. Считается, что если какая-то деталь у них сделана именно так, значит, так нужно. Возможно, так и есть в Амазон.ком или Заппос.ком, но идеализировать в этом плане топ интернет-магазинов Рунета точно не стоит.
Крупные интернет-магазины, главенствующие в какой-то нише, обычно обновляют дизайн и функционал своего сайта не слишком часто (на то у них есть свои веские причины). Если об этом не помнить, есть шанс скопировать устаревший сайт, которому уже 3-4 года, а через несколько месяцев после своего запуска узнать что «образец для подражания» был кардинально обновлен.
Конечно, нужно изучать чужой опыт и перенимать хорошие решения. Например, если вы не знаете как в вашем интернет-магазине одежды сделать вывод показов результатов поиска по товарам, то идите в Вилдберриес, Ламоду, КупиВип и посмотрите как сделано у них. Бенчмаркинг — нормальная практика.
Если вы не знаете как лучше сделать пагинацию в каталоге товаров, то перенимать опыт у Вилбдеррис и Ламоды не стоит. Посмотрите статью про правильную пагинацию .
И еще, некоторые заказчики любят рисовать вайрфреймы / скетчи и отправлять их дизайнеру. не нужно этого делать. Хороший дизайнер на ваши вайрфреймы особого внимания не обратит. Если посчитает нужным – сделает по-своему. Плохой дизайнер сделает, все как вы нарисовали, лишь бы вы работу приняли. Для себя, чтобы лучше представлять структуру страницы, раскладку на странице объектов – делайте. Но отправлять дизайнеру не нужно.
Что дает тщательная подготовка ТЗ на дизайнПереходим к любимому раздела Капитана Очевидность. Перечислим плюсы, которые дает тщательный подход к разработке технического задания на дизайн сайта.
Сразу видим каким будет дизайнОгромный плюс в предоставлении дизайнеру контента для всех страниц в том что, принимая дизайн, вы будете видеть, как выглядит именно ваш сайт, а не какой-то абстрактный сайт с фотками и текстами, надерганными для примера из других интернет-магазинов. Это позволит не отвлекаться на красивые картинки, которые для примера поставлены дизайнером, а оценивать объективно, видеть страницы ровно так, как их будет видеть потенциальный покупатель и делать это на стадии дизайна, а не в самом конце, когда контент-менеджер уже внес материал в готовый сайт и завтра открытие.
Заранее видим проблемы дизайнаДругой важный момент, вытекает из предыдущего. Дизайн, сделанный без использования тестовых материалов, а целиком на информации, предоставленной заказчиком, поможет заказчику увидеть свои проблемы еще до запуска магазина на этапе дизайна. Хочется ли купить? Достаточно ли убедительно выглядит товар, чтобы продавать его за такую цену? Убеждают ли вас тексты на сайте о том, что вам можно доверять. Все ли достаточно просто и понятно? Только одно это понимание уже дорогого стоит.
Вполне может оказаться, что заказчик, увидев, как плохо выглядят в каталоге товаров фотографии одежды, отснятые на манекене, решит переснять весь ассортимент с привлечением проф. модели. Потому что, посмотрев, дизайн он понял, что сам не купил бы так плохо представленный товар даже за вдвое меньшую цену.А если бы дизайнер поставил в этот же макет фотографии «для примера», то заказчик понял бы проблему только спустя 1-2 мес. когда в готовый сайт, за несколько дней до запуска разместили реальные (а не тестовые) товары. Таким образом, бюджет, запланированный на старт, для первоначальной рекламы проекта будет слит впустую, только за счет плохой привлекательности товаров (никто не будет покупать), или придется откладывать запуск. А предоставив дизайнеру фотографии товара сразу, клиент получил 1-2 месяца времени на то, чтобы сделать нормальную фотосессию. А за эти 1-2 месяца как раз закончится разработка интернет-магазина.
Лучшее решение бизнес-целейХороший дизайн, сделанный по вашему контенту (без «рыбы»), лучше доносит важную информацию до покупателя, делает все сказанное на сайте более убедительным. Помогает подать материал правильно, в нужной последовательности, с акцентами на целевых действиях и на важных местах в тексте.
Предсказуемость результатаЧем тщательнее техзадание на дизайн, чем больше страниц будет разработано, тем более предсказуемым будет результат. Проще говоря, когда у вас есть подробный, детально проработанный дизайн, вы уже точно знаете чего ожидать. В этом случае дизайн будет являться своего рода техническим заданием для следующих этапов – верстки и интеграции в CMS (я, по традиции под CMS подразумеваю 1C-Битрикс :-)
Без внятного ТЗ — результат ХЗ.
— народная мудрость.
Все знают что риски нужно сокращать, если мы хотим получить более-менее предсказуемый результат, в сколько-то приемлемые сроки, за более-менее ту цену, на которую рассчитывали. Так вот, если у вас детально проработан дизайн – это два ТЗ: на верстку и на программинг.
Конечно, наличие отдельных заданий на верстку и программную часть лишними не будут, можете — сделайте. Но обычно настолько идеальных проектов не бывает. Поэтому когда в дизайне отрисована каждая страница, каждое модальное окно — это очень упрощает работу front-end-разработчику и программисту.
Простой пример: если страницы отрисованы не все что нужны, то в верстке они тоже будут не все. Но при этом страницы типа «Ошибка 404 — страница не найдена» и т. п. все равно нужны.
Если магазин разрабатывает студия, они эти моменты обычно учитывают, если заказчик сам управляет созданием магазина (и не разбирается в технической части), сначала заказывает дизайн, потом верстку и т. д. — ошибки неизбежны.
Заказчик может вообще не знать о некоторых страницах, которые должны присутствовать.
Либо не сможет объяснить «техническим языком» что и как должно быть сделано на тех страницах, которых нет в дизайне, но которые нужны. Это вызывает непонимание со стороны сначала верстальщика, а потом программиста. Ведет к неверной оценке объема работы, которая в итоге ложится на заказчика.
Поэтому чтобы избежать странных формулировок в объяснениях с верстальщиком или программистом типа «Страниц нет, но они нужны» лучше все же их заранее отрисовать. Да, вы больше потратитесь на дизайн, но здорово увеличите вероятность получить свой интернет-магазин сразу на приемлемом уровне.
Можно будет снизить вероятность, когда верстальщик или программист скажут «работа о которой вы говорите не входила в оговоренный объем и нужно доплатить».
Я уже давал выше ссылку на статью, где подробно перечислены страницы магазина, которые нужно заказывать дизайнеру. Но хочу отметить, что не всегда нужен полный список страниц, перечисленных в той статье.
Аргумент в конфликтных ситуациях. Когда все требования к дизайну описаны должным образом, при возникновении спорных, ситуаций (например, при верстке) вы можете ссылаться на свое подробное ТЗ, как на железный аргумент. Этот документ, приложенный к договору, будет отличным подспорьем.
ПодытожимГлавная ошибка при заказе дизайна — не давать всю необходимую инфу дизайнеру. Конечно, дизайнер сделает свою работу и с минимумом контента. Но сами подумайте, как ему сделать хорошо продуманную карточку товара, если он не знает точно, что на ней будет? Как сделать удобную корзину, если непонятно какие буду в ней поля и какая между ними взаимозависимость? А представьте что ему таких страниц для вашего магазина нужно отрисовать 20 – 50 шт. Приходится искать компромиссы, придумывать, как сделать универсально, чтобы материалы, которые пока не предусмотрены, позже было куда запихивать.
Другая ошибка — перечислить в ТЗ только список страниц (пусть даже с контентом для каждой), не сказав про «Целевые действия» и «Целевую аудиторию» (о наличии этих пунктов в ТЗ говорится выше). В этом случае ТЗ на дизайн формально перечисляет страницы, которые нужно нарисовать и элементы, которые на этой страницы должны присутствовать и не описывает основные моменты взаимодействия с клиентом. При таком подходе заказчика к ТЗ, дизайнер, если он не слишком заинтересован в результате может подойти к вопросу тоже формально — сделать что перечислено и посчитать на этом работу выполненной.
Хотите хорошо — не ленитесь, перед заказом дизайна подготовьте контент. Потому что соответствие дизайна вашим задачам пропорционально качеству материалов, который вы предоставите дизайнеру.
Повторюсь: Если у вас не готов контент для каждой страницы — дизайн заказывать рано.
Нельзя написать портрет, если заказчик не приходит позировать. Костюм, пошитый на заказ, будет не по размеру, если мерку снимут не с вас. С дизайном интернет-магазина то же самое — невозможно сделать хорошо, если заказчик не предоставил всей нужной информации.
Иногда, заказчику, если он уверен, что не справится с задачей, стоить нанять исполнителя не только на дизайн, но и на составление ТЗ. Если, конечно, на это есть бюджет. Разработка технического задания на дизайн или проектирование, техзадание на верстку и контроль выполнения, ТЗ на программную часть — такие же этапы работы, как и создание дизайна сайта. Только эти этапы менее очевидные и неспециалистам мало заметны. Даже если их не делают именно как отдельные этапы, так или иначе, они все равно выполняются.
А разработку прототипов не рассматриваете как отдельный этап работы? У нас в студии дизайнеры рисуют сайты только на основе прототипов, которые делают (чаще всего совместно): руководитель; менеджер/маркетолог, который общался с клиентом и сделал наброски ТЗ; прототипщик/UI/UX специалист, который рисует прототип и в итоге готовит и конкретное ТЗ, верстальщик/программист, который все это будет разрабатывать; и собственно сам дизайнер, чаще всего без него. На выходе получается полуготовый сайт с проработанными текстами, примерным расположением блоков, фото и т.д. Дизайнеру остается лишь творить. )
Ни разу не встречал дизайнера, который и общается с клиентом и будет вникать в ТЗ и маркетолог хороший и немного программист и верстальщик UX т.д. Интересно сколько такие стоят? И останется ли время на, собственно, сам дизайн, который процесс скорее творческий :)
ps/ сам не дизайнер.
А разработку прототипов не рассматриваете как отдельный этап работы? У нас в студии дизайнеры рисуют сайты только на основе прототипов, которые делают (чаще всего совместно): руководитель; менеджер/маркетолог, который общался с клиентом и сделал наброски ТЗ; прототипщик/UI/UX специалист, который рисует прототип и в итоге готовит и конкретное ТЗ, верстальщик/программист, который все это будет разрабатывать; и собственно сам дизайнер, чаще всего без него. На выходе получается полуготовый сайт с проработанными текстами, примерным расположением блоков, фото и т.д. Дизайнеру остается лишь творить. ) Ни разу не встречал дизайнера, который и общается с клиентом и будет вникать в ТЗ и маркетолог хороший и немного программист и верстальщик UX т.д. Интересно сколько такие стоят? И останется ли время на, собственно, сам дизайн, который процесс скорее творческий :) ps/ сам не дизайнер.
Сергей, добрый день! Не увидел сразу ваш коммент, поэтому отвечаю с опозданием. Эта статья - советы _заказчику_ как правильно писать ТЗ на дизайн, а не этапы разработки дизайна. Если заказчик будет следовать советам в статье хотя бы на половину, то у менеджера, проектировщика, дизайнера и других участников конфессии работы по анкетированию клиента будет меньше, а клиент получит дизайн, более соответствующий его задачам.
Комментарий был изменен 31.07.2015 в 14:55
Сергей, добрый день! Не увидел сразу ваш коммент, поэтому отвечаю с опозданием. Эта статья - советы _заказчику_ как правильно писать ТЗ на дизайн, а не этапы разработки дизайна. Если заказчик будет следовать советам в статье хотя бы на половину, то у менеджера, проектировщика, дизайнера и других участников конфессии работы по анкетированию клиента будет меньше, а клиент получит дизайн, более соответствующий его задачам.
Да я в курсе про название статьи. В том то и дело, что по ней складывается впечатление, что ТЗ пишется только для дизайнера, и заказчик должен контактировать только с дизайнером и решать все вопросы с ним, вплоть до показа ему вашей метрики. Быть может в среде фрилансеров так и происходит, но в студиях, повторюсь, дизайнер чаще всего даже не смотрит ТЗ, обращается к нему если только нужно уточнить детали (по крайней мере так было в трех компаниях где я работал)
Вообще ТЗ - техническое задание, в моем понимании это совокупность всех данных (больше именно технических) как именно работает сайт, какие там блоки, модули, как они работают и т.д.
Не хочу с вами спорить, статья прекрасна, но правильнее было бы ее назвать просто "Правильный подход к разработке технического задания" :)
Да я в курсе про название статьи. В том то и дело, что по ней складывается впечатление, что ТЗ пишется только для дизайнера, и заказчик должен контактировать только с дизайнером и решать все вопросы с ним, вплоть до показа ему вашей метрики. Быть может в среде фрилансеров так и происходит, но в студиях, повторюсь, дизайнер чаще всего даже не смотрит ТЗ, обращается к нему если только нужно уточнить детали (по крайней мере так было в трех компаниях где я работал) Вообще ТЗ - техническое задание, в моем понимании это совокупность всех данных (больше именно технических) как именно работает сайт, какие там блоки, модули, как они работают и т.д. Не хочу с вами спорить, статья прекрасна, но правильнее было бы ее назвать просто "Правильный подход к разработке технического задания" :)
Да, нужно будет дописать, что заказ дизайна сайта в студии и у фрилансера, по понятным причинам, происходит по-разному.
Вы читали статью с позиции разработчика. Но этот пост написан для заказчика, чтобы помочь правильно сформулировать требования к дизайну. Даже когда работу делает не фрилансер, а студия, в которой есть толковый менеджер, который задаст все правильные вопросы, все верно поймет и передаст дальше, дизайн все равно получается "средним по больнице". Т.е. как раз то о чем я писал в статье, когда контент подгоняется под дизайн, а не наоборот. Поэтому заказчик должен по максимуму описать свои задачи. Я ему в этой статье помогаю это сделать.
Да, нужно будет дописать, что заказ дизайна сайта в студии и у фрилансера, по понятным причинам, происходит по-разному. Вы читали статью с позиции разработчика. Но этот пост написан для заказчика, чтобы помочь правильно сформулировать требования к дизайну. Даже когда работу делает не фрилансер, а студия, в которой есть толковый менеджер, который задаст все правильные вопросы, все верно поймет и передаст дальше, дизайн все равно получается "средним по больнице". Т.е. как раз то о чем я писал в статье, когда контент подгоняется под дизайн, а не наоборот. Поэтому заказчик должен по максимуму описать свои задачи. Я ему в этой статье помогаю это сделать.
Поэтапное внедрение фишек в интернет-магазине
Простые примеры персонализации в интернет-магазине
Как работать с неуникальным описанием товаров в интернет-магазине
4 больших ошибки, которые допускают при создании новой версии интернет-магазина
Неверные приоритеты при работе над интернет-магазином
Под какие задачи стоит заказывать лендинг-пейдж и нужно ли это делать
Как небольшому интернет-магазину выглядеть серьезнее в глазах покупателя. 7 советов
Улучшаем крауд-маркетинг. Как сделать чтобы ваши посты и отзывы не удаляли модераторы ресурсов
Правильная пагинация в каталоге товаров
Поисковое продвижение без волшебства
Оптимизация карточки товара при продвижении интернет-магазина
12 важных вещей для внутренней оптимизация сайта, о которых обычно забывают при разработке
Автоматическая выгрузка в социальные сети материалов с вашего сайта
35 причин снижающих продажи интернет-магазина: как увеличить конверсию сделанных заказов в оплаченные (1 часть)
Структура разделов интернет-магазина: — какие страницы заказывать дизайнеру (1 часть)