Auros
Abisalinis terminalas su bioliuminescenciniais duomenų kamuoliais
„Auros“ funkcionuoja kaip finansinių technologijų terminalas, įsikūręs bedugnėje: beveik juoda turkio spalvos drobė su bioliuminescenciniais duomenų rutuliais ir šviesos gradientais nuo turkio iki rožinės spalvos, sukuriančiais gylio, sklandumo ir tėkmės pojūtį. Sąsaja minimalistinė ir kinematografiška, paremta vieno vartotojo ekranu („Matter“), kurio vidutinio storio ekranas su agresyviu neigiamu sekimu sukuria mastelį, nebūdamas pernelyg ryškus. Spalvos paskirstytos tolygiai – achromatinės baltos ir sidabrinės spalvos naudojamos beveik visam turiniui, o chromatinė paletė skirta atmosferiniams gradientams, išskiriantiems kortelių paviršius, ir vienam firminiam piliulės formos mygtukui, kuris keičia spalvą iš turkio mėlynos į levandų rožinę. Kortelės plūduriuoja ant subtilių turkio spalvos paviršiaus keterų (16 pikselių spindulys, be šešėlių), o ne ant aukščio, todėl hierarchija suvokiama kaip vandens gylis, o ne šešėlis ant popieriaus. Komponentai atrodo apgalvoti ir panašūs į instrumentus: didžiosios raidės sekimo žymės, plonos geometrinės rodyklių piktogramos, dideli šviesiai rožinės spalvos skaitmeniniai rodmenys.
Tamsi, viso pločio drobė, kurios turinio maksimalus plotis yra 1440 pikselių. Pagrindinis elementas yra centruotas teksto blokas (antakis → antraštė → potekstė → raginimas veikti), apimantis visą rodinio aukštį, o fono elementas yra dalelė. Skyriai yra viso pločio juostelės, atskirtos didelėmis, daugiau nei 68 pikselių vertikaliomis erdvėmis, kaitaliojančiomis drobę ir šiek tiek įgilintus paviršius. Skyriuje „Naršyti“ naudojamas asimetriškas dviejų stulpelių išdėstymas: kairiajame stulpelyje yra sukrautos funkcijų kortelės, o dešiniajame stulpelyje – geometrinė molekulinė iliustracija. Turinys centruotas siaurais stulpeliais (daugiausia ~600 pikselių), kad būtų lengviau skaityti, o ne tęsiasi nuo krašto iki krašto. Poraštė yra įgilinta duobė (#011d1c) su 120 pikselių vertikalia parašte, sukuriančia gilaus baseino efektą. Navigacija yra plonas, permatomas skydelis, kurio elementai išdėstyti 16–24 pikselių atstumu vienas nuo kito. Bendras ritmas yra kinematografiškas ir erdvus – kiekviena sekcija „kvėpuoja“, o gili, vandenį primenanti spalvų schema sukuria įspūdį, kad su kiekviena ištrauka vis giliau krentate.
Vizualinis stilius minimalistinis ir atmosferiškas. Pagrindiniame puslapyje pavaizduota trimatė dalelių sfera – tūkstančiai mažyčių turkio mėlynumo ir baltų taškelių, sudarančių besisukantį rutulį, atkartojantį drobę ir levandų rausvumo akcentus kraštuose, sukuriantį bioliuminescencinį efektą, primenantį informacinį objektą. Plokščios geometrinės molekulinės diagramos (balti apskritimai ir plonos jungiamosios linijos ant tamsios drobės) dešiniajame stulpelyje tarnauja kaip dekoratyviniai elementai. Jokių nuotraukų, jokių gyvenimo būdo vaizdų, jokių žmonių – vizualinė kalba pagrįsta švaria duomenų grafika ir abstrakčiomis formomis. Dalelių sfera yra apibrėžiantis prekės ženklo tapatybės vizualinis elementas; ji turi pasirodyti bent kartą kiekviename svarbiame puslapyje, kad sustiprintų giliavandenės jūros metaforą.
Paletė
Prekės ženklas
- Liquid Abyss
#012624— Pagrindinis fonas yra puslapio pagrindas, antraštė, pagrindinis elementas ir dominuojantis tamsiai turkio spalvos laukas. Jis sukuria gilios jūros atmosferą. - Liquid Deep
#011d1c— Įgilintas paviršiaus lygis yra poraštės fonas ir gilesnės kartoninės plokštės. Jis suvokiamas kaip pustoniu tamsesnis nei drobė, todėl sukuriamas subtilus gylio gradientas žemyn. - Liquid Kelp
#003734— Pakeltas kortelės paviršius ir mygtuko užpildymas – pakeltas paviršius, esantis vienu laipteliu virš tarpeklio. Naudojamas funkcijų kortelėms, turinio skydams ir gradiento mygtuko pradžios taškui.
Neutralus
- Liquid Mist
#edfffe— Šaltas baltas atspalvis išryškina pagrindinę teksto dalį, skyrių antraštes ir šiltą, šviesią tipografiją. Subtilus mėlynas atspalvis susieja pagrindinę teksto dalį su turkio spalvų schema. - Platinum
#ffffff— Grynai balta spalva naudojama antraštėms, naršymo elementams, piktogramų kontūrams ir didelio kontrasto tekstui. Tai pagrindinė teksto spalva visuose antraščių lygiuose ir pagrindinėje naršymo juostoje. - Silver Mist
#bbc7c6— Antrinis tekstas, prislopinti aprašymai ir nuorodų spalva originalioje būsenoje. Jie turi šiek tiek žalsvą atspalvį, kuris papildo turkio spalvos foną. - Ash
#f2f2f2— Papildomas tekstas citatoms ir atsiliepimams. Neutralus, šaltas pilkas atspalvis, kai turkio spalvos „Silver Mist“ atspalvis atrodo per ryškus. - Slate Deep
#707777— Subtilus paviršiaus atspalvis neaktyviems arba mažai matomiems fonams. Jis yra tarp drobės ir kartono, todėl aukščio skirtumas yra labai subtilus. - Lavender Phosphor
#fde9ff— Foninio apšvietimo spalva dideliems statistiniams duomenims, skaitiklių skaičiams ir svarbiems rodikliams. Rožinis atspalvis išskirtiniame gradiente naudojamas saikingai kaip šviečiantis akcentas ant tamsių paviršių.
Tipografija
nuo 10 iki 96 pikselių · 6 žingsniai
- Matter — pakeitimas: Inter · kontūrai 400, 500 · Antraščių ir pagrindinio teksto šriftas yra pagrindinis, o visoms antraštėms (H1–H3) ir dideliam kinetiniam tekstui (86–295 pikselių) naudojamas 500 storio šriftas. Pagrindiniam tekstui ir vartotojo sąsajos tekstui naudojamas 400 storio šriftas. Dideliems dydžiams būdingi agresyvūs neigiami raidžių tarpai (-0,04 em esant 61 pikseliui, -0,046 em esant 86 pikseliams) ir platūs teigiami raidžių tarpai didžiosiose antraštės dalyse (0,08 em esant 20 pikselių, 0,12 em esant 12 pikselių, 0,15 em esant 10 pikselių). Skiriamasis bruožas yra strategija naudoti tik vidutinio storio antraštes – nėra paryškinto ar šviesaus šrifto, kuris suteikia šriftui vienodą, mechaninį pasitikėjimą.
- Arial — pakeitimas: system-ui · kontūrai 400 · Antrinis atsarginis variantas interaktyviems vartotojo sąsajos elementams (navigacijai, mygtukams, antraštės mikrokopijai, poraštei). Rodoma tik esant 14 pikselių – naudojama kaip saugus, universalus atsarginis variantas, kai neįkelta „Matter“ programa, ir apima formų etiketes, mygtukų tekstą ir nedidelį pagalbinį tekstą.
Intervalai ir forma
| Tikslas | Reikšmė |
|---|---|
| Tankis | vidutinis |
| Pagrindinis žingsnis | 20px |
| Mygtuko spindulys | 6px |
| Kortelės spindulys | 16px |
| Šešėliai | ne – rėmeliai vietoj šešėlių |
| Tarp sekcijų | 68px |
| Puslapio plotis | 1440px |
Dirbtinis intelektas sukurs jūsų svetainę Auros stiliumi ir ją užpildys
- Užpildykite produktais ir įrašais per nuorodą – Instagram, TikTok, Facebook.
- Perkelkite turinį iš senos svetainės – tiesiog nurodykite adresą.
- Modernus dizainas geriausiame variklyje: React ( Next.js) su serverio atvaizdavimu ir SEO optimizavimu iš karto.
- Visiškai automatizuotas SEO optimizavimas paieškos rezultatams ir neuroninių tinklų rekomendacijoms.
Panašūs stiliai
- Design Full-Time — studijos kinas su vienu šiltu prožektoriumi
- Air — skulptūra „Vidurnakčio dangus per stiklą“
- Slash — Vidurnakčio skliautas su paauksuotomis sąskaitų knygomis
- Raycast — Vidurnakčio komandų centras, Koralų Neonas
- Dimension — prieblandoje apšviesta darbo vieta su matinio stiklo plokštėmis
- Modal — Fosforescencinis terminalas tamsioje serverių patalpoje – vienintelis šviesos šaltinis yra ryškiai žalia spalva
- Giga — Vidurnakčio horizontas virš matinio obsidiano
- Reflect Notes — Žvaigždėta violetinė erdvė yra tamsi observatorija, kurioje natos sklando tarsi žvaigždynai beveik juodos indigo tuštumos fone.
- Ameba — Valdymo kambarys vidurnaktį – elektrinė mėlyna šviesa matinio stiklo plokštėse
- AgentQL — Šiaurės pašvaistė virš terminalo naktį
- Frame — Kino teatras vėlyviems vakariniams filmų seansams. Tamsus kambarys, kuriame visą darbą atlieka vienas mėlynas prožektorius, o vartotojo sąsaja pasitraukia į foną, leidžiant kūrybinį turinį projektuoti į priekį.
- Harness — Misijos valdymo centras vidurnaktį su fosforescuojančiomis žaliomis detalėmis