Le Puzz
Ang Sunny Sunday Circular ay isang tabloid na puno ng mga misteryo.
Ang Le Puzz ay isang maximalist na sistema ng e-commerce para sa mga boutique store, na binuo sa isang two-tone na pundasyon: mayaman, parang-pulot na dilaw na pinares sa purong itim, na nakalagay sa isang cool, kulay abong-perlas na background. Ang estilo nito ay pinaghalong vintage na pahayagan at jigsaw puzzle: ang body copy ay nasa serif na Times, habang ang mga headline ay nasa isang custom na font, ang Times Now, na sadyang lumalabag sa tradisyonal na mga kumbensyon ng e-commerce na umaasa sa mga sans-serif na font. Ang interface mismo ay pinananatiling simple at nakabatay sa grid, na nagbibigay-daan sa visual na epekto na maiparating ng packaging ng produkto (siksik at may mga ilustrasyong komposisyon na puno ng mga laruan). Ang mga kontrol ng interface ay medyo matatag: mga buton na may itim na border sa isang dilaw na background, mga icon na hugis-pill, mga card na may 12px radius, at maluwag na espasyo ng mga letra para sa maliliit na malalaking titik, na nagbibigay kahit sa buton na "QUICK ADD" ng isang editorial flair.
Isang klasikong e-commerce grid na may natatanging disenyo ng editoryal. Ang header ay isang dilaw na honeycomb strip na may 1-lapad na itim na border, na naglalaman ng nakasentrong logo at isang karagdagang hanay ng mga navigation button. Sa ibaba, sa itaas ng isang tatlong-kolum na grid ng mga produkto sa isang kulay abong background, ay isang nakasentrong welcome header sa Times Now font. Ang pangunahing elemento ay isang nakasentrong photo block na may mga bilugan na sulok (40), na nasa gilid ng dalawang product card. Ang ritmo ng mga seksyon ay pinananatili: malawak na patayong espasyo (30), salitan ang dilaw at kulay abong mga ibabaw, at isang maximum na lapad na humigit-kumulang 4.5 cm, nakasentro sa pahina. Ang mga product card ay magkapareho ang laki at nakaayos sa isang maayos na tatlong-kolum na grid na may 5 cm na puwang. Ang layout ay simetriko at nakatali sa grid—walang asymmetrical na komposisyon o magkakapatong na elemento.
Ang elementong biswal ay ang potograpiya ng produkto. Ang mga kahon ng puzzle ay kinukunan ng litrato nang buo laban sa puti/neutral na background, pagkatapos ay inilalagay laban sa mainit na asul o natural na backdrop ng studio. Ang pangunahing larawan ay nagtatampok ng isang taong may hawak na ilang kahon ng puzzle—isang bagay na pang-uri, na kinunan nang may walang kahirap-hirap na enerhiya. Ang mismong pakete ay mayaman, naglalarawan, at maximalist: napakaraming laruan, produktong pagkain, at mga karakter sa matingkad na pangunahing kulay na may makakapal na itim na balangkas, na idinisenyo upang magmukhang ilustrasyon ng isang aklat pambata na nakakalat sa isang 500-piraso na puzzle. Walang abstract graphics, walang 3D renders, walang iconography maliban sa isang magnifying glass—ang mga puzzle mismo ang biswal na wika.
Paleta
Tatak
- Honeycomb Yellow
#ffd931— Ang kulay ng pangunahing brand, ang title bar, ang mga pangunahing action button, ang aktibong estado ng nabigasyon, ang kulay ng salungguhit ng link, ang accent fill—ang iisang kulay na nota kung saan umiikot ang lahat ng iba pa.
Neutral
- Carbon Black
#000000— Ang pangunahing teksto, makakapal na hangganan, mga balangkas ng buton, mga balangkas ng icon, teksto ng nabigasyon ang siyang estruktural na batayan ng buong sistema. - Ink Black
#231f20— Pangalawang teksto, pangunahing teksto, mga hangganan ng buton, mga hangganan ng input field - isang bahagyang mas mainit, halos itim na kulay para sa mas malambot na pakiramdam. - Pearl Gray
#c8cbcd— Page canvas, mga background ng product card, isang kapansin-pansing entablado kung saan lumilitaw ang mga kulay dilaw at itim. - Fog Gray
#a6a8aa— Mga banayad na ibabaw ng badge, mga background ng pangalawang chip, at mga banayad na pagpuno sa user interface. - Smoke Line
#d6d6d6— Manipis na mga divider, maingat na mga divider para sa mesa/baraha.
Tipograpiya
mula 11 hanggang 47px · 6 na hakbang
- Times Now — kapalit: Playfair Display · mga balangkas 100, 400 · Isang serif font para sa mga headline at subheading—ginagamit para sa mga pangunahing headline, pangalan ng produkto, at pamagat ng seksyon. Ang ultra-light na 100-point font na may 47-pixel pitch ay lumilikha ng matangkad at halos pinaikling editoryal na pakiramdam; ang pinaikling mga anyo ng letra (taas ng linya na 0.87–0.90) ay nagbibigay-daan sa malalaking headline na maiposisyon malapit sa kasamang teksto, na ginagaya ang isang naka-print na poster.
- Times — kapalit: Times New Roman · mga balangkas 400 · Ang serif body text ay isang hindi inaasahang pagpipilian para sa isang online store, na nagbibigay sa buong site ng pampanitikan at mala-katalog na pakiramdam. Ang maliit na pagitan ng mga linya (1.15) ay ginagawang siksik at madaling basahin ang mga talata.
- Helvetica Neue — kapalit: Helvetica · mga balangkas 100, 400 · Ang maliliit na teksto sa user interface, teksto sa mga buton, at microtext ay nakatakda sa 11px na font na may malaking pagitan ng mga letra (0.0730em), na lumilikha ng pakiramdam ng pagsusulat gamit ang malalaking titik kahit na sa komportableng temperatura ng katawan.
Mga pagitan at anyo
| Layunin | Kahulugan |
|---|---|
| Densidad | siksik |
| Pangunahing hakbang | 15px |
| Radius ng buton | 12px |
| Radius ng card | 12px |
| Mga anino | walang - mga hangganan sa halip na mga anino |
| Sa pagitan ng mga seksyon | 30-40px |
| Lapad ng pahina | 1200px |
Gagawa ang AI ng website mo sa estilong Le Puzz at pupunuin ito
- Punuin ng mga produkto at post gamit ang link - Instagram, TikTok, Facebook.
- Maglipat ng nilalaman mula sa iyong lumang site—tukuyin lamang ang address.
- Modernong disenyo gamit ang pinakamahusay na engine: React ( Next.js) na may kasamang server rendering at SEO optimization na agad-agad.
- Ganap na awtomatikong pag-optimize ng SEO para sa mga resulta ng paghahanap at mga rekomendasyon sa neural network.
Mga katulad na estilo
- Agence Foudre — Ang pabalat ng magasin ay may mapusyaw na kulay rosas na nakapagpapaalaala sa kolorete.
- INVERSA — Isang terminal ng topographic field sa hatinggabi. Isang madilim na command panel, kung saan ang napakalaking editorial font at isang patong ng neon-green markers ay nakapatong sa mga satellite image ng Earth, bawat label ay monochrome, na parang nagbabasa ng mga coordinate ng misyon.
- Acne Studios — Isang minimalistang espasyo sa gallery na puno ng matingkad na mga litrato—isang magasin sa fashion na nakalagay sa marmol
- GTE — Terminal ng kalakalan sa likod ng mga ilaw sa gallery
- Diabla — Isang patyo sa Mediteraneo sa katanghaliang tapat – mga dingding na kupas na dahil sa araw, isang matingkad na pulang tolda na kanbas, at mga serif na ulong balita ng editoryal na umaabot sa kalangitan.
- Subset — Editoryal na butik na gawa sa hilaw na linen
- Cursor — Isang maginhawang pagawaan ng pergamino, na naliliwanagan ng mga nagbabagang uling
- MindMarket — Isang maaliwalas na aklat ng mga kuwentong engkanto na nasa kremang papel - isang palakaibigang editoryal na canvas kung saan ang malalaking headline ng Inter at mga ginupit na karakter sa papel ay magkakasamang namamalagi sa isang ibabaw na nasisinagan ng araw at malambot na parang sticker.
- Lamborghini — Itim na kulay ng katawan sa showroom, sa ilalim ng mga spotlight - isang dilaw na kotse
- Amplemarket — Isang lugar ng trabaho na nasisinagan ng araw at puno ng confetti
- Getharvest — Isang mesa sa ginintuang oras – isang mainit na kremang canvas, mga puting postcard na nakasabit sa canvas, at isang nag-iisang matingkad na kulay kahel na apoy
- Drive Capital — Retro road trip poster sa mainit na papel