Medium
kermanvalkoinen sanomalehti kultaisella hetkellä
Medium toimii kuin verkkoon siirretty kirjallisuuden lukusali: lämmin, kermanvärinen tausta (#f7f4ed) korvaa SaaS-palveluille tyypillisen steriilin valkoisen, jolloin pitkät tekstit tuntuvat painetulta sivulta. Visuaalinen järjestelmä on aggressiivisen yksivärinen – lähes kaikki käyttöliittymäpinnat, teksti ja reunat ovat kapealla lämpimän harmaan kaistalla välillä #242424–#6b6b6b – joten lukijan huomio keskittyy täysin sisältöön. Ainoa tunnusomainen ele on serif-otsikko (GT Super, 120 pikseliä, paksuus 400, kirjainväli -0,055em), joka on tarkoituksellinen trendin vastainen valinta: näyttäväksi skaalattu väliaikainen kirjaserif-fontti, tuskin havaittava, rohkean geometrisen sans-serif-fontin sijaan, viestii: "Julkaisemme kirjoja, emme ohjelmistoja." Painikkeet ovat täynnä lähes mustaa "pillereitä" – ainoaa kiinteää mustetta sivulla.
Etusivulla on kaksi saraketta: vasen puoli vie noin 55 % sivun tilasta, ja otsikko, alateksti ja toimintakehotus on järjestetty pystysuunnassa reilulla sisäisellä rivivälillä; oikea puoli vie noin 45 % sivun tilasta, ja siellä on kuvapaneeli. Vasen sarake on tasattu vasemmalle (ei keskitetty), mikä ankkuroi sivun lukuakseliin. Etusivun alapuolella sivu on yksi, täysleveä, kermanvärinen kaistale, jonka alatunnisteessa on keskitetyt linkit. Etusivulla ei ole korttiruudukkoja, ominaisuusosioita tai vuorottelevia raitoja – kotisivu ON sivu. Sisältötiheys on tarkoituksella alhainen: yksi otsikko, yksi lause, yksi painike, yksi kuva. Sivu on kansikuva, ei kojelauta.
Kuvitukset ovat toimituksellisia ja episodisia, eivät systemaattisia. Pääsivulla on yksi käsin piirretty kuva (vihreä kukka, geometrinen käsi, tähtikuvioviivat) löyhässä, hieman naiivissa tyylissä. Kuvitukset näyttävät pikemminkin tilaustyöltä, joka vaihtuu kausittain, kuin pysyvästä kirjastosta. Pääsivulla ei ole valokuvia. Pääsivulla ei ole kuvakkeita – kaiken työn tekevät tekstilogo ja teksti. Visuaalinen kieli on ensisijaisesti tekstipainotteinen, ja kuvitukset toimivat välimerkkeinä.
Paletti
Neutraali
- Newsprint Cream
#f7f4ed— Sivun pohja, pääikkunan tausta ja osioiden tausta ovat lämpimän, hieman kermanvärisiä, mikä luo vaikutelman painetusta käyttöliittymästä digitaalisen sijaan. - Paper White
#ffffff— Korttipinnat, kohopaneelit, lomakkeen syöttökentät ja kaikki pinnat, jotka on erotettava kermanvärisestä pohjasta. - Ink
#242424— Leipäteksti, leipäteksti, linkit, otsikot – hieman lämpimämpi kuin puhdas musta, näyttää hyvältä kermanvärisellä taustalla. - Body Gray
#333333— Toissijaista tekstiväriä ja oletusarvoista etualan väriä käytetään silloin, kun tarvitaan hieman musteen väriä vaaleampi väri menettämättä kontrastia. - Button Black
#191919— Neutraalia väriä tuetaan käyttöliittymän toissijaisissa elementeissä, jakajissa ja vaimennettuissa otsikoissa. Sitä ei tule käyttää toimintakehotuksen ensisijaisena värinä. - Marginalia Gray
#6b6b6b— Neutraalin värin tuki toissijaiselle käyttöliittymälle, jakajille ja vaimennetuille otsikoille.
Typografia
13:sta 120 pikseliin · 5 vaihetta
- medium-content-sans-serif-font — korvaava: Inter · ääriviivat 400 · medium-content-sans-serif-fontti - löytyy poimitusta datasta, mutta tekoäly ei ole kuvannut sitä.
- GT Super — korvaava: Playfair Display · ääriviivat 400 · Otsikot ja leipäteksti ovat siirtymäkauden serif-fonttia äärimmäisen skaalautuvassa, tiheällä kirjainvälistys ja 0,83 rivivälillä. 400-painoisen (ei lihavoidun) fontin valinta 120 pikselin koossa on tunnusomainen ominaisuus: kirjainmuodot, eivät paino, tekevät työn. Negatiivinen kirjainvälistys kaventaa optisia aukkoja, jolloin "Human Stories and Ideas" tuntuu yhtenäiseltä typografiselta lohkolta.
- Söhne — korvaava: Inter · ääriviivat 400 · Käyttöliittymän sans-serif-fonttia käytetään navigoinnissa, painikkeissa, alaotsikoissa ja pienissä otsikoissa. 13–14 pikselin kokoalue on tarkoitettu navigointiteksteille ja painikkeille; 20–22 pikselin kokoalue on tarkoitettu alaotsikoille ja otsikon sisällä olevalle toissijaiselle tekstille. Puhdas ja ihmismäisillä mittasuhteilla varustettu sans-serif on luettavissa pienissä kokoluokissa ja huomaamaton suuremmissa.
Intervallit ja muoto
| Tarkoitus | Merkitys |
|---|---|
| Tiheys | keskimäärin |
| Perusvaihe | 16-24px |
| Painikkeen säde | 9999px |
| Kortin säde | 0px |
| Varjot | ei - reunoja varjojen sijaan |
| Osioiden välillä | 64px |
| Sivun leveys | 1200px |
Tekoäly rakentaa verkkosivustosi Medium -tyyliin ja täyttää sen
- Täytä tuotteilla ja julkaisuilla linkin kautta - Instagram, TikTok, Facebook.
- Siirrä sisältöä vanhalta sivustoltasi – määritä vain osoite.
- Moderni design parhaalla hakukonemoottorilla: React ( Next.js) palvelinrenderöinnillä ja SEO-optimoinnilla suoraan paketista.
- Täysin automatisoitu hakukoneoptimointi hakutuloksille ja neuroverkkosuosituksille.
Samankaltaisia tyylejä
- Steep — Serif-fonttien analyysi lämpimällä paperilla
- Newformcap — Pääkirjoituslehti pukuhuoneessa
- Claude — Lämpimälle pergamentille painettu esine – mustetta luupaperilla, savea ainoana väripilkkuna
- 11x– Digital workers — Elokuvamainen toimituksellinen autiomaa – panoraamakuvia maisemasta monumentaalisten serif-otsikoiden taustana, jotka tuntuvat luksuslehden aukeamalta.
- Revolut — Yksivärinen toimituksellinen teos, joka perustuu pilvivalokuvaan – valkoista mustetta, rasian nappeja, yksi sininen väriraita muuten harmaasävyisessä maailmassa.
- Scheduling — Toimituksellinen muste kermanväriselle paperille
- Titan — lämpimän sävyinen yksivärinen arkisto
- Programa — Sveitsiläinen design-studio keskipäivällä. Valkoista galleriaseinää valaisee yksi keltainen pöytävalaisin – kaikki on harmaan sävyissä, kunnes jokin painike, kuvake tai koriste-esine kiinnittää huomion, ja sitten tuo yksi keltainen koriste-esine määrittelee koko huoneen.
- Sana Agents — Limen kimallus valkoisella taustalla toimituksellisessa
- Visual — Lämminhenkistä toimituksellista samizdatia. Kermanväristä paperia, serif-julisteita, yksivärisiä reunuksia, yksi keltainen tussi.
- Midday — Toimituksellinen esite vellumilla - 72 pikselin serif-otsikko lämpimällä kivitaustalla, sans-serif-teksti rivivälillä, pillerinmuotoiset säätimet, ei varjoja
- Chat for impact — Metsänvihreä klinikka pastellisävyisillä huoneilla