Electronic Materials Office
En glødende glør i et galleri dekorert med trekull
Kontoret for elektroniske materialer er et verksted sent på kvelden: et matt kullsvart lerret, en enkelt glødende oransje kull og en skrifttype som hvisker i stedet for å erklære. Grensesnittet behandler hver skjerm som et mørklagt studio – fotografier av tastaturet er den eneste virkelige lyskilden, og brukergrensesnittet adlyder den. Overskrifter, satt i 200-vekt GT-Flexa, svever i et enormt negativt rom; brødteksten er bevisst liten og humanistisk (Times). Fargen måles: ren hvit for skrift, dempet lilla (#9e9eff) for lenker, og en enkelt oransje (#f45500) oppfordring til handling på siden som gløder med sin egen 30 pikslers glød. Komponentene passer tett innenfor en radius på 20 piksler, kantene er knapt synlige ved #9d9d9d, og de eneste skyggene i systemet er to fargede glorier rundt den primære handlingen.
Et fullbredde, kullfarget lerret med sentrert innhold med maksimal bredde (~1200 piksler). Hovedskjermen starter med et mediekort med en radius på 20 piksler som inneholder en produktvideo, som opptar omtrent 80 % av viewportbredden, umiddelbart etterfulgt av en GT-Flexa 200-overskrift med flere linjer som brytes til nesten full innholdsbredde. Seksjonsrytme: en enkelt produktbeskrivelsesseksjon med store bokstaver i Tobias-stil, etterfulgt av et 2x2-rutenett (på skrivebordet) med produktbeskrivelseskort. Kortene bruker 1 piksel #9d9d9d-kantlinjer og 24 piksler innbindingsmarginer mellom seg. Sjenerøs vertikal pusting – seksjonene er atskilt med 48–128 piksler kullfarget negativ plass i stedet for skillelinjer. Navigasjonen er et enkelt, gjennomsiktig panel forankret øverst, med en klynge av skjulte lenker og en enkelt Ember-handlingsfremmende oppfordring. Ingen sidefelt, ingen megameny, ingen sekundær navigasjon.
Bildene er kun for produktdemonstrasjonsformål – et nærbilde av Altar I-tastaturet mot en helt svart bakgrunn, med bakgrunnsbelysning ovenfra som får dekselet til å gløde og tastehettene til å reflektere lys rundt kantene. Ingen livsstil, ingen menneskehender, ingen miljøkontekst. Bildene har høy kontrast og er mørke; den eneste fargen utenfor den monokrome paletten er den oransje strømbryteren på selve tastaturet, som gjenspeiler den Ember Orange-handlingsfremmende oppfordringen. Bildene er firkantede eller 16:9, alltid plassert i kort med en radius på 20 piksler og som strekker seg utover kantene på kortet (det er ingen polstring rundt bildet, og teksten er under kanten). Ikonstil: den eneste ikonografien er en liten fylt sirkel (●) før logoen – en enkelt oransje prikk, ~6 piksler tykk.
Palett
Merke
- Ember Orange
#f45500— Den primære handlingsknappen med fyll er den eneste kromatiske overflaten i brukergrensesnittet, alltid ledsaget av en 30 pikslers oransje glorie, noe som gjør at den gløder som en glødetråd; den 30 pikslers ytre gløden på den primære ringeknappen dupliserer det glødende oransje sekskantsymbolet, men eksisterer som en skygge i stedet for en fylling, noe som gjør at knappen ser opplyst ut innenfra.
Nøytral
- Studio Charcoal
#202020— Lerret- og pappoverflatene er som gulvet i et mørkt galleri, aldri helt svarte, slik at øyet kan hvile på de myke kantene. - Bone White
#ffffff— Hovedtekst, tynne rammer på bilder og en sjelden invertert overflate. Hele skrifttypehierarkiet vedlikeholdes uavhengig. - Ash Gray
#9d9d9d— Dempet tekst, diskré kortrammer og inaktive bildetekster er den eneste mellomgrå fargen i fargeskjemaet, som brukes når hvitt er for sterkt. - Mid Felt
#eaeaea— En lys overflatevask for inverterte paneler eller modale rutenett – en hvitnyanse som ligger mellom beige og mørkt lerret. - Carbon
#000000— Det mest slående aksentet er for ikonstrøk og kontrasterende rammer der kullsyrelerretet er for lyst til å holde formen godt. - Lavender Link
#9e9eff— Fargen på den innebygde lenken og omrisset av den ekstra handlingsrammen står i en dempet, kjølig kontrast til den varme oransje fargen, noe som sikrer at handlingene er lesbare mot den kullfargede bakgrunnen.
Typografi
fra 16 til 86 piksler · 8 trinn
- GT-Flexa — erstatning: Inter (200/400) or Manrope (200/400) · omriss 200, 400 · Primærskrifttypen for overskrifter og dekorative elementer. Dikten på 200 tillater alle overskrifter over 24 piksler – dette er en signaturstil: med 68 piksler og 86 piksler ser det ut til at bokstavene løses opp i atmosfæren i stedet for å rope. Dikten på 400 er egnet for underoverskrifter og bildetekster på kort, der de knapt er hørbare. Linjeavstanden er redusert til 1,0 i de største størrelsene, slik at den dekorative skrifttypen stables oppå hverandre som en luftsøyle.
- Tobias-light — erstatning: Söhne Buch or Inter Tight · omriss 400 · En sekundær typografisk stil for seksjonsoverskrifter og bunntekstlogoen. Den brukes ett trinn under GT-Flexa 200 for å skape en tonal kontrast – Tobias har en mer arkitektonisk og uttrykksfull følelse, mens GT-Flexa er mer atmosfærisk. Den negative bokstavavstanden reduserer de brede proporsjonene til Tobias Light.
- Times — erstatning: Source Serif 4 or PT Serif · omriss 400 · Brødteksten og overskriftsavsnittene er et bevisst motstykke til de geometriske, dekorative skrifttypene, som bruker seriffer. Seriffene gir varme og redaksjonell autoritet til produktbeskrivelsene uten å overskride brødtekstens størrelse.
Intervaller og form
| Hensikt | Betydning |
|---|---|
| Tetthet | tett |
| Grunnleggende trinn | 4-8px |
| Knapperadius | 20px |
| Kortradius | 20px |
| Skygger | ingen grenser i stedet for skygger |
| Mellom seksjoner | 48-128px |
| Sidebredde | 1200px |
AI vil bygge nettstedet ditt i Electronic Materials Office -stil og fylle det
- Fyll på med produkter og innlegg via lenken - Instagram, TikTok, Facebook.
- Overfør innhold fra det gamle nettstedet ditt – bare oppgi adressen.
- Moderne design på den beste søkemotoren: React ( Next.js) med serverrendering og SEO-optimalisering rett ut av boksen.
- Helautomatisk SEO-optimalisering for søkeresultater og anbefalinger fra nevrale nettverk.
Lignende stiler
- OFFFICE : — et noir-galleri omsluttet av monolittisk skrifttype
- Bibliothèque — Et svart kubeformet galleri under en spotlight – en enslig opplyst plate i en enorm, mørk hall
- 21 TSI — Et karmosinrødt tomrom, en enkelt silhuett – en high fashion-redaksjonell artikkel der brukergrensesnittet oppløses i atmosfæren
- Structured — Renessansegalleri på plastelinalignende papir
- CHAIBOY — En svart gallerivegg med et enkelt bakgrunnsbelyst fotografi
- Holiday 100 — Et gavegalleri ved midnatt – en serif-overskrift fungerer som en spotlight, et mørkt lerret som en fløyelsvegg, og hvert produktbilde henger som en nøye utvalgt ramme.
- Apple (España) — Museumsgalleriet, i mykt dagslys, er et enkelt, fengslende, vektløst hvitt rom, der hver utstilling er opplyst av en spotlight mot en lett tonet vegg.
- Analogue — Svart gallerimontre – varer svever i tomrommet
- Apple (España) — Obsidian Gallerys utstillingsvindu er en mørk utstillingshall der et enkelt titanobjekt gløder mot en beksvart bakgrunn.
- Studio Oker — Et mørklagt galleri med skarlagenrøde detaljer – et porteføljerom dekket av svarte vegger, hvor hvite bokstaver ser ut til å sveve og en enkelt rød hvisking skjærer gjennom stillheten.
- 099 SUPPLY — En gallerivegg fylt med svart-hvite objekter
- Retool — Et varmt obsidianverksted – en overflate for presisjonsverktøy, opplyst av ulmende glør, hvor alt skapes