Duolingo
Rotaļīgs klases talismans uz balta papīra
Duolingo saskarne ir veidota kā bērnu bilžu grāmata: balts papīra audekls, apaļš, noapaļots fonts un viena, piesātināta zaļa krāsa, kas nekavējoties atgādina “pareizo atbildi”. Galvenais teksts ir nomierinošos vidēji pelēkos toņos, ļaujot zaļajai krāsai un tās akcenta zilajai krāsai veikt visu emocionālo darbu — zaļa krāsa attēlo progresu un virsrakstus, zila — klikšķināmas saites un papildu darbības. Komponenti ir veidoti kā tabletes vai lieli, noapaļoti stūri ar biezām melnām vai krāsainām apmalēm, padarot katru pogu vairāk līdzīgu uzlīmei, kas pielīmēta pie lapas, nevis plakanai lietotāja interfeisa vadīklai.
Sadaļas aizņem visu lapas platumu un ir vertikāli izvietotas vienā kolonnā, katra aptuveni 800 pikseļu augstumā. Maksimālais satura platums ir aptuveni 1 pikselis centrēts. Teksts kreisajā pusē un ilustrācijas labajā pusē mijas, nodrošinot pietiekami daudz vertikālas vietas (80 pikseļi starp sadaļām). Nav režģa karšu vai vairāku kolonnu izkārtojumu — katra sadaļa ir viens teksta bloks, kas savienots pārī ar vienu ilustrāciju. Navigācija ir minimālistiska augšējā josla ar logotipu un valodas atlasītāju, kas tiek rādīta kā fiksēta josla starp sadaļām. Kājene ir zaļa josla, kas aptver visu lapas platumu. Ritms ir redakcionāls: virsraksts, rindkopa, aicinājums uz darbību, ilustrācija, atkārtojums.
Grāmatas ilustratīvajā valodā ir attēloti plakani, divdimensiju talismanu tēli (pūce Duet un dažādas cilvēku figūras) ar noapaļotām ģeometriskām formām, treknām melnām kontūrām un papildinošu krāsu paleti — rozā, violetu, dzeltenu, oranžu un zilu, kas nekad neparādās pašā saskarnē. Ilustrācijas ir novietotas blakus tekstam katras sadaļas labajā pusē uz tīri balta fona, bez konteineriem vai foniem. Nav fotogrāfiju — tēli kalpo kā vizuālais saturs. Ikonogrāfijā izmantotas biezas kontūras, kas atbilst talismanu stilam. Attēlu blīvums ir mērens: katrā sadaļā ir viena liela tēla ilustrācija, bet pārējā lapa ir veltīta tipogrāfijai un baltajai atstarpei.
Palete
Zīmols
- Eager Green
#58cc02— Zaļā krāsa tiek izmantota, lai izceltu saites, tagus un īsas frāzes. To nevajadzētu izmantot kā galveno krāsu aicinājumiem uz darbību. - Storybook Green
#d7ffb8— Maigi izcēlumi uz gaišām virsmām, smalki fona toņi aiz navigācijas etiķetēm kājenē.
Neitrāls
- Spark Blue
#1cb0f6— Zilā krāsa tiek izmantota, lai izceltu saites, tagus un īsas frāzes. To nevajadzētu izmantot kā galveno krāsu aicinājumiem uz darbību. - Fresh Leaf
#a5ed6e— Zaļā krāsa tiek izmantota, lai izceltu saites, tagus un īsas frāzes. To nevajadzētu izmantot kā galveno krāsu aicinājumiem uz darbību. - Night Ink
#000437— Saites, tagi un īsas izceltās frāzes ir iezīmētas violetā krāsā. - Paper White
#ffffff— Lapas audekls, kartona virsmas, pogas teksts uz zaļa/tumša fona. - Charcoal
#4b4b4b— Galvenes un pamatteksts — universāls tumšs teksts, kas ļauj izcelt krāsainus virsrakstus. - Pencil Gray
#777777— Galvenās teksta rindkopas ir izceltas ar neuzkrītošiem burtiem, un sekundārais aprakstošais teksts atkāpjas fonā, lai krāsainie elementi nonāktu priekšplānā.
Tipogrāfija
no 13 līdz 64 pikseļiem · 7 soļi
- feather — nomaiņa: Inter · kontūras 700 · Sadaļu virsraksti, piemēram, "Bezmaksas. Izklaides. Efektīvi" un "Duolingo angļu valodas tests", tiek attēloti, izmantojot pielāgotu noapaļotu fontu, piešķirot zīmolam rotaļīgu, draudzīgu, talismanam līdzīgu stilu. Aizstājiet ar "Feather Bold" vai "Nunito Black" atbilstošā biezumā. Burtu atstarpe: -0,0200 em
- duolingo-sans — nomaiņa: Inter · kontūras 500 · Galvenās rindkopas un navigācijas saites ar izmēru 17px/500 — ģeometrisks bezserifs fonts, kas paliek salasāms, ļaujot 700 rindas biezumam izcelt svarīgus punktus. Aizstājiet ar “DIN Next”, “Inter” vai “Nunito Sans”.
- duolingo-sans — nomaiņa: Inter · kontūras 700 · Tiek izmantotas visas svara 700 vērtības: lielie burti navigācijas etiķetēs ir 15 pikseļi (ls 0,0530 em), apakšvirsraksti ir 19 pikseļi un 32 pikseļi, un saišu uzsvars ir 13 pikseļi. Tas pats fonts kā galvenajam tekstam — vizuālā atšķirība ir svarā, nevis fonta izmaiņās. Burtu atstarpe: 0,0530 em lielajiem burtiem navigācijas etiķetēs.
Intervāli un forma
| Mērķis | Nozīme |
|---|---|
| Blīvums | blīvs |
| Pamata solis | 12px |
| Pogas rādiuss | 12px |
| Kartes rādiuss | 12px |
| Ēnas | nē — robežas ēnu vietā |
| Starp sekcijām | 80-120px |
| Lapas platums | 1200px |
Mākslīgais intelekts izveidos jūsu vietni Duolingo stilā un aizpildīs to
- Aizpildiet ar produktiem un ierakstiem, izmantojot saiti — Instagram, TikTok, Facebook.
- Pārsūtiet saturu no savas vecās vietnes — vienkārši norādiet adresi.
- Moderns dizains uz labākā dzinēja: React ( Next.js) ar servera renderēšanu un SEO optimizāciju uzreiz pēc instalēšanas.
- Pilnībā automatizēta SEO optimizācija meklēšanas rezultātiem un neironu tīkla ieteikumiem.
Līdzīgi stili
- Family — Pasakas izkārtojums uz krēmkrāsas pergamenta
- Say Briefly — Radošās aģentūras skicēšanas burtnīca uz krēmkrāsas papīra
- Flying Papers — Atzīšanās sestdienas rīta multfilmā
- Portrait — Atmiņu siena, iemūžināta Polaroid fotogrāfijās uz krēmkrāsas papīra. Spilgts, krēmkrāsas albums, kurā tumši zila tinte kalpo kā vienīgais teksts, vienīgās struktūras līnijas un vienīgā rāmja krāsa — ar vienu ar roku zīmētu varavīksni, kas parādās vienreiz, uz pogas "Reģistrēties" un uz slīprakstā rakstītā vārda "uz visiem laikiem" un nekad vairs.
- Karl — 3D uznirstošās grāmatas stila diorāma saulainā dienā
- Navigate — Liels uzlīmju komplekts, kas piestiprināts pie tāfeles: liels grotesks fonts, viss planšetdatoru formā un piecas daudzkrāsainas ikonas, kas atkārtojas kā logotips
- Monte — Rīts piekrastē ar rūsganu nokrāsu
- MotherDuck — Terminālis kodēts ar krāsainiem zīmuļiem uz krēmkrāsas papīra
- Wise Design — Neona tirgus stends uz globālas ielas — spilgti zaļa zīme, kas kliedz cauri pārpildītajam tirgum, kamēr aiz tās diskrēti parādās pulēta produkta lietotāja saskarne.
- Hatch — Ar roku zīmēts, samizdata stila dizains, kas apvienots ar pasteļtoņu konfekšu bļodiņām. Krēmkrāsas papīra audekls, kas rotāts ar piparmētru akcentiem, konfeti punktiņiem un tablešu formas aicinājumiem uz darbību, kur liels, trekns serif fonts norāda uz jautrību, un stūrī mirkšķina zils talismans.
- Superr — Silta skolas klade maigā pēcpusdienas gaismā. Krēmkrāsas lapa, oranžs marķieris bez vāciņa un kaudzīte laminētu vārdu uzlīmju, kas gaida, kad tās tiks noņemtas.
- Mews — Viesmīlības vadības centrs rītausmā, pieliets rozā krāsā. Baltas sienas, saules apspīdēta darba vieta, kur katru ekrānu raksturo koši melni burti, silti krēmkrāsas kartītes un viena spilgti rozā darbību poga — rotaļīga pārliecība, nevis korporatīva atturība.