Parallax · 3 техники
В каждой сцене — переключатель сверху между 3 вариантами. Прокручивай секцию вниз — слои разъезжаются. Внизу таблица всех 8 способов.
8 способов получить контент для слоёв
На этой странице ты уже видел live-демо первых 3 (SVG / Abstract / fal-ai). Остальные доступны в стеке но нужно подключить дополнительно.
| Техника | Тип | Стоимость | Скорость | Качество | Плюсы | Минусы | В стеке |
|---|---|---|---|---|---|---|---|
| Hand-coded SVG | free | $0 | минуты | ★★ | ноль ассетов, мгновенно, scalable | стилизованно, требует чутья | ✓ |
| CSS gradient + clip-path (абстракция) | free | $0 | минуты | ★★★ | ноль ассетов, GPU-fast, премиально-абстрактно | только абстракция | ✓ |
| Unsplash CDN photos | free | $0 | минуты | ★★★★ | реальные фото, бесплатно, легально | не всегда совпадает с темой | ✓ |
| fal-ai/flux/schnell + SAM cutout уже использовано на этой странице | paid | ~$0.01/слой | 5-15 сек/слой | ★★★★ | под ваш бренд, photorealistic, быстро, дёшево | платно, async | ✓ |
| fal-ai/flux/dev (премиум) + SAM | paid | ~$0.05/слой | 20-40 сек/слой | ★★★★★ | ultra-photoreal, на ваш промт | 5× дороже schnell | ✓ |
| Iconify / OpenMoji ставится `npm i @iconify/react` | free | $0 | секунды | ★★★ | 20k+ готовых, единый стиль | пиктограммы, не премиум | ✗ |
| Lottie keyframe `lottie-react` уже в template | free | $0 если JSON есть | часы (если делать) | ★★★★★ | плавная художественная анимация | нужен After Effects + Bodymovin | ✓ |
| Spline 3D drag-drop @splinetool/react-spline в template | free | free tier с лимитом | 10-30 мин в редакторе | ★★★★ | real 3D, drag-drop UI | тяжёлый бандл, fps на мобайле | ✓ |
— Что генерится прямо сейчас
p-doctor.jpg и p-cowboy.jpg сгенерированы через fal-ai/flux/schnell — самая дешёвая и быстрая модель ($0.003/img, 5-10 сек). Для премиума можно перейти на fal-ai/flux/dev ($0.025/img) или flux-pro ($0.05/img). После генерации можно прогонять через SAM-3 для прозрачного фона.