FRANKY'S
Ретро киоск за игри на шанкот во продавница за скејтбординг
Визуелниот јазик на Френки е комбинација од ретро аркада и продавница за скејтборд: топло крем платно (#f3e5df) врамено со крути пикселни граници, сеприсутна црно-бела шаховска табла и фонт со еден пиксел, Arcade, кој се користи за секој збор на веб-страницата. Палетата е намерно ретка - остануваат само две хроматски бои (сигнал портокалова #faa21f за знакот и богата зелена #128e44 за копчето за купување), при што целата хиерархија е изразена со зголемување на тежината на фонтот Arcade од 400 на 700 и со користење на црна боја наспроти кремастата позадина. Површините остануваат рамни и монолитни; длабочината се постигнува само преку вметната кремаста линија од 1px на копчињата и тоналната игра на шаховската табла. Компонентите потсетуваат на спрајтовите од излозите од 1990-тите: дебели црни граници, тесни радиуси на границите од 6-12px, компактно полнење од 4-8px и 3D/AR прекинувачи кои изгледаат како пикселизирани икони, а не како хромирани елементи. Новите страници се наменети да ја одржат атмосферата слична на аркада: без градиенти освен портокалов текст што се движи, без меки сенки, без декоративна типографија - само хартија во крем боја, црни пикселизирани линии и една топла портокалова боја.
На десктоп, страницата на производот прикажува распоред со целосна ширина, центриран, со максимална ширина од 1200 пиксели. Ритамот од горе надолу е: портокалов текст што се лизга → заглавие во крем боја со црна линија → поделена линија во две колони (55% шаховска табла на почетната страница / 45% мрежа од картички на производи во две колони) → кремаста лента во подножјето. На мобилен, почетната страница се собира во шаховска табла со целосна ширина, а мрежата станува распоред со една колона. Картичките се рамномерно распоредени во мрежа од две колони со сиви пикселни (#e5e7eb) разделувачи меѓу нив. Растојанието помеѓу деловите е минимално (43–61 пиксели), а интерфејсот никогаш не користи темни ленти што ја опфаќаат целата ширина на страницата - кремастото платно се прикажува без прекин.
Фотографија од капи на чиста кремаста позадина, центрирана и цврсто исечена, со мека, јаглено-црна сенка под неа. Без животен стил, без модели, без контекст - капата е ѕвездата. Шаховска табла зад главниот елемент служи како графичка површина. Без илустрации, без 3Д рендери освен прекинувачот за зголемена реалност, без декоративни икони освен пикселизираниот крст во логото.
Палета
Бренд
- Marquee Orange
#faa21f— Лента за известувања на врвот од екранот, акцентни елементи, брендирање. - Buy Green
#128e44— Копчето „ДОДАДИ ВО КОШНИЧКА“ е пополнето - единствената акција за купување означена со зелена боја.
Неутрално
- Arcade Cream
#f3e5df— Позадина на страницата, површини на картичките на производот, вметнатини на копчиња. - Ink Black
#000000— Главен текст, распоред на шаховска табла, сите рамки на корисничкиот интерфејс, контури на картички, рамки на икони. - Pixel Gray
#e5e7eb— Тенки граници, разделувачи на картички, структурни правила помеѓу клетките на мрежата. - Charcoal
#333333— Секундарен површински тон, квадрати со сенка на шаховска табла, боја на сенка - Carbon
#151515— Богати неутрални тонови за полни илустрации и најгусти плочки со шаховска табла. - Muted Gray
#737373— Оневозможен/пригушен текст на копчињата и во телото на текстот
Типографија
од 10 до 18px · 4 чекори
- Arcade — замена: VT323 · контури 400, 700 · Низ целиот интерфејс се користи еден фонт - сите наслови, етикети, цени, копчиња, текст и икони се во Arcade. Преминот од 400 на 700 е единствената алатка за креирање хиерархија; користењето втор фонт би ја уништило илузијата за киоск.
Интервали и форма
| Намена | Значење |
|---|---|
| Густина | густ |
| Основен чекор | 4-8px |
| Радиус на копчето | 6px |
| Радиус на картичката | 12px |
| Сенки | без граници наместо сенки |
| Помеѓу деловите | 43-61px |
| Ширина на страницата | 1200px |
Вештачката интелигенција ќе ја изгради вашата веб-страница во стилот FRANKY'S и ќе ја пополни
- Пополнете со производи и објави преку линкот - Instagram, TikTok, Facebook.
- Пренесете содржина од вашата стара страница - само наведете ја адресата.
- Модерен дизајн на најдобриот мотор: React ( Next.js) со рендерирање на серверот и SEO оптимизација веднаш.
- Целосно автоматизирана SEO оптимизација за резултати од пребарување и препораки за невронски мрежи.
Слични стилови
- 099 SUPPLY — Галериски ѕид исполнет со црно-бели предмети
- teenage engineering — Индустриски каталог во студиско осветлување - производот е единствениот значаен објект на страницата, а сè друго се дискутира околу него
- Custo — Галерија во боја на сиво-метал со монолитен фонт. Изложбен салон во пригушени сиво-зелени тонови, каде што еден темен објект и фонт од 57px зборуваат сами за себе.
- Walden — Тишината на шумскиот под - секој производ е камен, секој пиксел е мов и тишина
- Fiverr — Централната точка на дигиталниот пазар е жив зелен пулс наспроти темните театарски сцени. Една неонска зелена точка служи како сидро за логото; остатокот е монохроматски, дизајниран да ја истакне привлечноста на понудените услуги.
- Peloton — Црвен светилник на црна писта. Салон за фитнес каде што еден светло црвен знак на CTA сече низ огромниот, темен изложбен простор и води до чисти, бели простории за производи.
- HOUSEPLANT — книжарница со ореви на ленена хартија
- Adam Lippes — Монохроматско уредничко студио на крем хартија – шаблон од Vogue каде што единствената декорација е мрежата на распоредот, а не палетата на бои.
- Elektron — Контролната табла на опремата на полноќ е речиси црно платно, каде што светат фотографиите од производите, додека интерфејсот останува практично невидлив.
- Sigmaphoto — Монохроматската галерија на прецизни инструменти е тивка бела соба каде што единствената боја што е важна е онаа што ве повикува на акција.
- Channel Studio — Студиска фото лабораторија со еден корален абажур
- Specht Studio — Галериски ѕид исполнет со дискретна љубопитност. Сопствената хромирана завршница на студиото е бела површина и црни букви; визуелниот огномет е целосно концентриран во плочките на проектот.