Duolingo
Mascotte di classe scherzosa nantu à carta bianca
L'interfaccia di Duolingo hè cuncipita cum'è un libru illustratu per i zitelli: una tela di carta bianca, un carattere pienu è arrotondatu, è un unicu culore verde riccu chì evoca immediatamente a "risposta curretta". U testu principale hè un tonu grisgiu mediu rilassante, chì permette à u verde è à u so accentu turchinu di fà tuttu u travagliu emotivu - verde per u prugressu è i tituli, turchinu per i ligami cliccabili è l'azzioni supplementari. I cumpunenti anu a forma di pillule o anguli grossi è arrotondati cù bordi neri o culurati spessi, chì facenu chì ogni buttone si senti più cum'è un sticker attaccatu à a pagina chè un cuntrollu di l'interfaccia utente pianu.
E sezzioni occupanu tutta a larghezza di a pagina è sò disposte verticalmente in una sola colonna, ognuna alta circa 800 pixel. A larghezza massima di u cuntenutu hè di circa 1 pixel centratu. U testu à manca è l'illustrazioni à diritta si alternanu, furnendu un ampiu spaziu verticale (80 pixel trà e sezzioni). Ùn ci sò micca carte di griglia o layout multi-colonna - ogni sezzione hè un unicu bloccu di testu assuciatu à una sola illustrazione. A navigazione hè una barra superiore minimalista cù un logò è un selettore di lingua, chì appare cum'è una barra fissa trà e sezzioni. U piè di pagina hè una striscia verde chì attraversa tutta a larghezza di a pagina. U ritmu hè editoriale: titulu, paràgrafu, chjama à l'azzione, illustrazione, ripetizione.
U linguaghju illustrativu di u libru presenta persunagi mascotte piatti è bidimensionali (Duet u civettu è diverse figure umane) cù forme geometriche arrotondate, contorni neri audaci è una paleta di culori cumplementaria di rosa, viola, giallu, aranciu è turchinu chì ùn appare mai in l'interfaccia stessa. L'illustrazioni sò pusizionate accantu à u testu à a diritta di ogni sezione, contr'à un sfondate biancu puru, senza cuntenitori o sfondi. Ùn ci sò micca fotografie - i persunagi servenu cum'è cuntenutu visuale. L'iconografia usa contorni spessi, coerenti cù u stile di e mascotte. A densità di l'imagine hè muderata: ogni sezione presenta una grande illustrazione di u persunagiu, cù u restu di a pagina dedicata à a tipografia è à u spaziu biancu.
Paletta
Marca
- Eager Green
#58cc02— U verde hè adupratu per mette in risaltu i ligami, i tag è e frasi corte. Ùn deve esse adupratu cum'è culore primariu per e chjame à l'azzione. - Storybook Green
#d7ffb8— Punti culminanti morbidi nantu à superfici chjare, toni di fondu suttili daretu à l'etichette di navigazione in u piè di pagina.
Neutru
- Spark Blue
#1cb0f6— U turchinu hè adupratu per mette in risaltu i ligami, i tag è e frasi corte. Ùn deve esse adupratu cum'è culore primariu per e chjame à l'azzione. - Fresh Leaf
#a5ed6e— U verde hè adupratu per mette in risaltu i ligami, i tag è e frasi corte. Ùn deve esse adupratu cum'è culore primariu per e chjame à l'azzione. - Night Ink
#000437— I ligami, i tag è e frasi brevi evidenziate sò evidenziati in viola. - Paper White
#ffffff— Tela di pagina, superfici di cartone, testu di buttone nantu à fondu verde/scuru. - Charcoal
#4b4b4b— Intestazioni è testu di u corpu di l'eroi - Testu scuru universale chì permette à i tituli culuriti di spiccà. - Pencil Gray
#777777— I paragrafi principali di u testu sò evidenziati cù lettere pocu appariscenti, è u testu descrittivu secundariu si ritira in u fondu, in modu chì l'elementi culuriti venenu in primu pianu.
Tipografia
da 13 à 64px · 7 passi
- feather — rimpiazzamentu: Inter · contorni 700 · I tituli di sezzione, cum'è "Gratuitu. Divertente. Efficace" è "Duolingo English Test", sò visualizati cù un carattere arrotondatu persunalizatu, dendu à a marca u so stile scherzosu, amichevule è simile à una mascotte. Rimpiazzateli cù "Feather Bold" o "Nunito Black" cù u pesu adattatu. Spaziatura trà e lettere: -0.0200em
- duolingo-sans — rimpiazzamentu: Inter · contorni 500 · Paragrafi principali è ligami di navigazione à 17px/500—una fonte sans-serif geometrica chì ferma leggibile, chì permette à u spessore di linea di 700 di mette in risaltu i punti impurtanti. Rimpiazzate cù "DIN Next", "Inter", o "Nunito Sans".
- duolingo-sans — rimpiazzamentu: Inter · contorni 700 · Tutti i valori di pesu 700 sò usati: e lettere maiuscule in l'etichette di navigazione sò 15px (ls 0.0530em), i sottotitoli sò 19px è 32px, è l'enfasi di u ligame hè 13px. U listessu carattere cum'è u testu principale - a differenza visuale hè in u pesu, micca in u cambiamentu di carattere. Spaziatura di e lettere: 0.0530em per e lettere maiuscule in l'etichette di navigazione.
Intervalli è forma
| Scopu | Significatu |
|---|---|
| Densità | densu |
| Passu basicu | 12px |
| Raggiu di u buttone | 12px |
| Raggiu di a carta | 12px |
| Ombre | nò - bordi invece di ombre |
| Trà e sezioni | 80-120px |
| Larghezza di a pagina | 1200px |
L'IA custruisce u vostru situ web in stile Duolingo è u riempirà
- Riempite cù prudutti è publicazioni via u ligame - Instagram, TikTok, Facebook.
- Trasferisce u cuntenutu da u vostru vechju situ - basta à specificà l'indirizzu.
- Design mudernu nant'à u megliu mutore: React ( Next.js) cù rendering di u servitore è ottimizazione SEO pronta per l'usu.
- Ottimizazione SEO cumpletamente automatizata per i risultati di ricerca è e raccomandazioni di rete neurale.
Stili simili
- Family — Una stesura da una fiaba nantu à pergamena crema
- Say Briefly — Quadernu di schizzi di l'agenzia creativa nantu à carta crema
- Flying Papers — Cunfessione in un cartone animatu di sabbatu mattina
- Portrait — Un muru di ricordi, catturati in Polaroids nantu à carta crema. Un scrapbook luminosu è crema induve l'inchiostru turchinu scuru serve cum'è unicu testu, l'uniche linee di struttura è l'unicu culore di cornice - cù un unicu arcu di celu disegnatu à manu chì appare una volta, nantu à u buttone "Registrazione" è nantu à a parola in corsivu "per sempre", è mai più.
- Karl — Un diorama in stile libru pop-up 3D in una ghjurnata assulanata
- Navigate — Un grande inseme di adesivi attaccati à una tavola: grande carattere grottesco, tuttu in forma di tablette è cinque icone multicolori, chì si ripetenu cum'è un logò
- Monte — Mattina nantu à a costa cù una tinta arrugginita
- MotherDuck — Terminale codificatu cù matite culurite nantu à carta crema
- Wise Design — Una bancarella di mercatu neon in una strada glubale - un segnu verde brillanti chì grida in u mercatu affollatu, mentre daretu à ellu, una interfaccia utente di produttu pulita appare discretamente.
- Hatch — Un disignu disegnatu à manu, in stile samizdat, mischiatu cù ciotole di caramelle pastello. Una tela di carta cremosa adurnata cù accenti di menta, punti di confetti è chjama à l'azzione in forma di pillola, induve un grande carattere serif audace accenna à u divertimentu, è una mascotte blu face l'ochju in l'angulu.
- Superr — Un quaderno di scola caldu in a dolce luce di u dopumeziornu. Una pagina di culore crema, un marcatore aranciu senza cappucciu, è una pila di adesivi laminati cù u nome chì aspettanu d'esse staccati.
- Mews — Un centru di cuntrollu di l'ospitalità à l'alba, impregnatu di rosa. Un spaziu di travagliu cù muri bianchi è illuminatu da u sole, induve caratteri neri audaci, carte crema calde è un unicu buttone d'azione rosa acceso definiscenu ogni schermu - una fiducia scherzosa piuttostu chè una moderazione corporativa.