Duolingo
Masgot dosbarth chwareus ar bapur gwyn
Mae rhyngwyneb Duolingo wedi'i gynllunio fel llyfr lluniau plant: cynfas papur gwyn, ffont crwn, llawn sudd, ac un lliw gwyrdd cyfoethog sy'n dod â'r "ateb cywir" i'r amlwg ar unwaith. Mae'r prif destun yn arlliwiau llwyd canol tawelu, gan ganiatáu i'r gwyrdd a'i acen las wneud yr holl waith emosiynol—gwyrdd ar gyfer cynnydd a phenawdau, glas ar gyfer dolenni y gellir clicio arnynt a chamau gweithredu ychwanegol. Mae cydrannau wedi'u siapio fel pils neu gorneli crwn, trwchus gyda ffiniau du neu liw trwchus, gan wneud i bob botwm deimlo'n fwy fel sticer wedi'i lynu wrth y dudalen na rheolydd rhyngwyneb defnyddiwr gwastad.
Mae adrannau'n meddiannu lled llawn y dudalen ac wedi'u trefnu'n fertigol mewn un golofn, pob un tua 800 picsel o uchder. Y lled cynnwys mwyaf yw tua 1 picsel wedi'i ganoli. Mae testun ar y chwith a darluniau ar y dde yn amrywio, gan ddarparu digon o le fertigol (80 picsel rhwng adrannau). Nid oes unrhyw gardiau grid na chynlluniau aml-golofn—mae pob adran yn floc testun sengl wedi'i baru ag un darlun. Mae llywio yn far uchaf minimalist gyda logo a dewiswr iaith, sy'n ymddangos fel bar sefydlog rhwng adrannau. Mae'r troedyn yn streipen werdd sy'n rhychwantu lled cyfan y dudalen. Mae'r rhythm yn olygyddol: pennawd, paragraff, galwad i weithredu, darlun, ailadrodd.
Mae iaith ddarluniadol y llyfr yn cynnwys cymeriadau masgot gwastad, dau ddimensiwn (Duet y dylluan ac amryw o ffigurau dynol) gyda siapiau geometrig crwn, amlinelliadau du beiddgar, a phalet lliw cyflenwol o binc, porffor, melyn, oren a glas nad yw byth yn ymddangos yn y rhyngwyneb ei hun. Mae'r darluniau wedi'u lleoli wrth ymyl y testun ar ochr dde pob adran, yn erbyn cefndir gwyn pur, heb gynwysyddion na chefndiroedd. Nid oes unrhyw ffotograffau—mae'r cymeriadau'n gwasanaethu fel y cynnwys gweledol. Mae'r eiconograffeg yn defnyddio amlinelliadau trwchus, yn gyson ag arddull y masgotiaid. Mae dwysedd y ddelwedd yn gymedrol: mae pob adran yn cynnwys un darlun mawr o'r cymeriad, gyda gweddill y dudalen wedi'i neilltuo i deipograffeg a gofod gwyn.
Palet
Brand
- Eager Green
#58cc02— Defnyddir gwyrdd i amlygu dolenni, tagiau ac ymadroddion byr. Ni ddylid ei ddefnyddio fel y prif liw ar gyfer galwadau i weithredu. - Storybook Green
#d7ffb8— Uchafbwyntiau meddal ar arwynebau golau, tonau cefndir cynnil y tu ôl i'r labeli llywio yn y droedyn.
Niwtral
- Spark Blue
#1cb0f6— Defnyddir glas i amlygu dolenni, tagiau ac ymadroddion byr. Ni ddylid ei ddefnyddio fel y prif liw ar gyfer galwadau i weithredu. - Fresh Leaf
#a5ed6e— Defnyddir gwyrdd i amlygu dolenni, tagiau ac ymadroddion byr. Ni ddylid ei ddefnyddio fel y prif liw ar gyfer galwadau i weithredu. - Night Ink
#000437— Mae dolenni, tagiau ac ymadroddion byr wedi'u hamlygu wedi'u hamlygu mewn porffor. - Paper White
#ffffff— Cynfas tudalen, arwynebau cardbord, testun botwm ar gefndir gwyrdd/tywyll. - Charcoal
#4b4b4b— Penawdau Arwrol a Thestun Corff - Testun tywyll cyffredinol sy'n caniatáu i benawdau lliw sefyll allan. - Pencil Gray
#777777— Mae prif baragraffau'r testun wedi'u hamlygu â llythrennau anamlwg, ac mae testun disgrifiadol eilaidd yn cilio i'r cefndir, fel bod yr elfennau lliw yn dod i'r amlwg.
Teipograffeg
o 13 i 64px · 7 cam
- feather — amnewid: Inter · amlinelliadau 700 · Mae penawdau adrannau, fel "Am Ddim. Hwyl. Effeithiol" a "Phrawf Saesneg Duolingo," yn cael eu harddangos gan ddefnyddio ffont crwn wedi'i deilwra, gan roi arddull chwareus, gyfeillgar, tebyg i fasgot i'r brand. Amnewidiwch gyda "Feather Bold" neu "Nunito Black" yn y pwysau priodol. Bylchau llythrennau: -0.0200em
- duolingo-sans — amnewid: Inter · amlinelliadau 500 · Prif baragraffau a dolenni llywio ar 17px/500—ffont sans-serif geometrig sy'n parhau i fod yn ddarllenadwy, gan ganiatáu i'r pwysau llinell 700 amlygu pwyntiau pwysig. Amnewid gyda 'DIN Next', 'Inter', neu 'Nunito Sans'.
- duolingo-sans — amnewid: Inter · amlinelliadau 700 · Defnyddir pob gwerth pwysau-700: mae priflythrennau mewn labeli llywio yn 15px (ls 0.0530em), mae is-benawdau yn 19px a 32px, a phwyslais y ddolen yw 13px. Yr un ffont â'r prif destun—y gwahaniaeth gweledol yw'r pwysau, nid y newid ffont. Bylchau rhwng llythrennau: 0.0530em ar gyfer priflythrennau mewn labeli llywio.
Cyfnodau a ffurf
| Diben | Ystyr |
|---|---|
| Dwysedd | dwys |
| Cam sylfaenol | 12px |
| Radiws botwm | 12px |
| Radiws y cerdyn | 12px |
| Cysgodion | dim ffiniau yn lle cysgodion |
| Rhwng adrannau | 80-120px |
| Lled y dudalen | 1200px |
Bydd AI yn adeiladu eich gwefan yn null Duolingo ac yn ei llenwi
- Llenwch gyda chynhyrchion a phostiadau trwy'r ddolen - Instagram, TikTok, Facebook.
- Trosglwyddo cynnwys o'ch hen wefan—nodwch y cyfeiriad yn unig.
- Dyluniad modern ar yr injan orau: React ( Next.js) gyda rendro gweinydd ac optimeiddio SEO yn syth ar y bocs.
- Optimeiddio SEO cwbl awtomataidd ar gyfer canlyniadau chwilio ac argymhellion rhwydwaith niwral.
Arddulliau tebyg
- Family — Lledaeniad o stori dylwyth teg ar femrwn hufen
- Say Briefly — Llyfr braslunio asiantaeth greadigol ar bapur hufen
- Flying Papers — Cartŵn Cyffes ar Fore Sadwrn
- Portrait — Wal o atgofion, wedi'u dal mewn Polaroidau ar bapur lliw hufen. Llyfr sgrap lliw hufen llachar lle mae inc glas tywyll yn gwasanaethu fel yr unig destun, yr unig linellau strwythur, a'r unig liw ffrâm—gydag un enfys wedi'i llunio â llaw sy'n ymddangos unwaith, ar y botwm "Cofrestru" ac ar y gair italig "am byth," a byth eto.
- Karl — Diorama arddull llyfr naidlen 3D ar ddiwrnod heulog
- Navigate — Set fawr o sticeri ynghlwm wrth fwrdd: ffont grotesg mawr, pob un ar ffurf tabledi a phum eicon aml-liw, yn ailadrodd fel logo
- Monte — Bore ar yr arfordir gyda lliw rhydlyd
- MotherDuck — Terfynell wedi'i chodio â phensiliau lliw ar bapur hufen
- Wise Design — Stondin farchnad neon ar stryd fyd-eang—arwydd gwyrdd llachar yn sgrechian drwy'r farchnad orlawn, tra y tu ôl iddo, mae rhyngwyneb defnyddiwr cynnyrch caboledig yn ymddangos yn ddisylw.
- Hatch — Dyluniad wedi'i dynnu â llaw, arddull samizdat, wedi'i gymysgu â bowlenni losin pastel. Cynfas papur hufennog wedi'i addurno ag acenion mintys, dotiau confetti, a galwadau i weithredu siâp pilsen, lle mae ffont serif mawr, beiddgar yn awgrymu hwyl, a masgot glas yn wincio yn y gornel.
- Superr — Llyfr nodiadau ysgol gynnes yng ngolau meddal y prynhawn. Tudalen lliw hufen, marciwr oren heb gap, a phentwr o sticeri enw wedi'u lamineiddio yn aros i gael eu plicio i ffwrdd.
- Mews — Canolfan reoli lletygarwch gyda'r wawr, wedi'i gorchuddio â phinc. Gweithle heulog â waliau gwyn lle mae teip du beiddgar, cardiau hufen cynnes, ac un botwm gweithredu pinc poeth yn diffinio pob sgrin—hyder chwareus yn hytrach na chyfyngiad corfforaethol.