Дмитрий Обвадов - Твоя продающая веб-студия за 14 дней
Найти ответственного фрилансера, который самостоятельно, без какого-либо контроля, будет выполнять качественно и своевременно проекты, всегда сложно. Найдя такого, вцепитесь в него мертвой хваткой и не отпускайте. Скорее всего, его услуги будут стоить немного дороже, чем услуги других фрилансеров, но эта трата окупится временем и стабильностью доверия к вашей компании со стороны заказчиков.
Узнайте, что любит клиент
Когда вы обсуждаете с клиентом его будущий проект, не полагайтесь только на слова. Слова каждого из нас – это интерпретация внутренних визуальных образов. Слова могут быть одинаковыми, но скрываемые за ними образы – абсолютно разными.
Покажите клиенту некоторые примеры, которые, как вам кажется, могут быть похожи на то, что клиент хочет увидеть в результате. Пусть он отметит, какие цвета из предоставленных примеров ему нравятся, какие формы объектов, их компоновка.
То же самое необходимо сделать со шрифтами, размерами и стилем. Покажите клиенту 3-5 примеров и запишите себе, какой элемент из какого примера клиенту понравился. Сложите эскиз нового проекта из лучших пазлов других проектов.
Поинтересуйтесь у клиента, возможно, у него уже есть наброски или ссылки тех сайтов, которые ему нравятся. Соберите эти примеры, опишите их текстом и отправьте фрилансеру. Имея примеры, вы покажите фрилансеру: как именно вы видите реализацию задачи.
Чаще всего клиенту нужно дать то, что он хочет, и фоном разработать то, что ему действительно нужно, что и приведет к повышению продаж.
Пример рабочего тз для дизайнера
ЧАСТЬ ТЗ для ДИЗАЙНЕРА (Графическая концепция одностраничного сайта салона красоты).
Экран 1
Основной цвет для текста – черный. Для выделенного текста или ссылок – тёмно-оранжево-золотой.
Сайт нужно выполнить в деловых серых тонах. Все графические блочные элементы должны быть квадратно-ориентированными (все блоки, вставки фото и прочие рамки должны не иметь скругленных углов).
Фоном сайта должен быть бесшовный паттерн, который можно дублировать на всю протяженность страницы, независимо от разрешения и размеров экрана. В левом верхнем углу сайта размещаем текст: «Киев» и переключатель, при нажатии на который появится выпадающий список с выбором других городов. Переключатель в форме треугольника перевернутого вниз. Под названием города ставим переключатель «англ/русс».
Один из языков подсвечиваем как «активный».
Далее, по горизонтальному центру мы размещаем наш логотип (логотип прикрепляется с файлами этого ТЗ).
[Если логотипа у вас нет, предлагаете клиенту Разработать логотип дополнительно. Если клиент соглашается – хорошо. Если нет – значит, работаем без логотипа, и говорим дизайнеру прорисовать в графическом исполнении тематический текст, заменяющий логотип].
С двух сторон от логотипа рисуем меню навигации: 2-3 пункта слева от логотипа и 2-3 справа.
Справа, на уровне меню, прорисовываем иконки Инстаграма и Фейсбука + выделяем оранжевым цветом текст: «Записаться онлайн».
В данном случае «подложка» может быть как квадратной, так и круглой, подготовить оба варианта (впоследствии выберите понравившийся).
С новой строки, через несколько отступов, размещаем текст: «Ограниченное издание…» меньшим шрифтом, под основным текстом пишем: «В продаже…».
Под текстом размещаем ещё один логотип <указываем логотип>.
Под логотипом вставляем изображение Кейса (необходимо найти несколько вариантов и предоставить на проверку).
[Сами также ищите картинки для вставки или ищите, где купить/заказать их прорисовку. Нет никакой гарантии, что фрилансер найдет именно то, что вы одобрите].
Напротив прорисованного логотипа «модельная стрижка» ставим стрелку прокрутки слайдера.
Вертикально центрируем её относительно нижней границы «кейса» и текст: «Ограниченное…».
Конец первого экрана.
Экран 2
Дублируем шапку (элемент «Киев + выбор региона/языка»). Дублируем логотип по центру, меню, Запись онлайн + соц. сети.
Далее, размещаем 4 фотографии с небольшими отступами между собой. Под каждым элементом продумываем стили для размещения:
– Названия фото
– Адрес
– Телефон
– График работы
– * опциональное поле (доп. Комментарий).
3й экран
В левый сайдбар (левая колонка) размещаем построчно текст:
«Мужская стрижка… цена
Женская… цена
И т.д….»
В области контента, который находится в свободной области от сайдбара (область, где находится основная информация этого блока) прописываем текст или пишем Пробный текст, и прорисовываем абзацы, отступы, цвета для ссылок, телефонов.
4й экран
Ставим логотип/изображение (указываем) по центру. Делаем выделяемую подложку под это изображение.
Вставляем изображение «глина для волос». Или заказываем дизайнеру это изображение, детально описав в ТЗ, что должно быть на изображении.
– разделитель экранов с изображением—
Размещаем текст (указываем текст, если он есть, или заполняем заглушкой на русском языке).
– снова разделитель с изображением –
Вводный текст над формой.
По центру – форма для отправки анкеты с полями (имя, телефон, почта, компания, город).
Обязательные поля для заполнения: почта, телефон.
Справа от формы вставляем <вот такой текст> про франшизу.
Кнопка отправить, выделенная черным цветом, с хорошо читаемым шрифтом.
– разделитель—
И рисуем в правом нижнем углу черную выноску с текстом: «Оставить отзыв».
Пример рабочего тз для программиста
Интегрируем верстку в движок (например, wordpress).
Реализуем возможность выбора города/языка и соответствующую смену контента всей страницы.
Вывод пунктов меню и задание ссылок к каждому из элементов меню реализуем через админку.
Кнопка «Записаться онлайн» ведёт на страницу <описываем какую>.
Первый экран, а именно Фон + содержимое текста «Ограничение….» и до окончания изображения кейса – делаем слайдером. Создаем возможность изменять контент слайдов, их кол-во, фон, текст через админку.
На втором экране – аналогично прописываем работу кнопок переключения языка и контента, исходя из города. Для каждого города абсолютно разное текстовое и графическое наполнение сайта [этот пункт нужно уточнить у заказчика. Если в разных городах всё остается прежним и
