FRANKY'S
I-kiosk yokudlala imidlalo yakudala ekwikhawuntara yevenkile yokutyibiliza
Ulwimi lukaFranky olubonakalayo ludibaniso lwe-arcade yakudala kunye nevenkile ye-skateboard: i-canvas efudumeleyo yekhrimu (#f3e5df) efakwe imida ye-pixel eqinileyo, ibhodi yokujonga emnyama nemhlophe efumaneka kuyo yonke indawo, kunye nefonti ye-pixel enye, i-Arcade, esetyenziselwa igama ngalinye kwiwebhusayithi. I-palette incinci ngabom—imibala emibini kuphela ye-chromatic eseleyo (i-signal orange #faa21f yesibonakaliso kunye ne-rich green #128e44 yeqhosha lokuthenga), kunye nolawulo lonke olubonakaliswa ngokunyusa ubunzima befonti ye-Arcade ukusuka kuma-400 ukuya kuma-700 kunye nokusebenzisa umnyama ngokuchasene nemvelaphi yekhrimu. Imiphezulu ihlala ithe tyaba kwaye i-monolithic; ubunzulu bufezekiswa kuphela ngomgca wekhrimu we-1px ofakiweyo kumaqhosha kunye nokudlala kwethoni yebhodi yokujonga. Ezi zinto zikhumbuza ii-sprites zangaphambili ze-1990s: imida emnyama engqindilili, i-radii yomda we-6-12px eqinileyo, i-compact 4-8px padding, kunye nee-toggles ze-3D/AR ezibonakala njengee-icon ze-pixelated endaweni yezinto ze-chrome. Amaphepha amatsha enzelwe ukugcina umoya ofana nowe-arcade: akukho mabala ngaphandle kombhalo o-orenji wokuskrola, akukho zithunzi zithambileyo, akukho typography yokuhombisa—iphepha elinombala okhrimu kuphela, imigca emnyama enepikseli, kunye nombala omnye o-orenji ofudumeleyo.
Kwidesktophu, iphepha lemveliso libonisa ulwakhiwo olupheleleyo, oluphakathi, olunobubanzi obuphezulu be-1200px. Isingqisho esisuka phezulu ukuya ezantsi si: umbhalo okrola o-orenji → i-header enemibala ekhrimu enomgca omnyama → ulwahlulo lweekholamu ezimbini (i-55% ibhodi yokujonga kwiphepha lasekhaya / i-45% igridi yeekholamu ezimbini yamakhadi emveliso) → umgca onemibala ekhrimu kwi-footer. Kwiselula, iphepha lasekhaya liyawa libe yibhodi yokujonga ebanzi, kwaye igridi iba lulwakhiwo lwekholamu enye. Amakhadi asasazwa ngokulinganayo kwigridi yeekholamu ezimbini enezahluli zePixel (#e5e7eb) ezingwevu phakathi kwazo. Isithuba phakathi kwamacandelo sincinci (43–61px), kwaye ujongano alusebenzisi imivimbo emnyama egubungela lonke ububanzi bephepha—i-canvas yekhrimu iboniswa ngaphandle kokuphazamiseka.
Ifoto yeekepusi esekwe kwimvelaphi ecocekileyo yekhrimu, ephakathi kwaye inqunyulwe ngokuqinileyo, enethunzi elithambileyo, elimnyama njengelahle ngaphantsi. Akukho ndlela yokuphila, akukho modeli, akukho mxholo—ikepusi yinkwenkwezi. Ipateni yebhodi yokujonga emva kwento ephambili isebenza njengomphezulu wemizobo. Akukho mifanekiso, akukho mifanekiso ye-3D ngaphandle kwe-augmented reality toggle, akukho mifanekiso yokuhombisa ngaphandle komnqamlezo oneepikseli kwilogo.
Iphalethi
Uphawu
- Marquee Orange
#faa21f— Ibha yesaziso phezulu kwesikrini, izinto ezibonisa i-accent, uphawu. - Buy Green
#128e44— Iqhosha elithi "YONGEZA KWINQOLO" lizalisiwe - elona nyathelo lokuthenga liphawulwe ngombala oluhlaza.
Ukungathathi cala
- Arcade Cream
#f3e5df— Imvelaphi yephepha, imiphezulu yekhadi lemveliso, izinto ezifakwa ngamaqhosha. - Ink Black
#000000— Umbhalo oyintloko, uyilo lwebhodi yokujonga, yonke imida ye-UI, imigca yekhadi, imida yeempawu. - Pixel Gray
#e5e7eb— Imida emincinci, izahluli zekhadi, imithetho yesakhiwo phakathi kweeseli zegridi. - Charcoal
#333333— Ithoni yomphezulu wesibini, izikwere zesithunzi sebhodi yokujonga, umbala wesithunzi - Carbon
#151515— Iithoni ezingathathi cala ezityebileyo zokugcwalisa imifanekiso kunye neethayile zebhodi yokutshekisha ezixineneyo. - Muted Gray
#737373— Umbhalo ongasebenziyo/ongacinywanga kumaqhosha nakwimibhalo yomzimba
Ubhalo lweencwadi
ukusuka kwi-10 ukuya kwi-18px · amanyathelo ama-4
- Arcade — ukutshintshwa: VT323 · imida 400, 700 · Ifonti enye isetyenziswa kuyo yonke i-interface—zonke izihloko, iileyibhile, amaxabiso, amaqhosha, umbhalo womzimba, kunye nee-icon zikwi-Arcade. Utshintsho ukusuka kwi-400 ukuya kwi-700 sesona sixhobo sokudala uluhlu lwemisebenzi; ukusebenzisa ifonti yesibini kuya konakalisa inkohliso ye-kiosk.
Amaxesha okuphumla kunye nefom
| Injongo | Intsingiselo |
|---|---|
| Uxinano | xinene |
| Inyathelo elisisiseko | 4-8px |
| Irediyasi yeqhosha | 6px |
| Irediyasi yekhadi | 12px |
| Izithunzi | akukho - imida endaweni yezithunzi |
| Phakathi kwamacandelo | 43-61px |
| Ububanzi bephepha | 1200px |
I-AI iza kwakha iwebhusayithi yakho ngesitayile sika- FRANKY'S ize iyizalise
- Gcwalisa iimveliso kunye nezithuba ngekhonkco - Instagram, TikTok, Facebook.
- Dlulisa umxholo usuka kwisiza sakho esidala—chaza nje idilesi.
- Uyilo lwanamhlanje kwinjini engcono kakhulu: React ( Next.js) ene-server rendering kunye ne-SEO optimization ephuma kwibhokisi.
- Ukulungiswa kwe-SEO ngokuzenzekelayo ngokupheleleyo kwiziphumo zophando kunye neengcebiso zenethiwekhi ye-neural.
Iintlobo ezifanayo
- 099 SUPPLY — Udonga lwegalari oluzele zizinto ezimnyama nezimhlophe
- teenage engineering — Ikhathalogu yemizi-mveliso ekukhanyiseni istudio - imveliso yeyona nto ibalulekileyo kwiphepha, kwaye yonke enye into iyaxoxwa ngayo
- Custo — Igalari enemibala yesinyithi enefonti ye-monolithic. Igumbi lokubonisa elinemibala engwevu-luhlaza engathethiyo, apho into enye emnyama kunye nefonti ye-57px zithetha zona.
- Walden — Ukuthula komgangatho wehlathi - yonke imveliso lilitye, yonke ipixel ibubu kunye nokuthula
- Fiverr — Eyona ndawo iphambili kwimarike yedijithali kukukhanya okuluhlaza okuqaqambileyo xa kuthelekiswa namaqonga emidlalo yeqonga amnyama. Ichaphaza elinye eliluhlaza elikhanyayo lisebenza njenge-ankile yelogo; enye inye inombala ofanayo, eyenzelwe ukuqaqambisa ukuthandwa kweenkonzo ezinikezelwayo.
- Peloton — Ibhakana ebomvu kwindlela yeenqwelo moya emnyama njengejet. Igumbi lokubonisa umzimba apho uphawu olunye olubomvu olukhanyayo lwe-CTA lunqumla kwindawo enkulu, emnyama yokubonisa kwaye lukhokelela kumagumbi acocekileyo, amhlophe azele ziimveliso.
- HOUSEPLANT — ivenkile yeencwadi enamantongomane ephepheni lelinen
- Adam Lippes — Isitudiyo sokuhlela esinombala omnye kwiphepha lekhrimu – iVogue spread apho umhombiso kuphela yigridi yoyilo, kungekhona ipalethi yemibala.
- Elektron — Iphaneli yokulawula izixhobo ezinzulwini zobusuku yi-canvas emnyama, apho iifoto zemveliso zikhanya khona ngelixa ujongano lungabonakali.
- Sigmaphoto — Igalari yeMonochrome yePrecision Instruments ligumbi elimhlophe elithuleyo apho umbala obalulekileyo kuphela ngulowo ukubiza ukuba wenze into.
- Channel Studio — Ilebhu yeefoto zesitudiyo enesithunzi selampu enye yekorale
- Specht Studio — Udonga lwegalari oluzele lulwazi olufihlakeleyo. Isiphelo se-chrome sesitudiyo sinombala omhlophe kunye noonobumba abamnyama; ii-fireworks ezibonakalayo zigxile ngokupheleleyo kwimisebenzi yethayile yeprojekthi.