Spectrum Interactive
Платформа обучения инвестициям, где сложный процент разбирают через инструмент, который можно покрутить руками прямо в уроке.
Всё снято с живой версии сайта, в том виде, в каком её видит посетитель.
Inter Tight
Заголовки и текстAa
- SpectrumMedium 500
- SpectrumSemiBold 600
- SpectrumBold 700
АБВГҐДЕЄЖЗИІЇЙ abcdefghijklm 0123456789
Bruno Ace
ЛоготипAa
- SpectrumRegular 400
ABCDEFGHIJKLM abcdefghijklm 0123456789
Скругления
- 16 px
- 32 px
- пилюля
Кнопки: пилюля
Шкала текста
- AaH1, 96 px
- AaH2, 48 px
- AaH3, 24 px
- AaТекст, 20 px
Контраст
- 15,7 : 1текст на фоне, AAA
- 15,7 : 1надпись на кнопке, AAA
Тени
Мягкая нейтральная тень
Проблема
Инвестиции плохо учатся текстом. Разница между «6% годовых» и «6% годовых двадцать лет» видна на графике за секунду и теряется в абзаце. Ровно в этом месте читатель уходит с курса. Значит, платформа не могла быть сборником статей с тестом в конце.
Что мы сделали и почему
Курсы и инструменты собраны в одно приложение: калькуляторы и модели живут прямо внутри урока, как его часть. Пространственная сцена работает прямо в браузере через Three.js, без плагинов и установки, движение ведёт GSAP. Интерфейс держит тёмную подложку и один акцент, чтобы самым светлым на экране были цифры.
Взгляд поближе
Что получилось
Проект в разработке, и мы показываем его таким намеренно. Это лучшее доказательство того, что мы умеем технически: 3D в браузере, интерактивные модели, ровный кадр. Цифр по студентам и пройденным урокам здесь не будет, пока платформа не работает вживую.