01 / 04
WHITEPACE
SaaS-лендинг с адаптивной версией и интерактивными тарифами.
Открыть live demo
Задача
Перенести готовый дизайн SaaS-лендинга в работающую адаптивную версию и сохранить его композицию на разных экранах.
Что сделано
- Собрана desktop-версия лендинга.
- Сделана отдельная адаптация для мобильного экрана.
- Реализован интерактивный выбор тарифа с обновлением выбранного плана.
Как работает
Структура и ключевые экраны перестраиваются под ширину устройства. В тарифном блоке пользователь выбирает вариант, после чего активное состояние и итоговый блок обновляются.
Инструменты
- Next.js
- React
- TypeScript
- CSS
Интерфейс
Ключевые экраны
