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
- Apple iPhone 18 Pro — Et galleri med midnattsbasert maskinvare. Se på hver seksjon som en mørk, museumslignende sokkel, med én del av produktet presist uthevet, og typografien og de blå kontrollene fungerer som diskrete etiketter rundt den.
- Apple Watch Series 12 — En bronsesensor i mørket. Tenk på klokkens maskinvare og statusindikasjoner som opplyste objekter som henger i et nesten mørkt galleri.
- 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.