Spotify
Öise muusikakeskuse juhtimisruum
Spotify veebiliides on tihe ja tume meedia juhtimiskeskus: peaaegu must lõuend, mida kaunistavad erksad albumikaaned, üksainus roheline aktsent ja pillikujulised juhtnupud. Tüpograafia on kompaktne ja utilitaarne – väikese suurusega eritellimusel disainitud geomeetriline sans-serif kirjatüüp, mis võimaldab albumikaantel ja artisti fotodel teha suurema osa visuaalsest tööst. Paigutus on fikseeritud kaheveeruline kest (külgriba + põhivoog), millel on ruudukujuline albumikaante ja ümarate avataride ruudustik, luues geomeetriliste tüüpide rütmilise vaheldumise. Liides väldib järske kõrguse muutusi, tuginedes peentele pinnaerinevustele (#121212 kaarti #000000 lõuendil) ja ühele suurele gradientribale energia saamiseks. Tulemuseks on DJ-puldi tunne: infotihe, akustiliselt tume ja hetkega mängimiseks valmis.
Fikseeritud kaheveeruline paigutus sisaldab vasakpoolset külgriba („Teie teek“) ja responsiivset põhisisu ala. Ülemine riba on täislaiuses must riba, millel on vasakul otsing ja paremal konto toimingud. Põhisisu kerib vertikaalselt horisontaalsete kaartide karussellidega – populaarsed lood 5-veerulises ruudustikus, populaarsed artistid 5-veerulises ümmarguses ruudustikus ja populaarsed albumid/singlid jätkavad seda mustrit. Sektsioonide vaheline kaugus on kompaktne (32 cm). Alumine reklaamibänner on ankurdatud vaatevälja allosas. Navigeerimine toimub ainult ülemise riba ja külgriba kaudu – megamenüüsid ega riivsaia pole. Rütm vaheldub: ruudukujulised kaardid → ümmargused kaardid → ruudukujulised kaardid, luues sektsioonide vahele geomeetrilise kontrasti.
Albumikaaned ja artistide fotod on peamine visuaalne sisu. Kaaned on esitatud tihedate ruudukujuliste fragmentidena (kuvasuhe 1:1) raadiusega 6 pikslit – piisavalt teravad, et tunduda toimetuse stiilis, kuid samas piisavalt pehmed, et olla kaasaegsed. Kunstnike fotod on ümarad fragmendid, mis rõhutavad nägu identifikaatorina. Põhiliides on vaba dekoratiivsetest fotodest, elustiilipiltidest või abstraktsetest graafikatest. Ainus mittefotograafiline visuaalne element on allosas olev lillast siniseni gradientriba, mis on brändivärvi ainus element. Ikoonid on minimalistlikud, monolineaarsed, valged tumedal taustal – väikesed ja funktsionaalsed, mitte kunagi dekoratiivsed.
Palett
Bränd
- Spotify Green
#1ed760— Rohelist värvi kasutatakse dekoratiivsete detailide sekundaarse aktsendina ja harvemini kasutatavate otsingupäringute esiletõstmiseks. Seda ei tohiks kasutada tegevusele kutsuvate tekstide põhivärvina.
Neutraalne
- Pure White
#ffffff— Kerge tugipind märkamatu tausta loomiseks ja sektsioonide eraldamiseks. Seda ei tohiks kasutada üleskutse põhivärvina. - Signal Red
#b85850— Punane toimib dekoratiivsete detailide toetava aktsendi ja ebatavaliste värvide esiletõstmise vahendina. Kasuta seda toetava aktsendi, mitte staatusevärvina. - Void Black
#000000— Lehe lõuend, ülemise navigeerimise taust, sügavaim pinnakiht - Carbon
#121212— Papist pinnad, külgpaneelid, lõuendi peal olev teine pinnakiht - Graphite
#1f1f1f— Tõstetud pind – hõljumisseisundid, sisestusväljad, valitud navigeerimiselemendid. - Smoke
#292929— Aktiivne navigeerimise taust, kerge taustvalgustuse efekt.
Tüpograafia
11-st 24 pikslini · 4 sammu
- SpotifyMixUI — asendamine: Inter · kontuurid 400, 600, 700 · Põhitekst, navigeerimine, nupud, metaandmed, väikesed pealkirjad – kompaktne ja inforikas disain, mis on loodud olema peenelt kujundatud, lastes kunstilistel elementidel domineerida.
- SpotifyMixUITitle — asendamine: Inter weight 700 · kontuurid 700 · Jaotiste pealkirjad („Populaarsed laulud“, „Populaarsed artistid“) – paks, keskmise suurusega font tõstab pealkirjad esile ilma kaardiruudustikku üle koormamata.
Intervallid ja vorm
| Eesmärk | Tähendus |
|---|---|
| Tihedus | tihe |
| Põhisamm | 8-12px |
| Nupu raadius | 9999px |
| Kaardi raadius | 6px |
| Varjud | minimaalne |
| Sektsioonide vahel | 32-48px |
Tehisintellekt loob teie veebisaidi Spotify stiilis ja täidab selle
- Täida toodete ja postitustega lingi kaudu - Instagram, TikTok, Facebook.
- Kanna sisu oma vanalt saidilt üle – täpsusta lihtsalt aadress.
- Moodne disain parimal mootoril: React ( Next.js) koos serveri renderdamise ja SEO optimeerimisega koheselt.
- Täisautomaatne SEO optimeerimine otsingutulemuste ja närvivõrgu soovituste jaoks.
Sarnased stiilid
- Resend — must samet lilla neoonvärviga
- Neon — Serveriruum pärast pimeduse saabumist. Täielik pimedus, kus ainus valgus tuleb andmetest ja kasutajate interaktsioonidest.
- Discord — Mängumaailm on peidetud hüpikakna taha – iga osa on iseseisev keskkond oma valgustuse ja tegelaskujudega.
- Idle Finance — Süvamere terminalide neoonvalgustusega kauplemispõrand on tume mereväe terminal, kus üksainus sinine valgus läbistab hämarust.
- Midjourney — Bioluminestsentsterminal süvameres. Süvamere maailm, kus intelligents genereerib end visuaalselt ASCII-voogudena ja juhtnupud paistavad nõrgalt helendavate mustritena.
- Netflix — Lõpmatu digitaalne riiul. Kinoelamus, kus lõputu sisukogu esitletakse kottpimedal teatraalsel taustal.
- Wope — Wope on lilla horisondi liides. Kujutage ette tumedat vaatluslauda, mille klaasi alt paistab lillat valgust.
- basement — Tühi trükipress kell 3 öösel – tohutud, tihendatud fondid laiali pilluvad kottpimedas, navigeerimisribal on üksainus oranž valgusekuma, kõik muu valge või kummituslikult hall.
- Ori — Serveriruum on südaööl must tühjus, valge tuli, üks lüliti põleb.
- Amaterasu — Taevane türkiissinine pühamu
- Stink Studios — Filmistuudio keskööl - projektor sumiseb, tuba on pime, ainult film põleb
- Obsidian — Kristalliliste teadmiste hoidla. Selge ja mitmetahuline digitaalne ruum, mis on loodud selguse ja keskendumise saavutamiseks ning mida täidavad helendavad lillad interaktsiooniveenid.