Товары движутся. Контроль остается.
За одной отгрузкой - приемка, остатки, упаковка, документы и расчеты. Я сделала редизайн интерфейса фулфилмент-платформы: связала операции общей логикой и помогла пользователю видеть, что происходит с его товаром и что делать дальше.
Складскаялогикана сторонепользователя.
Для бизнеса, фулфилмент - это способ передать логистику партнеру. Но контроль нельзя передать вместе с коробками: продавцу нужно понимать, что принято, что доступно и что уже отправлено.
Моей задачей был полный редизайн платформы. Я выстроила кабинет вокруг движения товара, отделила складские операции от финансов и настроек, а внутри каждого раздела расставила приоритеты между данными и действиями.
Разныемасштабыбизнеса.
В начале проекта я разобрала аудиторию: от продавцов, которым нужна простая работа с поставками, до дистрибьюторов с большими объемами. Сопоставила их задачи с интерфейсами конкурентов.
В анализе повторялись трудный первый вход, неочевидные переходы и формы без пояснений. Эти наблюдения стали ориентирами для структуры кабинета, навигации и помощи внутри продукта.
Сначала понять, где ты
Разделила меню на поступления, управление складом, финансы и настройки. Названия отражают рабочие задачи, а выбранный раздел остается заметным.
Видеть смысл цифры
В таблицах важно различать товар на складе, в работе и доступный к отгрузке. Смысловые группы помогают сопоставлять показатели, которые легко перепутать.
Получать помощь
Для сложных настроек предусмотрела пояснения, навигацию по инструкции и переход в справочный центр. Помощь связана с конкретной задачей.
Сначала порядок работы. Затем визуальный язык.
На прототипах я выстроила основу кабинета: меню, контекст магазина, рабочую область и действия. На примере справочника видно, как эта логика развивается в финальном дизайне.
В готовом экране уточнила иерархию: редактирование справочника и добавление товара отделены от поиска и настройки столбцов. Плотная таблица получила спокойные разделители, а действия со строкой - собственное место.
Новый пользователь еще не знает продукт, поэтому на входе особенно важны последовательность и понятный следующий шаг. Я разделила регистрацию и подтверждение почты, а восстановление доступа оформила как самостоятельный сценарий. На каждом этапе форма остается короткой и сохраняет знакомую композицию.
Создать аккаунт
Собрать необходимые данные без знакомства со всеми настройками кабинета сразу.
Подтвердить почту
Объяснить, куда отправлен код, и оставить возможность запросить его повторно.
Вернуть доступ
Дать отдельный путь восстановления, если пользователь не может войти.
Приемка, отгрузка и планирование поставок используют разные данные. Я сохранила общий каркас кабинета, но не стала заставлять все операции выглядеть одинаково: структура рабочей области меняется вместе с задачей.
Что происходит с приемкой?
В списке собрала даты этапов, номер задания и статус. Цвет дополняет подпись, а переход в подробности привязан к конкретной строке. Так общий обзор не перегружается содержимым каждого задания.
Где находится товар для отгрузки?
Показатели сгруппированы по складам: наличие, движение и возвраты читаются в контексте конкретной площадки. Выбор склада и создание отгрузки вынесены над таблицей.
Как подготовить следующую поставку?
В аналитике разделила ввод исходных данных, параметры расчета и результат. Пользователь сначала задает условия, затем сопоставляет остатки, в той же последовательности устроен экран.
Всего на складе, в работе, брак, доступно к отгрузке, это близкие по виду цифры, но означают разные возможности для бизнеса. Я разделила их на группы и сохранила рядом данные товара, чтобы строку можно было читать как связанное целое.
Сколько можно отправить
Выделила группу остатков отдельным заголовком. Общий объем, товар в работе и доступность к отгрузке сравниваются внутри одного смыслового блока.
Что за товар перед нами
Размеры и вес объединила в соседнюю группу. Они не смешиваются с количеством, но остаются в той же строке для сопоставления.
Что видят площадки
Состояние обновления на маркетплейсах вынесла отдельно: пользователь различает складские сведения и передачу данных во внешние каналы.
Одназаявка.Несколькоспособовподготовкик работе.
При консолидации нужно выбрать товары, задать количество и определить упаковку. Я собрала эти решения в последовательные группы и предусмотрела два способа добавления позиций: вручную или из файла.
Финальные действия тоже разделила по намерению. Отправить в работу, забронировать товар или сохранить черновик - это разные решения пользователя. В интерфейсе они доступны отдельно, чтобы подготовка заявки не означала ее немедленный запуск.
В рабочей системе случайный клик может стоить заполненной формы или выбранных записей. Я предусмотрела подтверждения именно в этих местах: при уходе со страницы с несохраненными данными и при массовом удалении.
В сообщении объясняется последствие, а при удалении указано количество объектов. Пользователь подтверждает конкретное действие, понимая, что изменится.
Я разделила финансовый раздел на два рабочих вопроса: сколько средств доступно и из чего складываются расходы. Баланс, счета и история платежей собраны в одном экране; стоимость услуг - в отдельной таблице с периодом и разбивкой по операциям.
Важное условие оплаты поставила перед списками. Оно заметно до действия, а не теряется среди строк и сумм.
Один кабинет может объединять нескольких людей с разными полномочиями. Я привязала управление доступом к договору: его номер остается виден при приглашении и изменении роли.
Список участников, приглашение и настройка прав разделены на небольшие диалоги. Так администратор решает одну задачу за раз и не теряет контекст, к которому относится изменение.
Кто уже подключен
Участники и их роли собраны в одном списке.
Кого пригласить
В приглашении сразу задаются идентификатор пользователя и права доступа.
Что разрешено
Роль можно изменить в том же контексте договора.
Я проработала не только заполненные экраны. Отсутствие данных, ошибка ввода и завершенная операция требуют разных ответов системы. Эти состояния помогают понять ситуацию и выбрать следующее действие.
Данных пока нет
Пустое состояние сохраняет структуру раздела и объясняет отсутствие записей. Рабочая область не выглядит сломанной или недогруженной.
Данные нужно исправить
Ошибки выделяются рядом с полями, а пояснение внутри формы помогает понять, почему продолжить не получилось.
Действие завершено
После смены пароля предусмотрен отдельный экран успеха и понятный переход ко входу. Пользователь получает подтверждение результата.
Короткое уточнение, первая настройка и подробная инструкция - это разные задачи для справки. Я предусмотрела несколько форматов: вводную страницу с иллюстрацией, развернутую статью и материал с выделенными примечаниями.
Общими остаются навигация по темам и оглавление. Важные условия отделены от основного текста, а связанные материалы помогают продолжить изучение. Для справочного центра подготовлены светлая и темная версии.
Для подключения маркетплейса я встроила инструкцию в рабочий экран: оглавление удерживает последовательность шагов, а примеры показывают, что именно нужно настроить. Пользователь может сверять свои действия с объяснением, оставаясь внутри кабинета.
У коротких вопросов другой формат: подсказка объясняет термин и предлагает переход в справочный центр. Так интерфейс даёт необходимый минимум и оставляет путь к подробному ответу.
Большой кабинет нельзя удержать в одном стиле только готовыми страницами. Я собрала библиотеку кнопок, полей, переключателей, статусов и подсказок с состояниями взаимодействия.
Она задает правила для повседневной работы: какое действие главное, что выбрано, что недоступно и как выглядит обратная связь. Новые разделы можно строить на той же основе.
Отдельно проработала календари, поиск, списки, меню и уведомления. Библиотека покрывает не только внешний вид элементов, но и то, как система отвечает на действия пользователя.
Основные и второстепенные действия, наведение, выбор и недоступные элементы.
Понятноезнакомствос сервисом.
В проект вошел и сайт. Здесь я сменила плотность подачи: вместо рабочих таблиц - крупные смысловые блоки, иллюстрации и последовательное объяснение услуг.
Общий визуальный язык связывает первое знакомство с платформой и дальнейшую работу внутри кабинета.
Управление договорами, переупаковка, консолидация и настройки каналов требуют собственной детализации. Я проработала эти разделы в общей системе: знакомая навигация, смысловые группы полей и последовательное расположение действий.
Результатом стал связанный дизайн кабинета, справочного центра и сайта, подкрепленный прототипами и библиотекой компонентов.
В этом проекте моя работа была в том, чтобы разобраться в логике большой B2B-системы и сделать ее читаемой: через структуру, сценарии, приоритеты данных и внимание к повседневным действиям.
