FARFETCH España
Galeria mody w stylu „białego sześcianu”. Wyobraź sobie ekskluzywną przestrzeń handlową, w której ściany, podłogi i wyposażenie są wybielone, a jedynie ubrania i ludzie, którzy je noszą, tworzą każdy odcień, fakturę i ekspresję wizualną.
Farfetch funkcjonuje jak galeria mody typu „biały sześcian”: interfejs jest niemal całkowicie pozbawiony kolorów, co pozwala fotografii redakcyjnej dyktować wszelkie decyzje wizualne. Typografia zapewnia całą strukturę – zastosowano specjalnie zaprojektowaną geometryczną czcionkę bezszeryfową (Farfetch Basis) o grubości 400 i 700, a nagłówki sekcji i logo są renderowane czcionką szeryfową, która traktuje tekst jako kompozycję. Układ jest architektoniczny: wyśrodkowana treść o pełnej szerokości, sztywne siatki produktów w 3 i 4 kolumnach, dużo miejsca na rozmieszczenie sekcji (48–72 px) i całkowity brak elementów dekoracyjnych. Komponenty są pozbawione ozdobników – subtelnych podkreśleń dla wyszukiwania, ukrytych linków nawigacyjnych, wielkich liter w nazwach kategorii pod obrazami, płaskich kafelków produktów bez cieni i obramowań. Jedynym kolorem w systemie są same zdjęcia; interfejs jest ramką, a nie samym obrazem.
Strona charakteryzuje się wyśrodkowaną kompozycją na całej szerokości, o maksymalnej szerokości treści ~1280 px. Nagłówek to cienki, trzystrefowy panel (nawigacja kategorii po lewej stronie, wyśrodkowany znak tekstowy i ikony pomocnicze po prawej), pod którym po prawej stronie znajduje się pole wyszukiwania. Pierwsza sekcja to trzykolumnowa siatka pełnoszerokościowych kafelków kategorii (MUJER, HOMBER, INFANTIL), każdy z nakładką. Poniżej każdej sekcji kategorii znajduje się czterokolumnowa siatka kart kategorii produktów (NOVEDADES, ROPA, BOLSOS, ZAPATOS) z tytułami pisanymi wielkimi literami. Tytuły sekcji są wyśrodkowane i napisane czcionką z pionowym wcięciem ~48 px u góry i u dołu. Nie ma naprzemiennych pasów tła — cała strona to jedno ciągłe białe pole. Stopka jest odwrócona do #222222 jako pojedynczy ciemny pasek. Nawigacja to minimalistyczny górny pasek bez stałych elementów, bez menu mega i bez paska bocznego.
W systemie wizualnym dominuje redakcyjna fotografia modowa – duże obrazy o wysokiej rozdzielczości, wypełniające całą stronę, przedstawiające modelki w architektonicznych wnętrzach i zbliżenia produktów. Sama fotografia jest wykonana w stonowanej, odbarwionej palecie barw: betonowe ściany, naturalny kamień, neutralne wnętrza, miękkie, kierunkowe światło dzienne. Modelki są fotografowane w połowie i całej długości ciała, w pozach redakcyjnych, a nie sztywnych pozach z katalogów e-commerce. Zdjęcia produktów (torebek, butów) są izolowane na neutralnym szarym lub kamiennym tle, bez żadnego kontekstu lifestylowego – to temat JEST głównym bohaterem. Interfejs nie dodaje żadnych elementów wizualnych: żadnych ikon, naklejek promocyjnych, żadnych dekoracyjnych ramek. Całe bogactwo wizualne pochodzi z działu fotografii, a nie z systemu projektowania.
Paleta
Neutralny
- Carbon
#222222— Tekst główny, tekst strony, linki nawigacyjne, ikony, logo, stopka i niemal czarna kolorystyka całego monochromatycznego systemu. - Paper
#ffffff— Płótno strony, obrazy tła kart, powierzchnie kafelków produktów, pola wprowadzania danych i dominujące tło, które sprawia, że fotografia jest jedynym akcentem kolorystycznym. - Ash Gray
#b6b6b6— Subtelne kontury ikon, dodatkowe obramowania, podkreślenie wyszukiwania w tle, zastępczy tekst w polach wprowadzania danych — najcichsza opcja, wcale nie neutralna pod względem tekstu. - Stone
#f5f5f5— Efekt przejścia po najechaniu kursorem na paski nawigacyjne, drugorzędny odcień powierzchni dla pasków podrzędnych i tła reklam, najdelikatniejszy efekt przejścia w stosie. - Graphite
#727272— Wyciszony tekst pomocniczy, nieaktywne obramowania formularzy i wyłączone kontury ikon — średni odcień szarości sygnalizuje zmniejszenie nacisku bez pogarszania czytelności. - Smoke
#e6e6e6— Subtelne podziały między rzędami produktów, ledwo zauważalna linia strukturalna w zresztą jednolitym układzie.
Typografia
od 13 do 30px · 3 kroki
- Farfetch Basis — wymiana: Söhne (paid) or Inter (free) — both share the geometric humanist proportions; Inter as the practical open-source fallback · wytyczne 400, 700 · Specjalnie zaprojektowana geometryczna czcionka bezszeryfowa jest używana do wszystkich wyświetlanych użytkownikowi treści: linków nawigacyjnych o szerokości 13–15 px/400 pikseli, tekstu głównego i opisów produktów o szerokości 15 px/400 pikseli, nagłówków sekcji o szerokości 22–30 px/400 pikseli oraz logo FARFETCH o szerokości 700 pikseli. Nagłówki o szerokości 400 pikseli to celowe odejście od pogrubienia: nagłówki sekcji mają regularną, wyrazistą, ale nie przesadnie pogrubioną grubość, podczas gdy szerokość 700 pikseli jest zarezerwowana dla logo i najbardziej wyrazistych nazw kategorii. Ta specjalna geometria zapewnia równomierny kontrast linii i subtelne, humanistyczne ciepło, którego nie udałoby się osiągnąć standardowej czcionce Helvetica.
Interwały i forma
| Zamiar | Oznaczający |
|---|---|
| Gęstość | gęsty |
| Podstawowy krok | 24px |
| Promień przycisku | 0px |
| Promień karty | 0px |
| Cienie | nie - granice zamiast cieni |
| Między sekcjami | 48-72px |
| Szerokość strony | 1280px |
Sztuczna inteligencja zbuduje Twoją witrynę w stylu FARFETCH España i wypełni ją
- Uzupełnij produktami i postami za pomocą linku - Instagram, TikTok, Facebook.
- Przenieś zawartość ze starej witryny — wystarczy podać adres.
- Nowoczesny design na najlepszym silniku: React ( Next.js) z renderowaniem serwerowym i optymalizacją SEO od razu po wyjęciu z pudełka.
- W pełni zautomatyzowana optymalizacja SEO dla wyników wyszukiwania i rekomendacje sieci neuronowych.
Podobne style
- MAKR — Gablota muzealna z ręcznie robionymi wyrobami skórzanymi. Ciche, całkowicie białe pomieszczenie, w którym etykiety w ciepłym, czarnym tuszu unoszą się pod dużymi fotografiami wyrobów skórzanych trzymanych w dłoniach lub na tle krajobrazów, a jedynym kontrastującym kolorem jest stonowany pas szałwii.
- Franco Maria Ricci Editore — Katalog Galerii Art Deco – polerowane złote linie na czystym białym pergaminie
- Laura Monin — Ściana galerii redakcyjnej, biały marmur, stempel tuszowy
- OhDada — Galeria ścienna redakcyjna
- Cursor — Przytulny warsztat pergaminowy, oświetlony tlącymi się węglami
- Structured — Galeria renesansowa na papierze plastelinowym
- MindMarket — Przytulna, bajkowa książka na kremowym papierze – przyjazne płótno redakcyjne, na którym duże nagłówki Interu i wycięte z papieru postacie współistnieją na nasłonecznionej, miękkiej jak naklejka powierzchni.
- Airbnb — Cicha, biała ściana galerii z pojedynczą koralowo-czerwoną zakładką
- Apple (España) — Galeria muzeum, w łagodnym świetle dziennym, stanowi pojedynczą, urzekającą, nieważką białą przestrzeń, w której każdy eksponat jest oświetlony reflektorem umieszczonym na lekko przyciemnionej ścianie.
- Lamborghini — Czarny kolor nadwozia w salonie, pod reflektorami - jeden żółty samochód
- Amplemarket — Zalane słońcem miejsce pracy pokryte konfetti
- Getharvest — Biurko o złotej godzinie – ciepłe kremowe płótno, białe pocztówki zawieszone na płótnie i pojedynczy, jasnopomarańczowy płomień