Телеграм, WhatsApp +380637610482
Валерий Данюк
Валерий ДанюкразработчикРазработка ИИ‑инструментов для бизнеса. Качественно. Недорого.Написать в Telegram
FARFETCH España — превью сайта в этом стиле

FARFETCH España

Модная галерея в стиле «белого куба». Представьте себе элитное торговое пространство, где стены, полы и оборудование выбелены добела, и только одежда и люди, которые ее носят, создают каждый оттенок, текстуру и визуальную выразительность

Farfetch функционирует как галерея моды в стиле «белый куб»: интерфейс практически полностью лишен цвета, позволяя редакционной фотографии определять все визуальные решения. Всю структурную работу выполняет типографика — используется специально разработанный геометрический шрифт без засечек (Farfetch Basis) с начертанием 400 и 700, а заголовки разделов и логотип выполнены шрифтом с засечками, который рассматривает текст как композицию. Макет архитектурный: центрированный контент во всю ширину, жесткие 3- и 4-колоночные сетки товаров, достаточное пространство для размещения разделов (48–72px) и полное отсутствие декоративных элементов. Компоненты лишены украшений — тонкие подчеркивания для поиска, скрытые навигационные ссылки, заглавные буквы в названиях категорий под изображениями, плоские плитки товаров без теней и границ. Единственный цвет в системе — это сами фотографии; интерфейс — это рамка, а не само изображение.

Страница представляет собой центрированную композицию во всю ширину с максимальной шириной контента ~1280px. Заголовок представляет собой тонкую трехзонную панель (навигация по категориям слева, центрированный текстовый знак, вспомогательные значки справа), под которой справа расположено поле поиска. Первый раздел — это трехколоночная сетка из полноэкранных плиток категорий (MUJER, HOMBRE, INFANTIL), каждая с наложенной меткой. Под каждым разделом категории расположена четырехколоночная сетка из карточек категорий товаров (NOVEDADES, ROPA, BOLSOS, ZAPATOS) с заголовками, написанными прописными буквами. Заголовки разделов центрированы и написаны шрифтом с вертикальным отступом ~48px сверху и снизу. Отсутствуют чередующиеся фоновые полосы — вся страница представляет собой одно сплошное белое поле. Нижний колонтитул инвертируется до #222222 в виде единой темной полосы. Навигация представляет собой минималистичную верхнюю панель без фиксированных элементов, без мега-меню и без боковой панели.

В визуальной системе доминирует редакционная фэшн-фотография — крупноформатные изображения высокого разрешения, занимающие всю страницу, с моделями в архитектурных интерьерах и крупными кадрами товаров. Сама фотография выполнена в приглушенной, обесцвеченной палитре: бетонные стены, натуральный камень, нейтральные интерьеры, мягкий направленный дневной свет. Модели снимаются в среднем и полном росте с редакционными позами, а не в строгой позе для каталогов электронной коммерции. Изображения товаров (сумок, обуви) изолированы на нейтральном сером или каменном фоне без какого-либо контекста, связанного с образом жизни — объект ЯВЛЯЕТСЯ главным героем. Интерфейс не добавляет никаких визуальных элементов: ни значков, ни рекламных наклеек, ни декоративных рамок. Все визуальное богатство исходит от отдела фотографии, а не от системы дизайна.

Палитра

Нейтральные

  • Carbon #222222 — Основной текст, текст страницы, навигационные ссылки, значки, логотип, нижний колонтитул и почти черный цветовой тон для всей монохромной системы.
  • Paper #ffffff — Холст страницы, фоновые изображения карточек, поверхности плиток товаров, поля ввода и доминирующий фон, благодаря которому фотография является единственным цветовым акцентом.
  • Ash Gray #b6b6b6 — Нежные штрихи иконок, дополнительные границы, подчеркивание поиска в фоновом режиме, призрачный текст-заполнитель в полях ввода — самый тихий вариант, не нейтральный к тексту.
  • Stone #f5f5f5 — Эффект плавного перехода при наведении курсора на навигационные полосы, вторичный тон поверхности для вспомогательных панелей и фона объявлений, самый мягкий эффект плавного перехода в стеке.
  • Graphite #727272 — Приглушенный вспомогательный текст, неактивные границы форм, отключенные обводки значков — средне-серый цвет, который сигнализирует о снижении акцента без потери читаемости.
  • Smoke #e6e6e6 — Тонкие разделители между рядами продукции, едва заметная структурная линия в остальном бесшовной компоновке.

Типографика

от 13 до 30px · 3 ступеней

  • Farfetch Basis — замена: Söhne (paid) or Inter (free) — both share the geometric humanist proportions; Inter as the practical open-source fallback · начертания 400, 700 · Для всего, что отображается пользователю, используется специально разработанный геометрический шрифт без засечек: ссылки навигации — 13–15px/400, основной текст и описания товаров — 15px/400, заголовки разделов — 22–30px/400, а логотип FARFETCH — 700. Заголовки, набранные только шрифтом 400, — это намеренный отказ от жирного шрифта: заголовки разделов имеют обычный, уверенный, но не кричащий вес, а 700 зарезервирован для логотипа и наиболее выразительных названий категорий. Специальная геометрия обеспечивает равномерный контраст штрихов и тонкую гуманистическую теплоту, чего не смог бы добиться стандартный шрифт Helvetica.

Интервалы и форма

НазначениеЗначение
Плотностьплотная
Базовый шаг24px
Радиус кнопок0px
Радиус карточек0px
Тенинет — границы вместо теней
Между секциями48-72px
Ширина страницы1280px

ИИ соберёт ваш сайт в стиле FARFETCH España и наполнит его

  • Наполнит товарами и постами по ссылке — Instagram, TikTok, Facebook.
  • Перенесёт контент со старого сайта — достаточно указать адрес.
  • Современный дизайн на лучшем движке: React (Next.js) с серверным рендерингом и SEO-оптимизацией из коробки.
  • Полная автоматическая SEO-оптимизация под поисковую выдачу и рекомендации нейросетей.

Похожие стили

  • MAKR — Музейная витрина для изделий из кожи ручной работы. Тихий, белоснежный зал, где под большими фотографиями ко…
  • Franco Maria Ricci Editore — Каталог галереи в стиле ар-деко — полированные золотые линии на белоснежном пергаменте
  • Laura Monin — Стена редакционной галереи, белый мрамор, чернильный штамп
  • OhDada — Стена редакционной галереи
  • Cursor — Уютная мастерская из пергамента, освещенная тлеющими углями
  • Structured — Галерея эпохи Возрождения на бумаге, напоминающей пластилин
  • MindMarket — Уютная книжка-сказка на кремовой бумаге — дружелюбное редакционное полотно, где крупные заголовки Inter и вы…
  • Airbnb — Тихая белая стена галереи с одной кораллово-красной закладкой
  • Apple (España) — Музейная галерея в мягком дневном свете — это единое, захватывающее, невесомое белое помещение, где каждый э…
  • Lamborghini — Черный цвет кузова в выставочном зале, под светом прожекторов — один желтый автомобиль
  • Amplemarket — Залитое солнцем рабочее место, усыпанное конфетти
  • Getharvest — Рабочий стол в «золотой час» — холст теплого кремового цвета, белые открытки, развешанные на холсте, и одно …