DepoDart — Інтелект надр
3D-сайт, який ви прогортаєте, мов історію, — і відчуваєте, як AI-модель геологорозвідки працює під вашим курсором.

DepoDart — AI-компанія, яка допомагає гірничодобувним командам вирішувати, де бурити. Це її сайт depodart.com, який я створив у 2026 році: 3D-сайт, що розгортається під час прокручування, англійською, французькою та іспанською — на Next.js 15, React 19 і three.js із власними GLSL-шейдерами.
Сайт для DepoDart — AI-компанії, що зчитує десятиліття даних геологорозвідки й вказує на найкраще місце для наступного буріння. Завдання: зробити невидиму AI-модель відчутно реальною. Рішення: сайт, який ви прогортаєте, мов історію, де кожен розділ — це окрема жива 3D-сцена: ландшафт, що розкривається теплокартою під вашим курсором, стіна сирих даних, що перетворюється на ранжовані цілі, і періодична таблиця, яка спалахує кожним елементом, що його здатна передбачити модель.
- Роль
- Frontend- і 3D-розробник
- Терміни
- 2026
- Стек
- Next.js 15 (static export) · React 19 + TypeScript · three.js + R3F · Custom GLSL shaders · GSAP + ScrollTrigger · Lenis smooth scroll · Zustand · next-intl (EN / FR / ES) · Cloudflare Pages



Завдання
Зробити невидиму модель відчутно реальною.
Що таке DepoDart.
DepoDart — це AI-платформа для гірничої галузі. Вона вивчає десятиліття даних геологорозвідки — вимірювання, карти, старі записи буріння — і підказує гірничій команді, де бурити далі. Завдання: створити сайт, який перетворить цю абстрактну ідею на щось, що справді можна відчути. Тож головна сторінка стала довгою прогортуваною історією, де кожен розділ — це окрема жива 3D-сцена, а не скриншот у рамці.
Чому розповідати це як історію.
«AI знаходить мінерали» — твердження, яке неможливо сфотографувати. Тож сайт дає змогу виконати роботу моделі власним курсором: розкрити ландшафт до теплосигнатури, торкнутися карти, щоб зчитати ймовірність, побачити, як сирі дані стають ранжованими цілями для буріння. Презентація доходить як досвід, а не як абзац тексту.

Історія, яку вона розповідає
Геологорозвідка тримається на неповній інформації.
Справжня проблема, розказана прогортуванням.
Буріння коштує дорого — величезний бюджет іде в кілька свердловин. Тим часом десятиліття корисних вимірювань припадають пилом в архівах, у форматах, що не збігаються, і на картах, які не накладаються одна на одну. DepoDart знаходить закономірності, поховані в усіх цих даних, і перетворює їх на ціль на карті. Сайт проводить вас саме цим шляхом: сирі дані на вході — ранжовані цілі на виході.
Аргумент DepoDart у чотирьох кроках.
- Не чорна скриня — Кожне передбачення показує дані, що до нього привели, — видно, чому модель вказує саме туди, куди вказує.
- Сирі дані на вході, ранжовані цілі на виході — Будь-який формат, будь-яка картографічна система — очищені й вирівняні на одну спільну сітку за години, а не за місяці.
- Чітка локальна деталізація — Карти ймовірностей — від широкого регіонального огляду до деталізації 10–25 метрів на власних даних компанії.
- 37,8 млн км² — Моделі навчалися на відкритих даних геозйомок Канади, США, Бразилії, Австралії, Нової Зеландії та північної Європи — приблизно чверть суходолу Землі.

Покриття
Навчена на чверті суходолу Землі.
37,8 мільйона квадратних кілометрів.
За даними DepoDart, моделі компанії навчалися на десятиліттях відкритих даних геозйомок Канади, Сполучених Штатів, Бразилії, Австралії, Нової Зеландії та північної Європи — 37,8 млн км², приблизно чверть суходолу Землі, більш ніж удвічі більше за площу Росії. На сайті це світний каркасний глобус, що спалахує регіон за регіоном у міру прогортування.
Як це побудовано
Кожен розділ — це окрема 3D-сцена.
Незалежні сцени, ретельне прибирання.
Замість одного великого 3D-рушія на всю сторінку кожен розділ запускає власний — і повністю вимикає його, щойно ви прогортуєте далі. Це прибирання критичне: 3D-графіка швидко з'їдає пам'ять, і без нього така довга сторінка ледь повзла б. Тут кожна сцена віддає свою пам'ять тієї ж миті, коли залишає екран.
Важко для відеокарти, легко для мережі.
Самі сторінки — це прості, заздалегідь зібрані файли, що віддаються зі всесвітньої мережі: вони швидко завантажуються будь-де. Уся важка 3D-робота відбувається на графічному чипі вашого власного пристрою й написана у вигляді невеликих власних графічних програм для кожної сцени.

Рух
Усе рухається в одному ритмі.
Один годинник на весь рух.
Плавне прогортування, закріплені розділи й анімації — усе просувається за одним спільним годинником. Без нього різні системи трохи розходяться, і сторінка ледь помітно «пливе». З ним кожна сцена опиняється рівно там, де велить прогортування, — у кожному кадрі.
Зменшення руху, сприйняте серйозно.
Для відвідувачів, що вмикають у системі налаштування «зменшити рух», сайт справді заспокоюється: прогортування стає миттєвим, кожна сцена перестрибує до завершеного стану, власний курсор відступає, а найважча 3D-сцена просто не запускається. Історія так само читається згори донизу — лише без феєрверків.

Мови
Англійська, французька й іспанська — завжди в ногу.
Три мови, без розсинхрону.
Сайт виходить трьома мовами, кожна за власною адресою. Увесь текст живе у файлах перекладу, де англійська — джерело істини, а автоматична перевірка блокує будь-яке оновлення, у якому бракує перекладу. Новий розділ не може вийти однією мовою й нишком зламати дві інші.
Наступний проєкт: KeyShortcut — Каталог гарячих клавіш