GÉNIE · двадцать пять вариантов
Магазин умных колец: каждый вариант — целая страница. Герой с эффектом, шесть показателей, сценарий дня со залипающей сценой, сравнение, конфигуратор отделки и размера с пересчётом цены, три шага, отзывы, доверие, вопросы, форма и подвал.
25 MACHINE — тот же продукт, но собранный в дизайн-языке движка личного сайта serjey.com: чёрный фон, волосяные линии, моноширинные микро-подписи, номера секций, градиентные заголовки и бегущие строки.
Движок восстановлен и усилен: добавлены слоистые горы со звёздами (приём из присланного 3D-героя), параллакс-слои с разной глубиной, варианты появления с пружиной и блюром, плавный скролл на десктопе и разбивка заголовка по словам без разрывов.
TITANE
01
TITANEТёмный титан и жидкий металл — то, что ты уже одобрил, теперь под GÉNIE.шейдер · metal · unbounded
OR NOIR
02
OR NOIRЧёрное с золотом: ювелирная витрина, серифный заголовок, mesh в тёплых тонах.шейдер · mesh · playfair
IVOIRE
03
IVOIREСветлая бумага вместо тёмного: бутик, дневной свет, тонкая антиква.CSS · noise · cormorant
NUIT BLEUE
04
NUIT BLEUEГлубокий синий и лучи софитов — ночная, «лабораторная» подача.шейдер · rays · bodoni
ACIER
05
ACIERГрафит и дизеринг: техно-люкс, узкий шрифт, строгая сетка.шейдер · dither · grotesk
CONSTELLATION
06
CONSTELLATIONСозвездие частиц на всё полотно — твой любимый эффект с Vibe.canvas · constellation · inter
FRACTALE
07
FRACTALEФрактальная точечная сетка реагирует на курсор волной, золотые узлы.canvas · fractal · mono
AURORE
08
AUROREДышащие цветовые пятна: мягко, дорого, без единой резкой линии.CSS · aurora · unbounded
RIVIERA
09
RIVIERAИзометрическая сетка и неон: ретро-люкс восьмидесятых.CSS · iso · syne
PERLE
10
PERLEСветлая минималистичная витрина: растр-точки, ничего лишнего.CSS · halftone · inter
ONYX
11
ONYXПочти чёрное стекло: карточки с блюром, тонкая типографика.CSS · panels · inter
CUIVRE
12
CUIVREМедь вместо стали: тёплый металл, вечерний свет.шейдер · metal · playfair
ÉMERAUDE
13
ÉMERAUDEИзумруд с золотом: редкое, коллекционное звучание.шейдер · mesh · cormorant
MATRICE
14
MATRICEПотоки символов и монопространство: кибер-люкс для технарей.canvas · matrix · mono
PLASMA
15
PLASMAЖивая плазма: яркий градиент, смелая типографика.canvas · plasma · syne
MERCURE
16
MERCUREРтутные капли на белом: светлый люкс с жидким металлом.canvas · metaballs · grotesk
ÉTOILES
17
ÉTOILESЗвёздное поле с параллаксом: тишина и глубина космоса.canvas · stars · bodoni
RUBAN
18
RUBANРедакционный журнал: светлая и тёмная полосы, крупная антиква.CSS · split · playfair
KINÉTIQUE
19
KINÉTIQUEТолько типографика: чистый фон, огромные бегущие строки.CSS · none · unbounded
VITRAIL
20
VITRAILВитрина как витраж: цветные панели-стёкла, игра оттенков.CSS · panels2 · syne
LUMIÈRE
21
LUMIÈREТёплый свет софитов: золотое свечение, мягкие тени.шейдер · rays · cormorant
MONTAGNES
23 · новое
MONTAGNESСлоистые горы, звёздное поле и свечение горизонта — приём из присланного 3D-героя.canvas · mountains · cormorant
PROFONDEUR
24 · новое
PROFONDEURЧетыре слоя с разной глубиной едут с разной скоростью — параллакс из присланного компонента.CSS · parallax · playfair
SABLE
22
SABLEПесочные тона и текстура бумаги: спокойный премиум для 40+.CSS · noise · bodoni
MACHINE
25 · новое
MACHINEДизайн-язык движка serjey.com: чёрный фон, волосяные линии, моно-подписи с трекингом .3em, номера секций, градиентные заголовки #FFF→#93A7B4 и бегущие строки на ✦.движок serjey.com · Inter + JetBrains Mono
Что смотреть первым. 25 MACHINE — дизайн-язык движка serjey.com на настоящих элементах каталога /features (страница внутри сайта, не статика). 16 MERCURE — светлая ртуть (архив). Главная страница serjey.com/genie — тот же макет в ночной версии со спокойным звёздным небом (эффект stars), поэтому светлый архив остался отдельной карточкой: было — serjey.com/genie. 23 MONTAGNES — ночные горы и звёздное поле. 24 PROFONDEUR — четыре слоя параллакса. 01 TITANE — жидкий металл.