Сайты и интерфейсы

Офисы →

Общий дизайн интерфейсов сервисов
Требования к дизайну сайтов партнеров

 

Общий дизайн интерфейсов сервисов

 

Дизайн интерфейсов сервисов СКБ Контур строится по стандартам общего дизайна, включающего следующие элементы:

  1. Шапка
  2. Подвал
  3. Контролы
  4. Иконки

Шапка 

Состоит из «портальной строки» и шапки проекта.

Портальная строка содержит: 

  • Общий логотип онлайн-сервисов Контур (специальная версия логотипа), по клику на который появляется блок, содержащий ссылки на другие продукты Контура
  • Данные авторизации пользователя (Имя Фамилию или эл. почту)
  • Ссылку «Выйти»

Шапка проекта содержит:

Обязательно:

  • Название проекта (не логотип)
  • Ссылку на блок Помощь

Опционально:

  • Название организации 
  • Ссылку на блок «Реквизиты и настройки» (варианты названий: «Настройки», «Настройки и оплата»)
  • Поле поиска (располагается также в центре шапки проекта, между названием и служебными ссылками)

Подвал

Содержит обязательно логотип «СКБ Контур» с надписью «с 1988 года», список веб-сервисов Контура. Все необходимые справочные и информационные ссылки проекта располагаются справа под названием проекта, в несколько столбцов. Отдельно самым крайним столбцом расположена информация для техподдержки и контактов.

Контролы

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

   

Иконки

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

Требования к дизайну сайтов партнеров

 Полный список требований к сайтам партнеров (дизайн, контент, продвижение)

Пример, как не надо

Попытка имитировать официальный ресурс компании kontur.ru:
  • Расположение иллюстраций, блоков, меню.
  • В логотипе партнера использован логотип Контура с облачком, который является зарегистрированным товарным знаком и не может быть использован для логотипа другого юридического лица.

 

Нельзя

  • Имитировать сайты Контура и его продуктов.
  • Использовать устаревшие логотипы и иконки продуктов.
  • Модифицировать (менять расположение элементов, их пропорции) логотипы компании и продуктов не предусмотренным брендбуком образом.
  • Использовать любые визуальные материалы с сайтов Контура (кроме предоставленных на Партнерском портале).
  • Использовать стиль / цвета / изображения одного продукта для продвижения другого.
  • Имитировать интерфейсы сервисов Контура.
  • Использовать элементы логотипов СКБ Контура, Контура и продуктов в своих логотипах. Логотипы СКБ Контур и Контур являются зарегистрированным товарными знаками и не могут быть использованы для логотипа другого юридического лица.

Пример, как надо

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

Можно

  • Использовать элементы фирменного стиля Контура и продуктов: шрифт, цвет и стилистику.
  • Использовать маркетинговые материалы, предоставленные на Партнерском портале.
  • Использовать логотипы продуктов Контура как дополнительные, но визуально они должны иметь меньший вес, чем логотип или название организации партнера.
  • Использовать логотипы продуктов Контура в качестве основного логотипа на странице, но при этом рядом необходимо разместить текст «Это сайт официального партнера СКБ Контур» либо плашку с текстом «это сайт официального партнера Контура (общий логотип онлайн-сервисов или логотип конкретного продукта)».
    Текст или плашка должны быть размещена на первом экране (примерно первые 650px высоты страницы). Шрифт также должен быть контрастен фону: тест AAA должен быть пройден по стандарту WCAG 2.0. Сервис для проверки контраста contrastchecker.com.
   

 

 

Плашки для партнерских сайтов

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

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

 


← Реклама  Задать вопрос Офисы →

Будь в курсе обновлений брендбука – подпишись!

Подписаться
На адрес отправлено письмо для завершения подписки.

Заполните, пожалуйста, все поля.

Предложение, замечание, просьба или вопрос.