Проект: «Старая книга здесь»

Макет интернет-магазина винтажных книг в ретро-стиле

Веб-дизайн · Концепция пользовательского интерфейса · Учебный проект

Что я сделал

Я разработал трёхстраничный адаптивный макет интернет-магазина винтажных книг, используя визуальный язык Metro (современный пользовательский интерфейс). В основе лежат ключевые принципы Metro: чистые сеточные компоновки, смелая типографика и плоские визуальные элементы. Однако я адаптировал их под тёплую, старинную эстетику с помощью землистых оттенков, пергаментных текстур и винтажной графики.

Я создал интуитивно понятные интерфейсы для главной страницы, каталога и карточек товаров, обеспечив удобную навигацию и чёткую визуальную иерархию. В проект были интегрированы интерактивные компоненты: карточки книг, слайдеры категорий, а также кнопки действий — «Добавить в корзину» и «Предпросмотр», — выполненные в едином стиле на всех страницах.

Инструменты и навыки

  • Инструменты дизайна: Figma (создание макета), Adobe Illustrator (доработка иконок и графических ресурсов)
  • Дизайн-системы: Metro UI, адаптивная сетка, семантическая вёрстка
  • Основные навыки: UI-дизайн, формирование визуальной идентичности, ориентированная на пользователя вёрстка, кросс-культурная типографика (поддержка русско-персидского интерфейса)

Результаты и выводы

Мне удалось успешно переосмыслить современную дизайн-систему, наполнив её ностальгическим литературным характером. Это подтверждает мою способность адаптировать строгие визуальные рамки к эмоциональному, узкоспециализированному контексту. Сочетание минимализма с теплотой — за счёт пергаментных фонов, акцентов в приглушённых «сухих» цветах и заголовков со шрифтами с засечками — придало интерфейсу как структуру, так и индивидуальность.

В последующих итерациях я улучшил контраст между текстом и фоном, чтобы повысить читаемость, особенно при слабом освещении. Это демонстрирует моё внимание к вопросам доступности уже на ранних этапах проектирования.

Ключевые слова для SEO

UI-дизайн, веб-макет, Metro UI, учебный проект по электронной коммерции, адаптивный дизайн, Figma, винтажный брендинг, многоязычный интерфейс, сеточная вёрстка, UX-концепция

Об этом проекте

В рамках курса по веб-дизайну я исследовал, как можно «смягчить» структурированные дизайн-системы вроде Metro, чтобы они органично передавали атмосферу винтажного книжного магазина. Этот проект отражает мой дизайн-подход: гармоничное сочетание системного мышления и повествования для создания интерфейсов, которые одновременно функциональны, выразительны и наполнены смыслом.

Галерея