АО ЭТП «АТЛАНТА»B2B / ДИЗАЙН-ТЗ
Логотип АТЛАНТА из предоставленного образца

Интернет-магазин
для бизнеса.

Визуальное задание на дизайн

Каталог · оптовый заказ · кабинет компании

КОНЦЕПЦИЯ / 02
АТЛАНТА / B2B ДИЗАЙН-ТЗ01 / ОСНОВА БРЕНДА

Ваши изображения задают характер

Полная композиция логотипа АТЛАНТА с названием компании
Название и композиция
Исходный голубой контур фирменного знака
Пластика знака

Оригиналы показаны без изменений. Сохраняем шрифт с засечками в логотипе, голубой контур и тёмный фон. Для финальных макетов нужен согласованный векторный оригинал.

АТЛАНТА / B2B ДИЗАЙН-ТЗ02 / НАПРАВЛЕНИЕ

Закупщик быстро считывает главное

Пример предметного стиля: тёмно-синие коробки, металл и стекло на светлом фоне

Артикул.
Условия.
Количество.

Сдержанный деловой стиль. Чёткие таблицы и спокойные товарные изображения.

Предлагаемая B2B-концепция. Ассортимент, суммы и условия в примерах демонстрационные; финальное наполнение согласуется отдельно.

АТЛАНТА / B2B ДИЗАЙН-ТЗ03 / ЦВЕТ

Светлая основа и дозированный синий

Основной#0D2943

Текст и акценты

Фон#EDF6FC

Зоны товаров

Белый#FFFFFF

Основа страниц

Голубой#86BFDE

Детали бренда

70% — светлое поле20% — синий10%

Палитра интерфейса по мотивам логотипа. Голубой — для декора; текст — тёмно-синий. Пропорции на схеме показывают ориентир композиции.

АТЛАНТА / B2B ДИЗАЙН-ТЗ04 / ТИПОГРАФИКА

Размер и насыщенность задают иерархию

Aa

Manrope

АБВГД · абвгд
0123456789

Заголовок

48 / 52 px · 700

Раздел

32 / 40 px · 700

Основной текст

16 / 24 px · 400–500

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

АТЛАНТА / B2B ДИЗАЙН-ТЗ05 / ИЗОБРАЖЕНИЯ

Единый свет объединяет разные товары

Пример предметного стиля: тёмно-синие коробки, металл и стекло на светлом фоне
16:9 / баннер
Пример предметного стиля: тёмно-синие коробки, металл и стекло на светлом фоне
1:1 / карточка
Пример предметного стиля: тёмно-синие коробки, металл и стекло на светлом фоне
4:5 / деталь
Светлый фонМягкая теньТочный цвет

Показана стилистика съёмки. Реальные товары в каталоге — целиком, в сопоставимом масштабе, без текста поверх фото и декоративного искажения цвета.

АТЛАНТА / B2B ДИЗАЙН-ТЗ06 / ГРАФИКА

Графика поддерживает порядок

Контурные иконки: 24 px, линия 1,5–2 px. Одна толщина во всей системе.

Разделители — тонкие. Геометрия — прямые линии и спокойные дуги.

Скругления интерфейса — 4–8 px. Без объёмных значков, неона и тяжёлых теней. Фирменный знак не превращать в повторяющийся узор.

АТЛАНТА / B2B ДИЗАЙН-ТЗ07 / ГЛАВНАЯ

Главная направляет к закупке

АО ЭТП АТЛАНТА — логотипАРТИКУЛ / КАТАЛОГ
01Закупки
для бизнеса
Пример предметного стиля: тёмно-синие коробки, металл и стекло на светлом фоне
02 / Категории03 / Повтор заказа
01

Поиск заметен

В шапке — поиск по названию и артикулу.

02

Короткий путь

Рядом с каталогом — зона быстрого заказа.

Баннер занимает не более трети первого экрана. Ниже — категории и рабочие подборки. Место компании и менеджера — в шапке кабинета.

АТЛАНТА / B2B ДИЗАЙН-ТЗ08 / КАТАЛОГ

Строка каталога помогает сравнивать

Фрагмент оптового каталогаУсловные позиции
Товар / артикулУпаковкаНаличиеЦена / уп.
Пример предметного стиля: тёмно-синие коробки, металл и стекло на светлом фонеA–001
6 шт.В наличии1 200 ₽
Пример предметного стиля: тёмно-синие коробки, металл и стекло на светлом фонеA–002
12 шт.Под заказ2 400 ₽
Пример предметного стиля: тёмно-синие коробки, металл и стекло на светлом фонеA–003
6 шт.УточняетсяПо запросу

Фильтры — слева от списка. Артикул, единица продажи и цена имеют постоянные колонки. Статус наличия обозначать словами; суммы здесь демонстрационные.

АТЛАНТА / B2B ДИЗАЙН-ТЗ09 / СТРАНИЦА ТОВАРА

Упаковка и условия находятся рядом с ценой

Пример предметного стиля: тёмно-синие коробки, металл и стекло на светлом фоне
A–001

Товар

6 шт. / упаковка

1 200 ₽

за упаковку

Минимум: 2 уп.
Шаг: 1 уп.

01

Цена / уп.

Пометка о НДС рядом с ценой.

02

Количество

Упаковки и итог — одним блоком.

Пример оптовых условий. Под галереей — характеристики и документы. Реальные цены, упаковку и кратность согласовать.

АТЛАНТА / B2B ДИЗАЙН-ТЗ10 / ЦЕНЫ И ДОСТУП

Уровень доступа считывается сразу

01 / ГОСТЬ

Цена после входа

Пояснение рядом с товаром. Без нулевой или выдуманной цены.

02 / ПРОВЕРКА

Компания на проверке

Спокойное сообщение и понятный следующий шаг.

03 / ПАРТНЁР

Ваша цена

Единица продажи, пометка о НДС, условия объёма.

Предлагаемые состояния для макетов. Правила доступа к ценам согласуются отдельно. Для входа и регистрации компании подготовить самостоятельные экраны.

АТЛАНТА / B2B ДИЗАЙН-ТЗ11 / КОРЗИНА

Корзина читается как спецификация

АртикулКол-воЦена / уп.Сумма
A–0012 уп. / 12 шт.1 200 ₽2 400 ₽
A–0023 уп. / 36 шт.2 400 ₽7 200 ₽

Позиции: 2
Упаковки: 5

Итог примера9 600 ₽

Количество редактируется в строке. Итог, доставка и пометка о НДС собраны в отдельной зоне. Ошибки кратности — рядом с количеством.

АТЛАНТА / B2B ДИЗАЙН-ТЗ12 / ОФОРМЛЕНИЕ

Компания, получение и итог разделены

01

Компания

Наименование · ИНН · контакт

02

Получение

Адрес · способ · комментарий

03

Подтверждение

Проверка состава и условий

СВОДКА ЗАКАЗА9 600 ₽

2 позиции / 5 упаковок

Доставка и НДС — отдельными строками.

Постоянные подписи над полями. Ошибки — под соответствующим полем. На телефоне сводка завершает страницу. Сумма — пример оформления.

АТЛАНТА / B2B ДИЗАЙН-ТЗ13 / КАБИНЕТ КОМПАНИИ

Заказы и документы образуют рабочую зону

Схема кабинета с условными данными. Компания видна в шапке; статусы — словами. Документы расположены рядом с заказом, контакт менеджера — отдельным блоком.

АТЛАНТА / B2B ДИЗАЙН-ТЗ14 / МОБИЛЬНЫЙ ЭКРАН

Каждая строка становится карточкой

АТЛАНТА / B2B
Пример предметного стиля: тёмно-синие коробки, металл и стекло на светлом фоне

A–001

6 шт. / уп.
1 200 ₽ / уп.

2 упаковки

2 400 ₽
1440768390КомпьютерПланшетТелефон

На телефоне рядом остаются артикул, упаковка, цена и количество.

Поля — 16 px. Зоны нажатия — от 44 × 44 px. Итог заказа выделен визуально.

Ширины макетов указаны в px. Не сжимать таблицу до мелкого текста: использовать вертикальные карточки с подписями значений.

АТЛАНТА / B2B ДИЗАЙН-ТЗ15 / СОСТОЯНИЯ

Смысл состояния передаётся цветом и текстом

Обычное

Тёмный текст, светлая граница.

Фокус

Заметный синий контур 2 px.

Ошибка

#A13232 и пояснение рядом.

Успех

#246449 и подтверждение текстом.

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

АТЛАНТА / B2B ДИЗАЙН-ТЗ16 / РЕЗУЛЬТАТ ДИЗАЙНА

Дизайнер передаёт единую систему

01

Экраны

Каталог, товар, корзина, заказ, вход и кабинет компании.

02

Компоненты

Таблицы, цены, упаковки, поля, кнопки и состояния.

03

Материалы

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

Один бренд.
Последовательный дизайн.

Передать макеты 1440 / 768 / 390 px, компоненты и стили. Проверить длинные артикулы, крупные суммы и читаемость. Цены, доступ и ассортимент согласуются отдельно.