DMD CRM System

Я зробив для клієнта повний цикл операційного управління — від моменту закупівлі авто до післяпродажної комунікації. Шість етапів, кожен з власними sub-операціями і власним dashboard у системі. Перехід між етапами автоматичний — деталь рухається конвеєром без ручного перенесення.

Етап 1 — Закупівля та логістика авто. Пошук авто на аукціонах і у приватних власників, оцінка стану і прибутковості розбірки, викуп, організація доставки, митне оформлення для імпортних авто, приймання на склад з фіксацією VIN і автогенерацією карти вузлів.

Етап 2 — Розбірка та первинна обробка. Планування розбірки за моделлю авто, демонтаж деталей з фіксацією у системі, сортування за категоріями (двигун, кузов, салон, електроніка), первинна дефектовка зі станом «робоче / під ремонт / лом».

Етап 3 — Підготовка деталей. Мийка та очищення, детальна перевірка функціоналу, ремонт при потребі, класифікація фінального стану (А — як нова, B — робоча зі слідами використання, C — потребує ремонту покупцем).

Етап 4 — Контент і публікація. Фотофіксація з шаблоном ракурсів і фіксованим освітленням, написання опису з характеристиками з бази, автоматична публікація оголошення на OLX, Prom, AutoRia і власному сайті — одним кліком, без ручного дублювання.

Етап 5 — Облік і систематизація. Маркування деталі унікальним SKU, пакування з відповідним рівнем захисту, розміщення на складі за логікою «гарячий / теплий / холодний» доступ — найходовіше ближче до зони відвантаження.

Етап 6 — Продажі та комунікація. Обробка запитів з 4 каналів (телефон, сайт, маркетплейси, месенджери), допродажі (cross-sell деталей до зробленого замовлення), відправка з автоматичним TTN, післяпродажне обслуговування і збір зворотного зв'язку для рейтингу.

Дизайн-система побудована довкола високої щільності інформації без перевантаження. Кожен екран має чітку візуальну ієрархію: critical actions — праворуч-зверху, secondary — зліва, статус — внизу. Світла тема як default, темна — опційно (оператор перемикає одним кліком).

Архітектура екрану. Лівий sidebar з модулями (Vehicle intake, Dismantling, Refurbishment, Listing, Orders, Accounting), основна робоча зона по центру, контекстна панель праворуч — підсумки і швидкі дії саме до виділеного об'єкта. Sidebar колапсується до іконок для досвідчених операторів — економить 180 px ширини під робочий стіл.

Каталог. Virtual scroll витримує 200K+ позицій без лагів. Кожен рядок — компактна картка зі станом (color-coded: зелений/жовтий/червоний), фото-міні (24×24 px), ключовими атрибутами і ціною. Inline editing — клік на ціну, набираєш нову, Enter; без модалок і forms-routine.

Пошук. Cmd/Ctrl+K відкриває global pallete з autocomplete за VIN, маркою, моделлю, артикулом. Дебаунс 120 ms, результат за 80–150 ms на 200K SKU. Recent searches кешуються — оператор у 70% випадків шукає те саме що 5 хвилин тому.

Bulk-операції. Shift+Click для діапазону, Cmd+Click для toggling — стандартний macOS-pattern, тому навіть новачки розуміють інтуїтивно. Виділив 50 деталей → одна дія: змінити статус, перемістити на склад, опублікувати на маркетплейс.

Реал-тайм. WebSocket update без перезавантаження сторінки — нова деталь з'являється у списку з м'якою анімацією, змінений статус підсвічується на 1.5 с. Toast-нотифікації внизу-праворуч, не відволікають від робочої зони.

Empty + loading states. Кожен порожній список має ілюстрацію + одну CTA-кнопку («Прийняти перше авто», «Додати першу деталь»). Skeleton-loading на 100% екранів — користувач бачить форму до того як завантажились дані, відчуття «миттєво».

Keyboard-first. Усі основні дії доступні без миші: J/K для навігації по списку, E для редагування, Space для preview, Esc для виходу. На реальному виробництві оператори можуть вести облік однією рукою, тримаючи деталь у іншій.

Accessibility. Контраст AA+ на всіх станах, focus rings на всіх інтерактивних елементах, ARIA-labels для screen reader, reduced-motion respect для toast анімацій.