FRANKY'S
Skeyt dükanının piştaxtasında retro oyun köşkü
Frankinin vizual dili retro arkada və skeytbord mağazasının birləşməsidir: sərt piksel haşiyələri ilə haşiyələnmiş isti krem rəngli kətan (#f3e5df), hər yerdə olan qara-ağ dama lövhəsi və veb saytdakı hər söz üçün istifadə edilən tək pikselli Arcade şrifti. Palitra qəsdən seyrəkdir - yalnız iki xromatik rəng qalır (işarə üçün siqnal narıncı #faa21f və alış düyməsi üçün zəngin yaşıl #128e44), bütün iyerarxiya Arcade şriftinin çəkisini 400-dən 700-ə qədər artırmaqla və krem fonunda qara rəngdən istifadə etməklə ifadə olunur. Səthlər düz və monolit olaraq qalır; dərinlik yalnız düymələrə daxil edilmiş 1px krem xətti və dama lövhəsinin tonal oyunu vasitəsilə əldə edilir. Komponentlər 1990-cı illərin vitrin spritlərini xatırladır: qalın qara haşiyələr, sıx 6-12px haşiyə radiusları, kompakt 4-8px dolğu və xrom elementləri əvəzinə pikselləşdirilmiş nişanlar kimi görünən 3D/AR açarları. Yeni səhifələr arkada bənzəri atmosferi qorumaq üçün nəzərdə tutulub: narıncı rəngli sürüşmə mətnindən başqa heç bir qradiyent, yumşaq kölgələr, dekorativ tipoqrafiya yoxdur - yalnız krem rəngli kağız, qara pikselli xətlər və tək bir isti narıncı rəng.
Masaüstü kompüterdə məhsul səhifəsi maksimum 1200 piksel eni ilə tam enli, mərkəzləşdirilmiş bir düzülüş göstərir. Yuxarıdan aşağıya ritm belədir: narıncı sürüşmə mətni → qara xəttli krem rəngli başlıq → iki sütunlu bölünmə (ana səhifədə 55% dama lövhəsi / məhsul kartlarının 45% iki sütunlu şəbəkəsi) → altbilgidə krem rəngli zolaq. Mobil cihazlarda ana səhifə tam enli dama lövhəsinə yığılır və şəbəkə tək sütunlu düzülüşə çevrilir. Kartlar aralarında boz Piksel (#e5e7eb) bölücüləri olan iki sütunlu şəbəkədə bərabər paylanır. Bölmələr arasındakı məsafə minimaldır (43–61 piksel) və interfeys heç vaxt səhifənin bütün enini əhatə edən tünd zolaqlardan istifadə etmir - krem rəngli kətan fasiləsiz göstərilir.
Təmiz krem rəngli fonda, mərkəzləşdirilmiş və sıx şəkildə kəsilmiş, altında yumşaq, kömür-qara kölgə olan papaqların fotoşəkili. Həyat tərzi, modellər, kontekst yoxdur - papaq ulduzdur. Əsas elementin arxasındakı dama taxtası naxışı qrafik səth kimi xidmət edir. Əlavə reallıq düyməsi istisna olmaqla, illüstrasiyalar, 3D görüntülər, loqotipdəki pikselli xaç istisna olmaqla, dekorativ nişanlar yoxdur.
Palitra
Brend
- Marquee Orange
#faa21f— Ekranın yuxarısındakı bildiriş paneli, vurğu elementləri, brendinq. - Buy Green
#128e44— "SƏBƏTƏ ƏLAVƏ EDİN" düyməsi doldurulub - yaşıl rənglə işarələnmiş yeganə alış əməliyyatı.
Neytral
- Arcade Cream
#f3e5df— Səhifənin arxa planı, məhsul kartı səthləri, düymə əlavələri. - Ink Black
#000000— Əsas mətn, dama taxtası düzeni, bütün UI sərhədləri, kart konturları, işarə sərhədləri. - Pixel Gray
#e5e7eb— İncə sərhədlər, kart bölücüləri, şəbəkə hücrələri arasında struktur qaydaları. - Charcoal
#333333— İkinci dərəcəli səth tonu, dama taxtası kölgə kvadratları, kölgə rəngi - Carbon
#151515— Doldurma illüstrasiyaları və ən sıx dama taxtası plitələri üçün zəngin neytral tonlar. - Muted Gray
#737373— Düymələrdə və əsas mətndə mətn deaktiv/səssizləşdirilib
Tipoqrafiya
10-dan 18 pikselə qədər · 4 addım
- Arcade — əvəzetmə: VT323 · konturlar 400, 700 · İnterfeys boyunca tək bir şrift istifadə olunur — bütün başlıqlar, etiketlər, qiymətlər, düymələr, əsas mətn və ikonlar Arcade-dədir. 400-dən 700-ə keçid iyerarxiya yaratmaq üçün yeganə vasitədir; ikinci bir şriftdən istifadə köşk illüziyasını pozardı.
İntervallar və forma
| Məqsəd | Mənası |
|---|---|
| Sıxlıq | sıx |
| Əsas addım | 4-8px |
| Düymə radiusu | 6px |
| Kart radiusu | 12px |
| Kölgələr | kölgələr əvəzinə sərhədlər yoxdur |
| Bölmələr arasında | 43-61px |
| Səhifə eni | 1200px |
Süni intellekt veb saytınızı FRANKY'S üslubunda quracaq və onu dolduracaq
- Məhsullar və paylaşımlar ilə Instagram, TikTok, Facebook linkləri vasitəsilə tanış olun.
- Köhnə saytınızdan məzmunu köçürün — sadəcə ünvanı göstərin.
- Ən yaxşı mühərrikdə müasir dizayn: Server render və SEO optimallaşdırması ilə React ( Next.js).
- Axtarış nəticələri və neyron şəbəkə tövsiyələri üçün tam avtomatlaşdırılmış SEO optimallaşdırması.
Oxşar üslublar
- 099 SUPPLY — Qara və ağ əşyalarla dolu qalereya divarı
- teenage engineering — Studiya işıqlandırmasında sənaye kataloqu - məhsul səhifədəki yeganə əhəmiyyətli obyektdir və qalan hər şey onun ətrafında müzakirə olunur
- Custo — Monolit şriftə malik gunmetal rəngli qalereya. Tək bir tünd obyektin və 57 piksel şriftin özləri üçün danışdığı solğun boz-yaşıl tonlarda sərgi salonu.
- Walden — Meşə döşəməsinin sükutu - hər məhsul bir daş, hər piksel mamır və sükut
- Fiverr — Rəqəmsal bazarın əsas diqqət mərkəzində qaranlıq teatr səhnələrinə qarşı canlı yaşıl impuls durur. Tək bir neon yaşıl nöqtə loqotip üçün lövbər rolunu oynayır; qalan hissəsi isə təklif olunan xidmətlərin cəlbediciliyini vurğulamaq üçün hazırlanmış monoxromdur.
- Peloton — Qara rəngli podiumda qırmızı mayak. Geniş, qaranlıq sərgi məkanını kəsib məhsullarla dolu təmiz, ağ otaqlara aparan tək bir parlaq qırmızı CTA işarəsinin yerləşdiyi fitness salonu.
- HOUSEPLANT — Kətan kağız üzərində qoz-fındıq olan kitab mağazası
- Adam Lippes — Kremli kağız üzərində monoxrom redaksiya studiyası – yeganə dekorasiyanın rəng palitrası deyil, düzülüş şəbəkəsi olduğu Vogue jurnalının bir versiyası.
- Elektron — Gecə yarısı avadanlıq idarəetmə paneli, demək olar ki, qara bir kətandır və məhsul fotoşəkilləri parıldayır, interfeys isə demək olar ki, görünməz qalır.
- Sigmaphoto — Dəqiq Alətlərin Monoxrom Qalereyası, vacib olan yeganə rəngin sizi hərəkətə çağırdığı sakit ağ bir otaqdır.
- Channel Studio — Bir mərcan abajurlu studiya fotolaboratoriyası
- Specht Studio — Gizli maraqla dolu qalereya divarı. Studiyanın özünün xrom örtüyü ağ səth və qara hərflərdən ibarətdir; vizual atəşfəşanlıq tamamilə layihənin kafel işlərində cəmləşib.