Разработка сайтов для бизнеса. Адаптивная верстка и интеграция с CMS

Что включить в бриф на разработку сайта?

/ Сергей Нуйкин / Веб-дизайн

Здравствуйте, уважаемые друзья!

Сегодня мы поговорим о таком документе, который очень часто используют дизайнеры (фрилансеры). Документ этот получил название – бриф.

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

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

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

Чем может помочь бриф дизайнеру?

бриф на разработку сайта

  1. Бриф рисует дизайнеру общую картину того продукта (дизайн сайта, логотипа и т.д.) который он должен будет создать.
  2. Показывает общие технические моменты.
  3. Определяет задачи, перед  дизайнером.
  4. Дает более детальное представление о задание.
  5. Дает информацию о заказчике, компании.
  6. Помогает определить верное направление в разработке дизайна.
  7. Помогает предварительно сориентироваться по объему работы.
  8. Дает более ясную картину по срокам.
  9. Может сориентировать ценовой диапазон.

Как составляется бриф на разработку сайта?

Бриф на разработку сайта составляется обычно одним из двух способов:

  1. Дистанционно – это когда заказчик (клиент) заполняет его самостоятельно.
  2. Диалоговый – это когда менеджер (дизайнер, фрилансер) совместно с клиентом заполняют бриф,  по средством диалога, менеджер задает вопросы, заказчик (клиент) отвечает на них.

диалоговый метод заполнения брифаДистанционный способ хорош тем, что высвобождает время менеджера или фрилансера-дизайнера.

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

А также благодаря диалоговому способу можно намного быстрее заполнить бриф на разработку сайта и приступить к дальнейшей работе над проектом.

Какие вопросы следует включить в бриф на разработку сайта?

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

Итак, расскажу на примере своего брифа на разработку сайта.

Первым делом нужно разделить бриф на пункты, которые будут подразделяться на конкретные вопросы.

Первый пункт «информация о компании»:

  • Название компании или сайта;
  • Доменное имя (которое нужно зарегистрировать если нет зарегистрированного ранее);
  • Представляемая продукция (услуга), торговые марки (название бренда);
  • Желаемая дата сдачи проекта;
  • Контактное лицо;
  • Предполагаемый бюджет.

Второй пункт «информация об услугах компании»:

  • Целевая группа воздействия (владельцы бизнеса, вся категория пользователей, др) необходимо выбрать;
  • Информация о продуктах, услугах, если это магазин или каталог;
  • Конкуренты в сфере деятельности (несколько ссылок);
  • Цели создания сайта;
  • Вид сайта (магазин, каталог, городской портал, промо-сайт, сайт компании, сайт-визитка 5-7 станиц, файлообменник, социальная сеть, блог, другое (описать)).

Третий пункт «информация о существующем фирменном стиле»:

  • Наличие логотипа;
  • Наличие фирменного слогана;
  • Наличие фирменных цветов;
  • Наличие фирменного стиля.

Четвертый пункт «какие функции должен выполнять Ваш сайт» выбрать вариант:

  • Продвигать товары и услуги;
  • Нести общую информацию о компании, ее координаты;
  • Подробно рассказывать о компании;
  • Продавать товары и/или услуги;
  • Ваш вариант (опишите).

Пятый пункт «на чем должен акцентировать дизайн внимание посетителя сайта»:

  • На слогане, лозунге компании (предоставьте слоган);
  • На информации о компании;
  • На услугах компании;
  • На контактах компании;
  • На новинках продукции и услуг компании;
  • На уникальности услуг и продукции компании;
  • На выгодной ценовой политике;
  • Ваш вариант.

Шестой пункт «технические требования»:

  • Разрешение в пикселах страницы на мониторе пользователя (1024х768, 1152х864, 1280х1024 и т.д.);
  • Развертка страницы – положение сайта в окне браузера ( резиновая, центрированная, жесткая по левой/правой стороне и т.д);
  • Адаптивность сайта (нужно ли отрисовать макеты для отображения сайта на устройствах типа: планшет, смартфон)
  • Движок сайта – система управления контентом (нужна ли CMS или нет, если нужна то какая, если лицензионная CMS то заказчик готов ее оплатить);
  • Наполнение готового сайта информацией, обработка фото, написание или рерайт статей и т.д. (требуется или не требуется, если требуется то, контент будет предоставлен или нет);
  • При необходимости создания контента, какое количество статей и изображений необходимо создать.

Седьмой пункт «описание дизайна сайта»:

  • Стиль дизайна (минимализм, web 2.0, материал дизайн, flat, ретро, гранж, журнальный, другой)
  • Укажите несколько примеров сайтов с комментариями, которые Вам нравятся;
  • Укажите несколько примеров сайтов с комментариями, которые Вам не нравятся;
  • Укажите желаемую цветовую гамму (если нет корпоративных цветов);
  • Укажите, будет ли использоваться графика готовая либо необходимо ее создать;
  • Укажите, различны ли главная и внутренние страницы, требуются ли какие дополнительные страницы на флеш или статике;
  • Необходима ли флеш анимация;
  • Нужны ли счетчики для сбора информации;
  • Пиктограммы (различные иконки, фавиконка) нужно разрабатывать или нет;
  • Какие нужно создать иллюстрации (описание);
  • Нужна ли карта проезда;
  • Пожелания по дизайну.

Восьмой пункт «структура страниц сайта»:

  • Структура меню (меню, подменю);
  • Расположение меню (слева, справа, сверху);
  • Дополнения по меню (выпадающее к примеру);
  • Блоки присутствующие обязательно на главной странице перечислить (новости, подписка, опрос, календарь и т.д.);
  • Блоки, присутствующие на внутренних страницах;
  • Баннеры если нужны, указать формат и место расположения;

Девятый пункт «модули сайта»:

  • Поиск по сайту;
  • Опросы;
  • Подписка;
  • Фотогалерея;
  • Информационные блоки;
  • Техническая поддержка;
  • Каталог;
  • Интернет магазин;
  • Комментирование;
  • Реклама;
  • Другие (указать).

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

Я постарался собрать все моменты которые необходимы для понимания проекта, структуру брифа можно менять по своему выбору, дополнять удалять перефразировать.

Каждый из пунктов можно разбить на подпункты в которых будет выбор того или иного подпункта, либо это будет выбор  да/нет.

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

На этом на сегодня у меня все, заглядывайте на fotodizart.ru чаще дабы не упустить новых статей.

Понравилась статья?
Подпишитесь на обновления:
Поделитесь материалом с друзьями:

Выражаю искреннюю благодарность читателям, поддерживающих проект.

Комментарии к статье:
    • allemiko

      Интересно, сохраню в папку,а вдруг пригодится кому нибудь делать сайт :)

    • Нуйкин Сергей

      Алем, если придется создавать сайт, то бриф здорово выручает. Желательно создать его в вордовском документе в таблице в виде вопрос — ответ. И можно хранить на ПК, а при необходимости он всегда под рукой будет. ;)

    • Евгений Комиссаров

      Мне вот хотелось бы статейку на тему «подготовка дизайна для верстальшика»

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

    • Нуйкин Сергей

      Привет, Жень! Что именно тебя интересует???

    • Евгений Комиссаров

      Да вот в том то и проблема я даже не знаю что меня должно интересовать…)
      Неверно так, в каком виде я должен отдать дизайн верстальшику.
      К примеру если в PSD то какая должна быть структура слоев и прочие. :)

      Просто нужно будет сделать диз. заказывать дорого, могу и сам но верстка это уже за гранью, придется искать исполнителя.

    • Нуйкин Сергей

      Да я вот тоже не верстальщик но этот сайт полностью делал сам от и до.
      По структуре и еще некоторым моментам можешь посмотреть в первых двух статьях в разделе о веб-дизайне.

      1. 1. Макет должен быть создан по сетке, чтобы все было ровненько.
      2. 2. Структура макета должна быть понятна. Т.е. к примеру, в папке шапка должны лежать все слои, которые входят в шапку.
      3. 3. В текстах использовать стандартные шрифты, о них также есть статья на сайте.
      4. 4. После окончания работы, все лишнее удалить. По поводу направляющих, я удаляю т.к. у меня верстальщик просит удалять, но есть верстальщики, кому направляющие помогают в верстке.
      5. 5. Дать имена всем слоям (я называю на русском) но если верстальщик работает на маке то нужно на английском.
      6. 6. Паттерны (текстуры), шрифты нестандартные отдаются верстальщику отдельно.
      7. 7. Размеры создаются из расчета минимального разрешения, под которое будет верстаться макет. О размерах тоже есть статья на сайте.

      Может, конечно, есть и еще какие-то моменты сходу не вспомню. Будет время, может, напишу статью. Все это исходя из моего опыта, кто-то может делает по другому.

    • Евгений Комиссаров

      Ну в принципе как рас то что мне и нужно)
      Не а статьи я помню … помню :)

    • Нуйкин Сергей

      Если что пиши, подскажу. Аську тоже знаеш. ;)

Добавить комментарий:

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!:

Нажимая на кнопку «Отправить комментарий», вы соглашаетесь с Политикой конфеденциальности.