Проект: «Старая книга здесь»
Веб-дизайн · Концепция пользовательского интерфейса · Учебный проект
Что я сделал
Я разработал трёхстраничный адаптивный макет интернет-магазина винтажных книг, используя визуальный язык Metro (современный пользовательский интерфейс). В основе лежат ключевые принципы Metro: чистые сеточные компоновки, смелая типографика и плоские визуальные элементы. Однако я адаптировал их под тёплую, старинную эстетику с помощью землистых оттенков, пергаментных текстур и винтажной графики.
Я создал интуитивно понятные интерфейсы для главной страницы, каталога и карточек товаров, обеспечив удобную навигацию и чёткую визуальную иерархию. В проект были интегрированы интерактивные компоненты: карточки книг, слайдеры категорий, а также кнопки действий — «Добавить в корзину» и «Предпросмотр», — выполненные в едином стиле на всех страницах.
Инструменты и навыки
- Инструменты дизайна: Figma (создание макета), Adobe Illustrator (доработка иконок и графических ресурсов)
- Дизайн-системы: Metro UI, адаптивная сетка, семантическая вёрстка
- Основные навыки: UI-дизайн, формирование визуальной идентичности, ориентированная на пользователя вёрстка, кросс-культурная типографика (поддержка русско-персидского интерфейса)
Результаты и выводы
Мне удалось успешно переосмыслить современную дизайн-систему, наполнив её ностальгическим литературным характером. Это подтверждает мою способность адаптировать строгие визуальные рамки к эмоциональному, узкоспециализированному контексту. Сочетание минимализма с теплотой — за счёт пергаментных фонов, акцентов в приглушённых «сухих» цветах и заголовков со шрифтами с засечками — придало интерфейсу как структуру, так и индивидуальность.
В последующих итерациях я улучшил контраст между текстом и фоном, чтобы повысить читаемость, особенно при слабом освещении. Это демонстрирует моё внимание к вопросам доступности уже на ранних этапах проектирования.
Ключевые слова для SEO
UI-дизайн, веб-макет, Metro UI, учебный проект по электронной коммерции, адаптивный дизайн, Figma, винтажный брендинг, многоязычный интерфейс, сеточная вёрстка, UX-концепция
Об этом проекте
В рамках курса по веб-дизайну я исследовал, как можно «смягчить» структурированные дизайн-системы вроде Metro, чтобы они органично передавали атмосферу винтажного книжного магазина. Этот проект отражает мой дизайн-подход: гармоничное сочетание системного мышления и повествования для создания интерфейсов, которые одновременно функциональны, выразительны и наполнены смыслом.