Vladyslav Didyk

DepoDart — Інтелект надр

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

DepoDart — Інтелект надр

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
Карти скарбів — кольорові шари поверх реального рельєфу, що показують, де найімовірніше залягають мінерали, з деталізацією до 10–25 метрів за даними DepoDart.
Карти скарбів — кольорові шари поверх реального рельєфу, що показують, де найімовірніше залягають мінерали, з деталізацією до 10–25 метрів за даними DepoDart.
Одна модель, кожен елемент — інтерактивна періодична таблиця всього, що здатна передбачити єдина модель.
Одна модель, кожен елемент — інтерактивна періодична таблиця всього, що здатна передбачити єдина модель.
Покриття — світний глобус, що спалахує регіон за регіоном даними геологічних зйомок, на яких навчався AI.
Покриття — світний глобус, що спалахує регіон за регіоном даними геологічних зйомок, на яких навчався AI.

Завдання

Зробити невидиму модель відчутно реальною.

Що таке DepoDart.

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

Чому розповідати це як історію.

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

Відкривна сцена — ландшафт, що проявляє світну теплосигнатуру там, куди рухається ваш курсор.
Відкривна сцена — ландшафт, що проявляє світну теплосигнатуру там, куди рухається ваш курсор.

Історія, яку вона розповідає

Геологорозвідка тримається на неповній інформації.

Справжня проблема, розказана прогортуванням.

Буріння коштує дорого — величезний бюджет іде в кілька свердловин. Тим часом десятиліття корисних вимірювань припадають пилом в архівах, у форматах, що не збігаються, і на картах, які не накладаються одна на одну. DepoDart знаходить закономірності, поховані в усіх цих даних, і перетворює їх на ціль на карті. Сайт проводить вас саме цим шляхом: сирі дані на вході — ранжовані цілі на виході.

Аргумент DepoDart у чотирьох кроках.

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

Покриття

Навчена на чверті суходолу Землі.

37,8 мільйона квадратних кілометрів.

За даними DepoDart, моделі компанії навчалися на десятиліттях відкритих даних геозйомок Канади, Сполучених Штатів, Бразилії, Австралії, Нової Зеландії та північної Європи — 37,8 млн км², приблизно чверть суходолу Землі, більш ніж удвічі більше за площу Росії. На сайті це світний каркасний глобус, що спалахує регіон за регіоном у міру прогортування.

Як це побудовано

Кожен розділ — це окрема 3D-сцена.

Незалежні сцени, ретельне прибирання.

Замість одного великого 3D-рушія на всю сторінку кожен розділ запускає власний — і повністю вимикає його, щойно ви прогортуєте далі. Це прибирання критичне: 3D-графіка швидко з'їдає пам'ять, і без нього така довга сторінка ледь повзла б. Тут кожна сцена віддає свою пам'ять тієї ж миті, коли залишає екран.

Важко для відеокарти, легко для мережі.

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

Розділ про дані — «Сирі дані на вході. Ранжовані цілі на виході». Чотири типи даних геозйомок живлять одну модель.
Розділ про дані — «Сирі дані на вході. Ранжовані цілі на виході». Чотири типи даних геозйомок живлять одну модель.

Рух

Усе рухається в одному ритмі.

Один годинник на весь рух.

Плавне прогортування, закріплені розділи й анімації — усе просувається за одним спільним годинником. Без нього різні системи трохи розходяться, і сторінка ледь помітно «пливе». З ним кожна сцена опиняється рівно там, де велить прогортування, — у кожному кадрі.

Зменшення руху, сприйняте серйозно.

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

«Розширюємо передбачувальну силу ваших даних». Спокійні текстові розділи розбавляють 3D-сцени.
«Розширюємо передбачувальну силу ваших даних». Спокійні текстові розділи розбавляють 3D-сцени.

Мови

Англійська, французька й іспанська — завжди в ногу.

Три мови, без розсинхрону.

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

Наступний проєкт: KeyShortcut — Каталог гарячих клавіш