CS2 Marketplace & Exchange
Кейс: маркетплейс, web-app, Telegram-интерфейс и админ-панели
Это небольшой кейс о проекте, в котором мне пришлось собрать экосистему из лендинга, web-app, Telegram-версии и двух админок. Это был один из первых таких проектов, поэтому прошу строго не судить.
Изначально сроки были обозначены как «около месяца», но из-за постоянных правок и периодических «уходов в афк» со стороны заказчика проект растянулся значительно дольше.
С чего все началось
У заказчика уже был готовый web-app, который нужно было доработать.
Я начал разбираться в UI-ките предыдущего дизайнера — и тут начались сложности.
- незнакомый шрифт
- странные скругления
- хаотичные цвета
- неочевидные кнопки
- отсутствие системы
Всё выглядело так, будто элементы существуют отдельно друг от друга, без общей логики. Пару дней ушло просто на «вскрытие» этого интерфейса. Но после этого рука начала привыкать, и я стал делать новые наброски уже на базе того, что было.
Web-app в итоге потребовал не так много работы, поэтому основное внимание ушло в сам маркет.
Маркет и конкуренты
Из реально сильных конкурентов был только CS.Money.
У них очень удачно реализована главная страница:
слева — ваши скины, справа — маркет и обмен.
Я предложил перенести эту логику к нам, но с улучшениями и адаптацией под наш продукт. Заказчик настоял на своём варианте.
Здесь стоит сказать одну важную вещь.
Лучше потратить время и «танцами с бубном» убедить заказчика принять лучшее решение (обычно — ваше), чем соглашаться на компромисс, который вредит продукту.
Если вы сможете продавить сильное решение — выигрывают все: и вы, и бизнес.
Для тех, кому интересно:
в этом проекте я использовал сетку Stretch с параметрами
margin — 40
gutter — 20
Я часто смотрю сетки у других дизайнеров, но почти никто не указывает их явно, поэтому оставлю здесь.
Админ-панели
Дальше была админка. Ничего революционного, но там появилось одно фиолетовое уведомление, которое мне особенно нравится — простая деталь, но с характером.
Вообще я очень люблю делать админ-панели.
Если бы можно было, я бы посвятил им всю дизайнерскую карьеру.
слева — ваши скины, справа — маркет и обмен.
Чаще всего заказчики хотят максимально простые админки: таблицы, фильтры, минимум интерактива. Но иногда попадаются проекты, где можно реально поработать с логикой, состояниями, сценариями — и это самый интересный тип интерфейсов.
Лендинг — в последнюю очередь
В конце я сделал лендинг.
И это было осознанное решение.
Лендинг лучше делать после основного продукта. Когда у вас уже есть готовые компоненты, реальные экраны и функционал, гораздо проще собрать из этого убедительную, честную презентацию.
Вы не выдумываете абстрактные блоки — вы используете живые элементы системы и показываете продукт таким, какой он есть.
Итог
Этот проект стал для меня хорошей школой:
работа с чужим UI-китом, борьба за решения, сложная логика маркета, админ-панели и сборка всего в одну экосистему.
Именно такие кейсы, даже не идеальные, дают самый сильный рост.