Что такое Ретро веб-дизайн?

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

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

Стиль подходит брендам, которым важнее тепло, чем глянец - в первую очередь путешествиям, музыке, кофе, забегаловкам и продуктам образа жизни на природе, - и работает как осознанная противоположность плоскому, холодному SaaS-дизайну. Там, где art-deco тянется к геометрической симметрии 1920-х и позолоченной формальности, ретро здесь остаётся расслабленным и прогретым солнцем - кремовая бумажная основа с закатным оранжевым и дополнительным бирюзовым акцентом вместо строгой чёрно-металлической палитры.

Ключевые визуальные характеристики

• Полосатое закатное солнце - горизонтальные прозрачные полосы, вырезанные из нижних двух третей диска, - над слоистыми горными силуэтами
• Извилистая, «нарисованная от руки» дорожная или речная линия с пунктирной осевой полосой, проходящая через низ hero-сцены
• Вращающийся круглый значок с текстом по изогнутому пути, как этикетка пластинки, и небольшим треугольником play в центре
• Лёгкая текстура зерна плёнки и виньетирование по краям, наложенные на всю сцену, чтобы она не читалась плоской или чисто цифровой
• Свободно разбросанные птицы-«галочки» в небе, расставленные вручную, а не по сетке
• Карточки статистики в стиле почтовых марок с пунктирной рамкой и мелкой моноширинной меткой категории в углу

Цветовые характеристики

• Тёплая кремовая бумажная основа вместо чистого белого или чёрного - близкая по духу к состаренной газетной бумаге constructivism, но теплее и светлее
• Основной закатно-оранжевый цвет для диска солнца, ключевого призыва к действию и акцентов заголовка
• Дополнительный бирюзовый акцент, зарезервированный под кольца значка, дорожную разметку и мелкие структурные детали
• Тёмно-коричневые «чернильные» тона для текста вместо чистого чёрного - вся палитра держится в одной тёплой семье
• Мягкие смешанные тона вместо плоской неоновой или металлической заливки - градиенты остаются тёплыми и низкоконтрастными, отсылая к выцветшей на солнце печати

Типографика

• Двухстрочный заголовок, сочетающий более лёгкую курсивную строку с засечками и одно тяжёлое, крупное жирное слово - отсылка к рукописному плакатному шрифту
• Моноширинная метка-эпиграф с широким трекингом и почтовые штемпели по углам ради ощущения печати и штампа
• Простой тёплый рубленый шрифт для основного текста, чтобы акцидентная засечка не выглядела перегруженной

UI-паттерны

• Шапка с простым круглым логотипом-солнцем, текстовой навигацией и одной кнопкой-таблеткой призыва к действию
• Двухколоночный hero: текст и статистика с одной стороны, полноразмерная иллюстрированная закатная сцена с другой, складывающиеся в одну колонку на узких экранах
• Ряд карточек-«почтовых марок» со статистикой под hero вместо обычной строки логотипов
• Волнистая SVG-линия-разделитель между подвалом и телом страницы вместо прямой границы