# Кейс: Мобильное приложение для аренды кладовок — Игорь Тростянский > Кейс: мобильное приложение для аренды кладовок и хранения вещей на складе. 200+ экранов, 46+ флоу, продуктовый дизайн от исследования до финальных макетов. > Source: https://troydesigns.vercel.app/ru/case-sklad.html Tags: B2B, B2С, Продуктовый дизайн, 2026 [Figma–файл](https://www.figma.com/design/RgqNUlne5UML0L4GP0Di7a/%D0%AE-%D0%A1%D0%BA%D0%BB%D0%B0%D0%B4--Copy-?node-id=493-9571) # Мобильное приложение для аренды кладовок и хранения вещей на складе ![Три экрана приложения: выбор объёма ячейки, заказ, список вещей, экран 1](https://troydesigns.vercel.app/assets/case-sklad/hero-phones-1.webp) ![Три экрана приложения: выбор объёма ячейки, заказ, список вещей, экран 2](https://troydesigns.vercel.app/assets/case-sklad/hero-phones-2.webp) ![Три экрана приложения: выбор объёма ячейки, заказ, список вещей, экран 3](https://troydesigns.vercel.app/assets/case-sklad/hero-phones-3.webp) ## Контекст IOS–приложение для управления автоматизированными кладовками у многоквартирных домов и доставки вещей на склад курьером. ## Постановка задачи Успех и масштаб всего предприятия зависит от привлечения партнёров. Скупить достаточно помещений клиенту нереально. Компания собирает подписку с клиентов на свой счёт и ежемесячно переводит партнёрам за вычетом комиссии за управление и эквайринга. То есть цель продукта — обслужить эту комиссионную модель и обеспечить масштабирование партнёрской сети. ## Результат За 2 месяца команда из четырёх человек отдала MVP в разработку — клиентскую часть и кабинет партнёра. Мои треки — партнёрская часть и сдача вещей на склад, которую перенесли на вторую итерацию. ## Технические ограничения - СКУД с открытым API для интеграции; - Входная дверь и замки ячеек открываются по BLE (bluetooth), критично — без интернета; - Face ID для входа; - Оплата: привязка карт, СБП, механизм возвратов; - Push с дублированием в SMS/почту/телеграм-бот; - Сначала IOS, Android — на следующей итерации; 200+ — Экранов 46+ — Флоу и стейтов экранов 4 — Человека в команде ![Флоу авторизации Складно и выбор ячейки Кладовкин — схемы конкурентов](https://troydesigns.vercel.app/assets/case-sklad/benchmark-flows.jpg) ## 1. Погружение в задачу и бенчмаркинг Разобрал трёх основных конкурентов: «Складно», «Кладовкин» и «Много места». Нам повезло со стартовой позицией — первую версию «Складно» студия делала ещё в 2021 году, так что базовые флоу были на руках. Но рынок за пять лет ушёл вперёд, поэтому я прошёл путь пользователя в каждом приложении и выписал боли, которые мы обязаны были не повторить. ## Боли конкурентов ### Слишком длинный путь до целевого действия Нужно 5+ шагов, чтобы просто выбрать ячейку → лишнее трение и потери пользователей. ### Сложный выбор объёма ячейки Нет понятных аналогий → пользователю трудно представить, какой объём ячейки ему подойдёт ### Отсутствие прозрачности по наличию мест Не показывают, что ячеек нет → пользователь тратит время впустую и раздражается. ### Неудобный онбординг и авторизация Сразу требуют документы, нет быстрых способов входа (типа Госуслуг и Сбер ID). ### Слабая работа с доверием на старте Нет онбординга, условий и сценариев использования. ### Зависимость от интернета для доступа к ячейке Критичный UX-фейл в сегодняшних реалиях ![Главная клиентской части: тариф «Склад»](https://troydesigns.vercel.app/assets/case-sklad/client-home-1.webp) ![Главная клиентской части: тариф «Кладовка»](https://troydesigns.vercel.app/assets/case-sklad/client-home-2.webp) ![Карточка ячейки с размерами и кнопкой открытия](https://troydesigns.vercel.app/assets/case-sklad/client-home-3.webp) ### Главная страница клиентской части Просто чтобы не утомлять вас текстом ## 1.1 Гипотезы ### Про выбор объёма Если добавить наглядные подсказки (аналогии с реальными вещами) для каждого объёма кладовки, то пользователи будут быстрее и увереннее выбирать ячейку, что увеличит конверсию в бронирование. ### Про информирование об ограничениях Если заранее показывать ограничения доступа (например, необходимость лестницы), то снизится количество негативного опыта и отмен бронирований, что улучшит NPS и уменьшит нагрузку на поддержку. ### Про верификацию документов Если внедрить альтернативные способы верификации (например, через Госуслуги), то снизится процент неуспешной верификации, что увеличит долю пользователей, доходящих до аренды. ### Про доступ к ячейке офлайн Если реализовать способ открытия ячейки без интернета (например, через Bluetooth Low Energy), то снизится количество неудачных попыток доступа, обращений в поддержку, что повысит удовлетворённость пользователей. ### Про шаринг доступа Если упростить процесс передачи доступа к ячейке (в 1–2 действия), то увеличится частота использования функции совместного доступа, что повысит удержание и удовлетворённость пользователей. ### Про облачный склад Если запустить формат с курьерским забором вещей, то появится новый сегмент пользователей, готовых платить за удобство, что увеличит средний чек и создаст конкурентное преимущество. ## 2. Структура ### Структуру накидывали прямо в фигме Сроки были жёсткие, поэтому процесс построили итеративно: созванивались с командой по несколько раз в день, гоняли флоу на логические ошибки и добирали недостающие состояния. Там, где это было оправдано, переиспользовали проверенные флоу «Складно» — но не вслепую: каждый экран пересматривали через призму бенчмаркинга, ведь оригиналу было уже пять лет. ### Экраны для партнёров вообще негде было посмотреть Управление складским бизнесом с телефона — редкая история: в 99% случаев для этого делают отдельный веб-сервис с большими дашбордами, доступами для сотрудников и отчётами. Референсов в открытом доступе почти нет — удалось вытащить лишь пару скринов у «Складно», и те без откровений. Но клиент настоял: весь функционал должен жить внутри приложения. Значит, партнёрскую часть проектируем с нуля — опираясь на структуру, а не на чужие решения. ![Два экрана первых прототипов, экран 1](https://troydesigns.vercel.app/assets/case-sklad/first-prototypes-1.webp) ![Два экрана первых прототипов, экран 2](https://troydesigns.vercel.app/assets/case-sklad/first-prototypes-2.webp) ### Первые прототипы Собрал их к первой встрече с клиентом — говорить о продукте на живых экранах продуктивнее, чем на словах ## 3. Визуальная концепция ![Скриншот процесса отрисовки — много экранов](https://troydesigns.vercel.app/assets/case-sklad/concept-sketches.jpg) ### Наброски концепций На концептинге мы сознательно отключили ограничения — никаких компонентов и автолейаута, только скорость и поиск идей. Чистоту файла и аккуратную раскладку экранов отложили на потом: на этом этапе важнее нащупать направление, чем навести порядок. ![Варианты визуальной концепции приложения — горизонтальная лента, экран 1](https://troydesigns.vercel.app/assets/case-sklad/concept-variants-scroll-1.webp) ![Варианты визуальной концепции приложения — горизонтальная лента, экран 2](https://troydesigns.vercel.app/assets/case-sklad/concept-variants-scroll-2.webp) ![Варианты визуальной концепции приложения — горизонтальная лента, экран 3](https://troydesigns.vercel.app/assets/case-sklad/concept-variants-scroll-3.webp) ![Варианты визуальной концепции приложения — горизонтальная лента, экран 4](https://troydesigns.vercel.app/assets/case-sklad/concept-variants-scroll-4.webp) ![Варианты визуальной концепции приложения — горизонтальная лента, экран 5](https://troydesigns.vercel.app/assets/case-sklad/concept-variants-scroll-5.webp) ![Варианты визуальной концепции приложения — горизонтальная лента, экран 6](https://troydesigns.vercel.app/assets/case-sklad/concept-variants-scroll-6.webp) ![Варианты визуальной концепции приложения — горизонтальная лента, экран 7](https://troydesigns.vercel.app/assets/case-sklad/concept-variants-scroll-7.webp) ### В концептинге самое главное — вовремя остановиться Чтобы поиск не превратился в бесконечный, мы выстроили ритм: арт-директор ежедневно задавал вектор и помогал держать фокус, а раз в неделю проходило дизайн-ревью со всей командой — быстрая обратная связь по логике, консистентности визуала и полноте состояний. Так варианты отсеивались быстро и по делу. ### Остановились на таком варианте - Плашки на всю ширину - Светло–серые карточки на белом фоне - Много воздуха в элементах: кнопках, чипах, баннерах - Большие скругления - Залитые иконки - Графика в тёплых тонах, имеет практическую пользу (показывает форму ячейки, какие вещи поместятся и т.д.) ![Финальный вариант концепции — экран 1](https://troydesigns.vercel.app/assets/case-sklad/concept-final-1.webp) ![Финальный вариант концепции — экран 2](https://troydesigns.vercel.app/assets/case-sklad/concept-final-2.webp) ## 4. Дизайн система Font & Color H 0 Cъешь ещё этих мягких французски Н XL Cъешь ещё этих мягких французских булок Н L Cъешь ещё этих мягких французских булок Н M Cъешь ещё этих мягких французских булок, да выпей Н S Cъешь ещё этих мягких французских булок, да выпей BL Cъешь ещё этих мягких французских булок, да выпей BL Reg Cъешь ещё этих мягких французских булок, да выпей чаю BM Cъешь ещё этих мягких французских булок, да выпей чаю BM Reg Cъешь ещё этих мягких французских булок, да выпей чаю BS Cъешь ещё этих мягких французских булок, да выпей чаю BS Reg Cъешь ещё этих мягких французских булок, да выпей чаю Text Primary 2A2A2B Secondary 9A999E Accent 5246E7 Primary on Dark FFFFFF Neutral FFFFFF 60% Background Neutral 1 2B2452 4% Main FFFFFF Secondary F2F1F7 Accent 5246E7 Neutral 2 2B2452 6% Neutral on Dark FFFFFF 10% Servises Negative F52222 Border F1F1F6 Positive 17D424 Warning FF6726 ### Теперь надо было превратить множество разрозненных правил в единую систему Нас четверо, и без общих правил на отрисовке получилось бы четыре разных приложения. Зафиксировали типографику и цвета — это стало общим языком команды. ![Схема компонентов дизайн-системы](https://troydesigns.vercel.app/assets/case-sklad/ds-components.jpg) ### После долгих обсуждений появилась минимальная система Компоненты, отступы, скругления и эффекты — ровно столько, сколько нужно, чтобы четыре дизайнера рисовали как один. Система осознанно минимальная: она пополнялась по ходу проекта, а не пыталась предугадать всё заранее. ## 4.1 Мой вклад в систему ### Одна строка вместо трёх Строки в чекауте, в модалке выбора способа оплаты и в списках были отдельными компонентами, хотя почти не отличались. Свёл их в один: иконка, бордер, заголовок, описание и подпись включаются переключателями. ### Карточки S и M Карточки не были компонентами и собирались заново в разных конфигурациях. Сделал универсальные в двух размерах — под разное количество контента. ### Иконки в одном месте Иконки брали из разных библиотек. Собрал их в одном месте — единый источник и для команды, и для разработки. ### Системные компоненты по IOS 18 В макетах жили компоненты из старых версий IOS, например навбар. Привёл их к гайдам IOS 18, показал команде, как пользоваться обновлённой системой, и сам заменял устаревшие компоненты, когда замечал. ## 5. Отрисовка и финализация ### Теперь мы распределили роли Моя зона — сдача вещей на склад, от точки входа до подписания акта. Параллельно вёл главную, профиль, партнёрскую часть и авторизацию. ## 5.1 Облачный склад ![Экраны точки входа облачного склада, экран 1](https://troydesigns.vercel.app/assets/case-sklad/cloud-entry-1.webp) ![Экраны точки входа облачного склада, экран 2](https://troydesigns.vercel.app/assets/case-sklad/cloud-entry-2.webp) ### Точка входа Услуга находит пользователя сама: видна на главной и в уведомлениях. Перед оформлением — короткий онбординг, он снимает барьер новой услуги. ![Основные экраны склада, экран 1](https://troydesigns.vercel.app/assets/case-sklad/cloud-screens-1.webp) ![Основные экраны склада, экран 2](https://troydesigns.vercel.app/assets/case-sklad/cloud-screens-2.webp) ![Основные экраны склада, экран 3](https://troydesigns.vercel.app/assets/case-sklad/cloud-screens-3.webp) ### Основные экраны склада Статус заказа виден на главной, объём хранения не ограничен, акт приёмки подписывается в пару тапов — без бумаги и курьеров. ## 5.2 Выбор ячейки ![Экран точки входа выбора ячейки](https://troydesigns.vercel.app/assets/case-sklad/cell-entry-1.webp) ### Точка входа Как и склад — прямо на главной: до любой ключевой услуги один тап ![Экраны поиска ячейки на карте — горизонтальная лента, экран 1](https://troydesigns.vercel.app/assets/case-sklad/cell-map-scroll-1.webp) ![Экраны поиска ячейки на карте — горизонтальная лента, экран 2](https://troydesigns.vercel.app/assets/case-sklad/cell-map-scroll-2.webp) ![Экраны поиска ячейки на карте — горизонтальная лента, экран 3](https://troydesigns.vercel.app/assets/case-sklad/cell-map-scroll-3.webp) ![Экраны поиска ячейки на карте — горизонтальная лента, экран 4](https://troydesigns.vercel.app/assets/case-sklad/cell-map-scroll-4.webp) ![Экраны поиска ячейки на карте — горизонтальная лента, экран 5](https://troydesigns.vercel.app/assets/case-sklad/cell-map-scroll-5.webp) ### Поиск на карте Список или карта — кому как привычнее. Тап по пину раскрывает склад, не уводя с карты. Фильтры те, по которым выбирают на самом деле: расстояние, размер и срок. ![Экраны страницы склада с выбором ячеек, экран 1](https://troydesigns.vercel.app/assets/case-sklad/cell-warehouse-1.webp) ![Экраны страницы склада с выбором ячеек, экран 2](https://troydesigns.vercel.app/assets/case-sklad/cell-warehouse-2.webp) ![Экраны страницы склада с выбором ячеек, экран 3](https://troydesigns.vercel.app/assets/case-sklad/cell-warehouse-3.webp) ![Экраны страницы склада с выбором ячеек, экран 4](https://troydesigns.vercel.app/assets/case-sklad/cell-warehouse-4.webp) ![Экраны страницы склада с выбором ячеек, экран 5](https://troydesigns.vercel.app/assets/case-sklad/cell-warehouse-5.webp) ![Экраны страницы склада с выбором ячеек, экран 6](https://troydesigns.vercel.app/assets/case-sklad/cell-warehouse-6.webp) ### Страница склада Три размера ячеек, аренда — от суток до года. Главная находка — подсказки вместимости на реальных вещах: вместо кубометров человек видит, что «сюда поместится шкаф и четыре коробки». Это и закрывает боль выбора объёма. ### Страховка вещей На бенчмаркинге я не нашёл страховки ни у одного конкурента и предложил её сам. Пользователь добавляет вещи, указывает их рыночную цену — и сразу видит стоимость защиты на кнопке. Для бизнеса это дополнительный доход с каждой аренды, для клиента — ответ на страх «а вдруг с вещами что-то случится». Встроил страховку в оформление аренды ячейки и в сдачу вещей на склад. ## 5.3 Часть приложения для партнёров ![Экран точки входа партнёрской части](https://troydesigns.vercel.app/assets/case-sklad/partner-entry-1.webp) ### Точка входа Акцент — на франшизе, и это прямое продолжение бизнес-задачи: успех продукта на старте измеряется количеством привлечённых партнёров, поэтому предложение стать партнёром встречает пользователя уже на главной. ![Экраны о преимуществах франшизы, экран 1](https://troydesigns.vercel.app/assets/case-sklad/partner-benefits-1.webp) ![Экраны о преимуществах франшизы, экран 2](https://troydesigns.vercel.app/assets/case-sklad/partner-benefits-2.webp) ![Экраны о преимуществах франшизы, экран 3](https://troydesigns.vercel.app/assets/case-sklad/partner-benefits-3.webp) ### Экраны о преимуществах франшизы ![Главная партнёрской части, экран 1](https://troydesigns.vercel.app/assets/case-sklad/partner-home-1.webp) ![Главная партнёрской части, экран 2](https://troydesigns.vercel.app/assets/case-sklad/partner-home-2.webp) ![Главная партнёрской части, экран 3](https://troydesigns.vercel.app/assets/case-sklad/partner-home-3.webp) ### Главная Первый экран отвечает на вопрос «как идут дела?»: доход, динамика аренды за неделю, популярный тариф. Сложную аналитику осознанно вынесли за рамки MVP. ![Страница склада партнёра — горизонтальная лента, экран 1](https://troydesigns.vercel.app/assets/case-sklad/partner-warehouse-scroll-1.webp) ![Страница склада партнёра — горизонтальная лента, экран 2](https://troydesigns.vercel.app/assets/case-sklad/partner-warehouse-scroll-2.webp) ![Страница склада партнёра — горизонтальная лента, экран 3](https://troydesigns.vercel.app/assets/case-sklad/partner-warehouse-scroll-3.webp) ![Страница склада партнёра — горизонтальная лента, экран 4](https://troydesigns.vercel.app/assets/case-sklad/partner-warehouse-scroll-4.webp) ### Страница склада Пульт управления объектом в телефоне: финансы, состояние оборудования и сети, камеры, заказ уборки и заправки, документы. То самое «негде подсмотреть», спроектированное с нуля. ![Экраны финансов партнёра, экран 1](https://troydesigns.vercel.app/assets/case-sklad/partner-finances-1.webp) ![Экраны финансов партнёра, экран 2](https://troydesigns.vercel.app/assets/case-sklad/partner-finances-2.webp) ![Экраны финансов партнёра, экран 3](https://troydesigns.vercel.app/assets/case-sklad/partner-finances-3.webp) ### Финансы Прозрачность — основа доверия в комиссионной модели, поэтому здесь видна каждая операция: зачисления арендной платы, комиссии сервиса, списания за услуги. Партнёр всегда понимает, из чего сложилась его выплата. ![Экраны профиля партнёра, экран 1](https://troydesigns.vercel.app/assets/case-sklad/partner-profile-1.webp) ![Экраны профиля партнёра, экран 2](https://troydesigns.vercel.app/assets/case-sklad/partner-profile-2.webp) ![Экраны профиля партнёра, экран 3](https://troydesigns.vercel.app/assets/case-sklad/partner-profile-3.webp) ### Профиль Всё юридически важное — под рукой: данные юрлица, реквизиты для выплат, настройки аккаунта и управление активными сессиями. Скучная, но критичная часть, где цена ошибки — недошедшая выплата.