Electronic Materials Office
En glødende glød i et galleri dekoreret med trækul
Elektronisk Materialekontor er en sene aften-workshop: et mat, kulsort lærred, en enkelt, glødende orange glød og en skrifttype, der hvisker snarere end erklærer. Brugergrænsefladen behandler hver skærm som et mørklagt studie – fotografier af tastaturet er den eneste rigtige lyskilde, og brugergrænsefladen adlyder den. Overskrifter, sat i 200-vægt GT-Flexa, svæver i et enormt negativt rum; brødteksten er bevidst lille og humanistisk (Times). Farven er målt: ren hvid til skrift, dæmpet lilla (#9e9eff) til links og en enkelt orange (#f45500) opfordring til handling på siden, der gløder med sin egen 30px glød. Komponenterne passer tæt inden for en radius af 20px, rammerne er knap nok synlige ved #9d9d9d, og de eneste skygger i systemet er to farvede glorier omkring den primære handling.
Et fuldt bredt, trækulsfarvet lærred med centreret indhold med maksimal bredde (~1200px). Hovedskærmen starter med et mediekort med en radius på 20px, der indeholder en produktvideo, der optager cirka 80% af viewportens bredde, umiddelbart efterfulgt af en GT-Flexa 200-overskrift med flere linjer, der ombrydes til næsten den fulde indholdsbredde. Sektionsrytme: en enkelt produktbeskrivelsessektion med store bogstaver i Tobias-stil, efterfulgt af et 2x2-gitter (på desktop) med produktbeskrivelseskort. Kortene bruger 1px #9d9d9d-kanter og 24px indbindingsmarginer imellem dem. Generøs lodret ånding – sektionerne er adskilt af 48-128px trækulsfarvet negativ plads i stedet for skillelinjer. Navigationen er et enkelt, transparent panel forankret øverst med en klynge af skjulte links og en enkelt Ember-opfordring til handling. Ingen sidebjælke, ingen megamenu, ingen sekundær navigation.
Billederne er kun til produktdemonstration – et nærbillede af Altar I-tastaturet mod en helt sort baggrund med baggrundsbelysning ovenfra, der får kabinettet til at gløde og tasterne til at reflektere lys rundt om kanterne. Ingen livsstil, ingen menneskehænder, ingen miljømæssig kontekst. Billederne har høj kontrast og er mørke; den eneste farve uden for den monokrome palet er den orange tænd/sluk-knap på selve tastaturet, som afspejler Ember Orange-opfordringen til handling. Billederne er firkantede eller 16:9, altid placeret i kort med en radius på 20px og strækker sig ud over kortets kanter (der er ingen margin omkring billedet, og teksten er under kanten). Ikonstil: den eneste ikonografi er en lille udfyldt cirkel (●) før logoet – en enkelt orange prik, ~6px tyk.
Palet
Mærke
- Ember Orange
#f45500— Den primære handlingsknap med en udfyldning er den eneste kromatiske overflade i brugergrænsefladen, altid ledsaget af en 30px orange glorie, der får den til at gløde som en glødetråd; den 30px ydre glød på den primære opkaldsknap duplikerer det glødende orange sekskantsymbol, men eksisterer som en skygge snarere end en udfyldning, hvilket får knappen til at se oplyst ud indefra.
Neutral
- Studio Charcoal
#202020— Lærreds- og papoverfladerne er som gulvet i et mørkt galleri, aldrig helt sorte, så øjet kan hvile på de bløde kanter. - Bone White
#ffffff— Hovedtekst, tynde rammer på billeder og en sjælden inverteret overflade. Hele skrifttypehierarkiet vedligeholdes uafhængigt. - Ash Gray
#9d9d9d— Dæmpet tekst, diskrete kortkanter og inaktive billedtekster er den eneste mellemgrå farve i farveskemaet, der bruges, når hvid er for højlydt. - Mid Felt
#eaeaea— En lys overfladevask til omvendte paneler eller modale gitre - en nuance af hvid, der ligger mellem beige og mørkt lærred. - Carbon
#000000— Det mest slående accent er ikonstrøg og kontrasterende rammer, hvor det trækulsfarvede lærred er for let til at holde formen godt. - Lavender Link
#9e9eff— Farven på det indlejrede link og omridset af den ekstra handlingsramme står i en dæmpet, kølig kontrast til den varme orange, hvilket sikrer, at handlingerne er læselige mod den trækulsfarvede baggrund.
Typografi
fra 16 til 86px · 8 trin
- GT-Flexa — udskiftning: Inter (200/400) or Manrope (200/400) · konturer 200, 400 · Den primære skrifttype til overskrifter og dekorative elementer. Vægten på 200 tillader alle overskrifter over 24px – dette er en signaturskrifttype: ved 68px og 86px synes bogstaverne at opløses i atmosfæren i stedet for at råbe. Vægten på 400 er velegnet til underoverskrifter og billedtekster på kort, hvor de næsten ikke er hørbare. Linjeafstanden er reduceret til 1,0 i de største størrelser, så den dekorative skrifttype stables oven på hinanden som en luftsøjle.
- Tobias-light — udskiftning: Söhne Buch or Inter Tight · konturer 400 · En sekundær typografisk stil til sektionsoverskrifter og sidefodslogoet. Den bruges et trin under GT-Flexa 200 for at skabe en tonal kontrast – Tobias har en mere arkitektonisk og udtryksfuld fornemmelse, mens GT-Flexa er mere atmosfærisk. Den negative bogstavafstand indsnævrer de brede proportioner i Tobias Light.
- Times — udskiftning: Source Serif 4 or PT Serif · konturer 400 · Brødteksten og overskriftsafsnittene er et bevidst modspil til de geometriske, dekorative skrifttyper, der bruger seriffer. Serifferne tilføjer varme og redaktionel autoritet til produktbeskrivelserne uden at overskride brødtekstens størrelse.
Intervaller og form
| Formål | Mening |
|---|---|
| Tæthed | tæt |
| Grundlæggende trin | 4-8px |
| Knapradius | 20px |
| Kortradius | 20px |
| Skygger | ingen grænser i stedet for skygger |
| Mellem sektioner | 48-128px |
| Sidebredde | 1200px |
AI vil bygge din hjemmeside i Electronic Materials Office -stil og udfylde den
- Fyld med produkter og opslag via linket - Instagram, TikTok, Facebook.
- Overfør indhold fra dit gamle websted – angiv blot adressen.
- Moderne design på den bedste søgemotor: React ( Next.js) med serverrendering og SEO-optimering lige fra starten.
- Fuldautomatiseret SEO-optimering til søgeresultater og anbefalinger til neurale netværk.
Lignende stilarter
- OFFFICE : — et noir-galleri opslugt af monolitisk skrifttype
- Bibliothèque — Et sort kubeformet galleri under en spotlight – en ensom oplyst plade i en stor, mørk sal
- 21 TSI — Et karmosinrødt tomrum, en enkelt silhuet – en high fashion-redaktion, hvor brugergrænsefladen opløses i atmosfæren
- Structured — Renæssancegalleri på modellervokslignende papir
- CHAIBOY — En sort gallerivæg med et enkelt baggrundsbelyst fotografi
- Holiday 100 — Et galleri af gaver ved midnat – en serif-overskrift fungerer som spotlight, et mørkt lærred som en fløjlsvæg, og hvert produktbillede hænger som en omhyggeligt udvalgt ramme.
- Apple (España) — Museumsgalleriet er i blødt dagslys et enkelt, fængslende, vægtløst hvidt rum, hvor hver udstilling er oplyst af en spotlight mod en let tonet væg.
- Analogue — Sort gallerimontre – varer svæver i tomrummet
- Apple (España) — Obsidian Gallerys udstillingssal er en mørk udstillingshal, hvor en enkelt titaniumgenstand gløder mod en kulsort baggrund.
- Studio Oker — Et mørklagt galleri med skarlagenrøde accenter – et porteføljerum beklædt med sorte vægge, hvor hvide bogstaver synes at svæve, og en enkelt rød hvisken skærer gennem stilheden.
- 099 SUPPLY — En gallerivæg fyldt med sort-hvide objekter
- Retool — Et varmt obsidianværksted - en overflade til præcisionsværktøj, oplyst af ulmende gløder, hvor alt skabes