EVA Dywaniki — Дизайн и адаптивная верстка лендинга (SASS/JS)
Авторский проект по разработке структуры, UI/UX дизайна в Figma и последующей верстке продающего лендинга для заказа автомобильных ковриков EVA (интерфейс выполнен на польском языке для европейского рынка).
ЧТО БЫЛО СДЕЛАНО:
- Проектирование и UI/UX Дизайн: Разработка структуры страницы, прототипирование, выбор цветовой палитры и шрифтовых пар в Figma. Создание адаптивных макетов для мобильных и десктопных экранов.
- Верстка и стилизация: Написание семантического HTML5-кода и модульных стилей с помощью препроцессора SASS (SCSS).
- Адаптивность: Реализация гибкой адаптивной сетки, обеспечивающей удобное отображение на всех типах устройств (от смартфонов до ПК).
- Интерактивный функционал на JS: Реализация попап-формы заказа и модального окна для просмотра видео.
- Визуальные блоки: Демонстрационный виджет выбора цвета коврика, наглядная таблица сравнения преимуществ и галерея выполненных работ.
- Деплой: Оптимизация медиафайлов, минимизация кода и публикация живого демо на хостинге.
ИСПОЛЬЗОВАННЫЙ СТЕК:
- Figma (проектирование, UI/UX дизайн)
- HTML5, CSS3 / SASS (SCSS)
- JavaScript (ES6)
Проект разработан для демонстрации полного цикла создания продающих посадочных страниц: от идеи и визуального дизайна в Figma до адаптивного фронтенд-кода с интерактивными элементами.
Живая ссылка на проект — в блоке «Детали работы» (или перейдите по ссылке здесь: https://slavaslavav.github.io/landing-page/dist/index.html).
#figma #UIUXdesign #html5 #css #SASS(SCSS) #javascript #responsive #Landing
ЧТО БЫЛО СДЕЛАНО:
- Проектирование и UI/UX Дизайн: Разработка структуры страницы, прототипирование, выбор цветовой палитры и шрифтовых пар в Figma. Создание адаптивных макетов для мобильных и десктопных экранов.
- Верстка и стилизация: Написание семантического HTML5-кода и модульных стилей с помощью препроцессора SASS (SCSS).
- Адаптивность: Реализация гибкой адаптивной сетки, обеспечивающей удобное отображение на всех типах устройств (от смартфонов до ПК).
- Интерактивный функционал на JS: Реализация попап-формы заказа и модального окна для просмотра видео.
- Визуальные блоки: Демонстрационный виджет выбора цвета коврика, наглядная таблица сравнения преимуществ и галерея выполненных работ.
- Деплой: Оптимизация медиафайлов, минимизация кода и публикация живого демо на хостинге.
ИСПОЛЬЗОВАННЫЙ СТЕК:
- Figma (проектирование, UI/UX дизайн)
- HTML5, CSS3 / SASS (SCSS)
- JavaScript (ES6)
Проект разработан для демонстрации полного цикла создания продающих посадочных страниц: от идеи и визуального дизайна в Figma до адаптивного фронтенд-кода с интерактивными элементами.
Живая ссылка на проект — в блоке «Детали работы» (или перейдите по ссылке здесь: https://slavaslavav.github.io/landing-page/dist/index.html).
#figma #UIUXdesign #html5 #css #SASS(SCSS) #javascript #responsive #Landing