Shopify
Middernagkweekhuis - Handelsmerke blom teen 'n diep turkoois agtergrond, verlig deur 'n enkele vonk kruisement
Shopify se ontwerpstelsel is 'n middernagtelike werkswinkel vir handel: 'n amper-swart doek getint met 'n diep turkooisgroen, 'n wye, selfversekerde sans-serif-lettertipe, en 'n enkele lewendige kruisement-aksent wat interaktiewe oomblikke aktiveer. Die koppelvlak lyk soos 'n donkerkamer, waar produkte en handelsmerke die bron van lig is - foto's en winkelvensters gloei teen amper-swart oppervlaktes, terwyl chroom-elemente terugtrek. Komponente is geometries maar sag: 12px-radiuskaarte met dun rande, pilvormige knoppies en 'n 330-gewig lettertipe wat skaal fluister eerder as skreeu. 'n Enkele chromatiese leesteken (#36f4a4) word spaarsamig gebruik op skakels, etikette en fokustoestande, en kleur word gereserveer vir funksionele oomblikke om te verseker dat handelaarsverhale die visuele fokuspunt bly.
Die maksimum breedte is ~1280px, gesentreer, met volle breedte spatblokke wat verder as die fotohouer strek. Die bladsyritme wissel af: (1) 'n volle breedte donker spatbladsy met 'n oorvleuelende opskrif en oproep-tot-aksie-knoppies, (2) gemaklike donker afdelings met maksimum breedte teks- en beeldblokke in 2 kolomme of beeldroosters in 3 kolomme, (3) interaktiewe vertoonpanele (produkkaart, versendingsrekenaar, wêreldkaart) wat as verhewe kaarte op 'n dieper doek vertoon word. Die navigasie is 'n vaste boonste balk met die logo + 3 navigasie-elemente + sekondêre skakels + die primêre oproep-tot-aksie-knoppie, alles regs in lyn. Die vertikale ritme gebruik 80px gapings tussen afdelings met 'n gladde oorgang - geen verdelers tussen donker afdelings nie, slegs 'n verandering in oppervlaktoon.
Die visuele ontwerp is hoofsaaklik op die kleinhandelaar gefokus: volgrootte produkfoto's en foto's van handelsmerkgeleenthede dra die grootste deel van die visuele gewig, dikwels in die vorm van groot agtergronde met oorliggende wit teks. Die beelde is styf gesny, hoë kontras en feestelik van aard (die lui van die Nasdaq-klok, groepgroete, nabyskote van produkte in die hand). Die donker agtergrond skep die indruk dat hierdie foto's deur kolligte verlig word. Die illustrasies is minimalisties - die hoofverduidelikende werk word gedoen deur ingebedde produkbeelde en skermkiekies van winkelvensters. Ikone is monochroom, met 'n lynwydte van 1.5-2px, tipies wit of #36f4a4 vir aktiewe toestande.
Palet
Handelsmerk
- Shopify Mint
#36f4a4— Aktiewe navigasie-aanwysers, fokusringe, etiket-uitligtings en sweef-uitligtings op skakels is die enigste chromatiese vonkel wat 'n gevoel van geaktiveerde interaktiwiteit teen 'n donker agtergrond skep.
Neutraal
- Midnight Forest
#02090a— Bladsydoek, koptekst agtergrondbeelde, afdeling agtergrondbeelde - Deep Lichen
#061a1c— Hoofkaartoppervlaktes, verhoogde panele, inhoudsblokke. - Shaded Fern
#072720— Navigasiepaneel, bykomende kaarte, skaars merkbare verhoging van die paneel. - Spruce Border
#1e2c31— Dun rande vir kaarte, verdeellyne, invoerveld-omlyne. - Abyss Indigo
#000a1e— Bykomende oppervlak vir die inbedding van produkte/demonstrasies, panele met beskrywings van funksies. - Pure White
#ffffff— Hoofteks, knoppie-invul, titel, logo's.
Tipografie
van 12 tot 70px · 8 stappe
- Neue Haas Grotesk — vervanging: Inter · buitelyne 330, 400, 500, 550, 600 · Die kern tipografiese stelsel is opskrifte met 'n lettertipe gewig van 70–96px (330–400) wat subtiel eerder as hard is; liggaamsteks met 'n lettertipe gewig van 16–18px (400–500); en navigasie en gebruikerskoppelvlak met 'n lettertipe gewig van 14–16px (500–550). Die ultraligte lettertipe gewig van 330 op groot skermgroottes is 'n onderskeidende kenmerk: dit dra vertroue oor deur terughoudendheid eerder as volume.
- Inter Variable — vervanging: Inter · buitelyne 400, 420, 450, 550 · 'n Sekondêre lettertipe wat in navigasie-koppelvlakelemente, klein notas, oortjiekontroles en mikroteks in voetskrifte gebruik word. Die effens groter kleinletters en meer standaard letterspasiëring maak dit meer leesbaar in kompakte groottes. Dit is ook geskik vir situasies waar 'n 420-gewig lettertipe die gaping tussen 'n gewone en mediumgrootte lettertipe vul.
Intervalle en vorm
| Doel | Betekenis |
|---|---|
| Digtheid | gemiddelde |
| Basiese stap | 12px |
| Knoppieradius | 9999px |
| Kaartradius | 12px |
| Skaduwees | geen grense in plaas van skaduwees |
| Tussen afdelings | 80px |
| Bladsybreedte | 1280px |
KI sal jou webwerf in Shopify -styl bou en dit vul
- Vul met produkte en plasings via die skakel - Instagram, TikTok, Facebook.
- Dra inhoud van jou ou webwerf oor – spesifiseer net die adres.
- Moderne ontwerp op die beste enjin: React ( Next.js) met bedienerweergawe en SEO-optimalisering reg uit die boks.
- Volledig outomatiese SEO-optimering vir soekresultate en neurale netwerkaanbevelings.
Soortgelyke style
- Retool — 'n Warm obsidiaanwerkswinkel - 'n oppervlak vir presisiegereedskap, verlig deur smeulende kole, waar alles geskep word.
- Elektron — Die toerusting se beheerpaneel om middernag is 'n byna swart doek, waar produkfoto's skitter terwyl die koppelvlak feitlik onsigbaar bly.
- REKKI — Vlugbeheerpaneel in die fotolaboratorium
- OFFFICE : — 'n noir-galery omhul in monolitiese lettertipe
- Clyde — Die vertoonlokaal, met sy enkele kollig, is 'n amper donker galery waar die enigste kleur in die vertrek 'n warm gradiëntbal is.
- Channel Studio — 'n Ateljeefotolaboratorium met een koraal lampskerm
- Electronic Materials Office — 'n Gloeiende kol in 'n galery versier met houtskool
- ORYZO AI — 'n Foto-essay oor 'n donkerkamer. 'n Eensame voorwerp wat in die warm donkerte sweef, met roomkleurige lettertipe as enigste versiering.
- Factory — Die "oorlogskamer"-terminaal om middernag. Die "fabriek" is 'n skerp swart beheerpaneel waar 'n enkele wit kaart soos 'n flitsligverligte versending land - die enigste voorwerp in die kamer is die werk self.
- Hungry Tiger — Helder borrie-graffiti op die muur van die tandoor. 'n Verenigde palet van goud en roesbruin, met 'n lettertipe so groot dat dit meer soos 'n speserymarkteken as 'n webwerf lyk.
- Bibliothèque — 'n Swart kubusvormige galery onder 'n kollig – 'n eensame verligte bord in 'n groot, donker saal
- Apple (España) — swart teater met verligte toebehore