Duolingo
په سپین کاغذ باندې د لوبو وړ ټولګي ماسکوټ
د ډوولینګو انٹرفیس د ماشومانو د انځور کتاب په څیر ډیزاین شوی: د سپین کاغذ کینوس، غټ، ګرد فونټ، او یو واحد، بډایه شنه رنګ چې سمدلاسه "سم ځواب" راپاروي. اصلي متن یو آرامه منځنی خړ رنګ دی، چې شنه او د هغې تلفظ نیلي ته اجازه ورکوي چې ټول احساساتي کار وکړي — شنه د پرمختګ او سرلیکونو لپاره، نیلي د کلیک کولو وړ لینکونو او اضافي کړنو لپاره. اجزا د ګولیو یا غټو، ګردو کونجونو په څیر شکل لري چې د تور تور یا رنګه سرحدونو سره دي، چې هر تڼۍ د فلیټ UI کنټرول په پرتله د پاڼې سره تړل شوي سټیکر په څیر احساس کوي.
برخې د پاڼې بشپړ پلنوالی نیسي او په عمودي ډول په یوه واحد ستون کې تنظیم شوي، هر یو یې نږدې 800 پکسل لوړ دی. د منځپانګې اعظمي پلنوالی تقریبا 1 پکسل په مرکز کې دی. په چپ اړخ کې متن او په ښي اړخ کې انځورونه بدیل، پراخه عمودی ځای چمتو کوي (د برخو ترمنځ 80 پکسلونه). هیڅ گرډ کارتونه یا څو کالم ترتیبونه شتون نلري — هره برخه یو واحد متن بلاک دی چې د یو واحد انځور سره جوړه شوې ده. نیویګیشن د لوګو او ژبې انتخاب کونکي سره یو لږترلږه پورتنۍ بار دی، کوم چې د برخو ترمنځ د ثابت بار په توګه ښکاري. فوټر یو شنه پټه ده چې د پاڼې ټوله پلنوالی پوښي. تال اداری دی: سرلیک، پراګراف، د عمل غوښتنه، انځور، تکرار.
د کتاب د انځورګرۍ ژبه فلیټ، دوه اړخیزه ماسکوټ کرکټرونه (ډویټ الو او مختلف انساني شخصیتونه) لري چې ګرد جیومیټریک شکلونه، غټ تور خاکې، او د ګلابي، ارغواني، ژیړ، نارنجي او نیلي بشپړونکي رنګ پیلټ لري چې هیڅکله په انٹرفیس کې نه ښکاري. انځورونه د هرې برخې په ښي خوا کې د متن تر څنګ موقعیت لري، د خالص سپین شالید په وړاندې، پرته له کانټینرونو یا شالیدونو. هیڅ عکسونه نشته - کرکټرونه د بصري مینځپانګې په توګه کار کوي. عکس العمل د ماسکوټ سټایل سره سم، موټي خاکې کاروي. د انځور کثافت معتدل دی: هره برخه د کرکټر یو لوی انځور وړاندې کوي، د پاڼې پاتې برخه ټایپوګرافي او سپین ځای ته وقف شوې ده.
پالټ
برانډ
- Eager Green
#58cc02— شنه رنګ د لینکونو، ټګونو او لنډو جملو د روښانه کولو لپاره کارول کیږي. دا باید د عمل کولو لپاره د لومړني رنګ په توګه ونه کارول شي. - Storybook Green
#d7ffb8— په روښانه سطحو کې نرمې نښې، په فوټر کې د نیویګیشن لیبلونو شاته د شالید نازک رنګونه.
بې طرفه
- Spark Blue
#1cb0f6— نیلي رنګ د لینکونو، ټګونو او لنډو جملو د روښانه کولو لپاره کارول کیږي. دا باید د عمل کولو لپاره د لومړني رنګ په توګه ونه کارول شي. - Fresh Leaf
#a5ed6e— شنه رنګ د لینکونو، ټګونو او لنډو جملو د روښانه کولو لپاره کارول کیږي. دا باید د عمل کولو لپاره د لومړني رنګ په توګه ونه کارول شي. - Night Ink
#000437— لینکونه، ټګونه، او لنډ روښانه شوي جملې په ارغواني رنګ کې روښانه شوي دي. - Paper White
#ffffff— د پاڼې کینوس، د کارت بورډ سطحې، په شنه/تور پس منظر کې د تڼۍ متن. - Charcoal
#4b4b4b— د اتلانو سرلیکونه او د بدن متن - نړیوال تیاره متن چې رنګین سرلیکونه د څرګندیدو اجازه ورکوي. - Pencil Gray
#777777— د متن اصلي پراګرافونه د ناڅرګندو لیکونو سره روښانه شوي، او ثانوي تشریحي متن شالید ته ځي، ترڅو رنګین عناصر مخې ته راشي.
ټایپوګرافي
له ۱۳ څخه تر ۶۴ پکسله پورې · ۷ ګامونه
- feather — بدیل: Inter · بڼې 700 · د برخې سرلیکونه، لکه "وړیا. تفریح. اغیزمن" او "ډوولینګو انګلیسي ازموینه"، د دودیز ګرد فونټ په کارولو سره ښودل کیږي، چې برانډ ته د هغې د لوبو، دوستانه، ماسکوټ په څیر سټایل ورکوي. په مناسب وزن کې د "فیدر بولډ" یا "نونیتو تور" سره ځای په ځای کړئ. د لیکونو فاصله: -0.0200em
- duolingo-sans — بدیل: Inter · بڼې 500 · اصلي پراګرافونه او نیویګیشن لینکونه په ۱۷ پکسل/۵۰۰ کې—یو جیومیټریک سنز سیریف فونټ چې د لوستلو وړ پاتې کیږي، د ۷۰۰ کرښې وزن ته اجازه ورکوي چې مهم ټکي روښانه کړي. د 'DIN Next'، 'Inter'، یا 'Nunito Sans' سره بدل کړئ.
- duolingo-sans — بدیل: Inter · بڼې 700 · ټول وزن-۷۰۰ ارزښتونه کارول کیږي: په نیویګیشن لیبلونو کې لوی توري ۱۵px (ls 0.0530em) دي، فرعي سرلیکونه ۱۹px او ۳۲px دي، او د لینک ټینګار ۱۳px دی. د اصلي متن په څیر ورته فونټ - بصري توپیر په وزن کې دی، نه د فونټ بدلون. د لیکونو فاصله: په نیویګیشن لیبلونو کې د لویو تورو لپاره ۰.۰۵۳۰em.
وقفې او بڼه
| موخه | معنی |
|---|---|
| کثافت | ګڼ |
| اساسي ګام | 12px |
| د تڼۍ وړانګې | 12px |
| د کارت وړانګې | 12px |
| سیوري | د سیوري پر ځای هیڅ سرحد نشته |
| د برخو ترمنځ | 80-120px |
| د پاڼې پلنوالی | 1200px |
AI به ستاسو ویب پاڼه په Duolingo سټایل کې جوړه کړي او ډکه یې کړي
- د لینک له لارې محصولات او پوسټونه ډک کړئ - Instagram ، TikTok ، Facebook.
- له خپل زوړ سایټ څخه مواد انتقال کړئ — یوازې پته مشخص کړئ.
- په غوره انجن کې عصري ډیزاین: د سرور رینډرینګ او SEO اصلاح کولو سره React ( Next.js).
- د لټون پایلو او عصبي شبکې سپارښتنو لپاره په بشپړ ډول اتوماتیک SEO اصلاح کول.
ورته سټایلونه
- Family — د کریمي چرم په اړه د یوې افسانې څخه خپره شوې کیسه
- Say Briefly — د کریم کاغذ په اړه د تخلیقي ادارې سکیچ بوک
- Flying Papers — د شنبې د سهار په کارتون کې اعتراف
- Portrait — د یادونو یو دیوال، چې په پولارایډونو کې په کریم رنګ کاغذ کې نیول شوی. یو روښانه، کریم رنګ سکریپ بوک چیرې چې تیاره نیلي رنګ د یوازینۍ متن، یوازینۍ جوړښتي کرښې، او یوازینۍ چوکاټ رنګ په توګه کار کوي - د یو واحد لاسي رسم شوي رینبو سره چې یو ځل څرګندیږي، د "راجستر" تڼۍ او په ایټالیک شوي کلمه "تل لپاره" کې، او هیڅکله بیا نه.
- Karl — په لمرینه ورځ کې د درې بعدي پاپ اپ کتاب سټایل ډایوراما
- Navigate — د سټیکرونو یوه لویه ټولګه چې په تخته پورې نښلول شوې ده: لوی عجیب فونټ، ټول د ټابلیټونو او پنځو څو رنګه عکسونو په بڼه، د لوګو په څیر تکرار کیږي.
- Monte — سهار په ساحل کې د زنګ وهلي رنګ سره
- MotherDuck — ټرمینل د کریم کاغذ باندې د رنګین پنسلونو سره کوډ شوی
- Wise Design — په یوه نړیوال سړک کې د نیون مارکیټ یوه هټۍ - یو روښانه شنه نښه چې د ګڼې ګوڼې په بازار کې چیغې وهي، پداسې حال کې چې د هغې تر شا، د پالش شوي محصول کارونکي انٹرفیس په پټه توګه ښکاري.
- Hatch — د لاس جوړ شوی، د سمیزدات سټایل ډیزاین چې د پیسټل کینډي کڅوړو سره مخلوط شوی. د کریمي کاغذ کینوس چې د نعناع تلفظونو، کنفټي نقطو، او د ګولۍ په شکل د عمل غږونو سره سینګار شوی، چیرې چې یو لوی، زړور سیریف فونټ ساتیري ته اشاره کوي، او یو نیلي ماسکوټ په کونج کې سترګې پټوي.
- Superr — د ماسپښین په نرمه رڼا کې د ښوونځي ګرم کتابچه. یو کریم رنګه پاڼه، یو نارنجي مارکر چې خولۍ نلري، او د لامینټ شوي نوم سټیکرونو یوه ډله چې د خلاصیدو په تمه ده.
- Mews — د سهار په وخت کې د میلمه پالنې کنټرول مرکز، په ګلابي رنګ کې ډوب شوی. یو سپین دیوال لرونکی، لمر وړانګې لرونکی کاري ځای چیرې چې تور رنګ، ګرم کریم کارتونه، او یو واحد ګرم ګلابي عمل تڼۍ هر سکرین تعریفوي - د کارپوریټ محدودیت پرځای یو لوبوونکی باور.