Auros
ဇီဝအလင်းပြန်ဒေတာဘောလုံးများပါရှိသော အနိစ္စဒေသ
Auros သည် fintech terminal အဖြစ် လုပ်ဆောင်သည်- bioluminescent data orbs များနှင့် turquoise မှ ပန်းရောင်အထိ အလင်း gradient များပါရှိသော အနက်ရောင်နီးပါး turquoise canvas တစ်ခုဖြစ်ပြီး အနက်၊ စီးဆင်းမှုနှင့် အနက်ကို ဖန်တီးပေးသည်။ interface သည် minimalist နှင့် cinematic ဖြစ်ပြီး အလွန်အကျွံတောက်ပခြင်းမရှိဘဲ scale ကိုဖန်တီးရန် ရန်လိုသော negative tracking ပါရှိသော အလယ်အလတ်အထူရှိသော single user display (Matter) ကို အားကိုးသည်။ အရောင်များကို ညီညာစွာဖြန့်ဝေထားသည်- achromatic အဖြူနှင့် ငွေရောင်များကို content အားလုံးနီးပါးအတွက် အသုံးပြုထားပြီး chromatic palette ကို atmospheric gradient များ၊ ကတ်မျက်နှာပြင်များကို ခွဲခြားခြင်းနှင့် turquoise-blue မှ lavender-pink သို့ အရောင်ပြောင်းလဲသည့် single signature pill-shaped button အတွက် သီးသန့်ထားရှိသည်။ ကတ်များသည် အမြင့်ထက် turquoise မျက်နှာပြင် ridges (16px အချင်းဝက်၊ အရိပ်မရှိ) ပေါ်တွင် ပေါလောမျောနေသောကြောင့် အဆင့်ဆင့်ကို စက္ကူပေါ်ရှိ အရိပ်ထက် ရေအနက်အဖြစ် မြင်ကြသည်။ အစိတ်အပိုင်းများသည် ဂရုတစိုက်ရှိပြီး တူရိယာကဲ့သို့ ဖြစ်သည်- စာလုံးကြီးများဖြင့် ခြေရာခံအမှတ်အသားများ၊ ပါးလွှာသော geometric မြားအိုင်ကွန်များ၊ ဖျော့ဖျော့ပန်းရောင်ဖြင့် ဂဏန်းကြီးများဖြင့် ဖတ်ရှုနိုင်သည်။
အများဆုံး 1440px အကျယ်ရှိတဲ့ အကြောင်းအရာပါတဲ့ မှောင်မိုက်ပြီး အကျယ်အပြည့်ရှိတဲ့ ပတ္တူတစ်ခု။ အဓိက element က viewport အမြင့်တစ်ခုလုံးကို လွှမ်းခြုံထားပြီး particle တစ်ခုကို နောက်ခံ element အဖြစ် အသုံးပြုထားတဲ့ အလယ်ဗဟိုမှာရှိတဲ့ text block (brow → headline → subtext → call to action) တစ်ခုပါ။ အပိုင်းတွေက 68px+ ဒေါင်လိုက်နေရာကြီးတွေနဲ့ ခွဲထားတဲ့ အကျယ်အပြည့် strips တွေဖြစ်ပြီး ပတ္တူနဲ့ အနည်းငယ်ချိုင့်ဝင်နေတဲ့ မျက်နှာပြင်တွေကြားမှာ တစ်လှည့်စီပါ။ "Explore" အပိုင်းက asymmetrical two-column layout ကို အသုံးပြုပါတယ်- ဘယ်ဘက်ကော်လံမှာ stacked feature cards တွေပါဝင်ပြီး ညာဘက်ကော်လံမှာ geometric molecular illustration ပါရှိပါတယ်။ အကြောင်းအရာကို အနားစွန်းကနေ အနားစွန်းကို ဆန့်ထုတ်မယ့်အစား ကျဉ်းမြောင်းတဲ့ကော်လံတွေ (အများဆုံး ~600px) မှာ အလယ်ဗဟိုထားပြီး အလွယ်တကူဖတ်ရှုနိုင်ပါတယ်။ footer က 120px ဒေါင်လိုက်အနားသတ်ရှိတဲ့ ချိုင့်ဝင်နေတဲ့ pit (#011d1c) ဖြစ်ပြီး ရေနက်ကြီးတစ်ခုရဲ့ အကျိုးသက်ရောက်မှုကို ဖန်တီးပေးပါတယ်။ navigation က 16–24px ခြားထားတဲ့ element တွေပါတဲ့ ပါးလွှာပြီး ပွင့်လင်းမြင်သာတဲ့ panel တစ်ခုပါ။ အလုံးစုံ rhythm က ရုပ်ရှင်ဆန်ဆန်နဲ့ ကျယ်ဝန်းပါတယ်- အပိုင်းတိုင်းက အသက်ရှူမြန်ပြီး ရေနက်တဲ့ အရောင်ပေါင်းစပ်မှုက စာပိုဒ်တစ်ခုစီနဲ့ ပိုနက်ရှိုင်းစွာ ကျဆင်းသွားသလို ခံစားရစေပါတယ်။
မြင်သာထင်ရှားသောပုံစံသည် ရိုးရှင်းပြီး လေထုဆန်သည်။ ပင်မစာမျက်နှာတွင် သုံးဖက်မြင်အမှုန်အမွှားပုံသဏ္ဍာန်ပါရှိပြီး သေးငယ်သော အပြာရောင်နှင့် အဖြူရောင်အစက်အပြောက်ထောင်ပေါင်းများစွာသည် ပတ္တူကို ပဲ့တင်ထပ်ပြီး အနားတစ်လျှောက်တွင် ခရမ်းရောင်-ပန်းရောင် ပေါင်းစပ်မှုများဖြင့် လည်ပတ်နေသော အမှုန်အမွှားများကို ဖွဲ့စည်းထားပြီး သတင်းအချက်အလက်အရာဝတ္ထုတစ်ခုနှင့် ဆင်တူသော ဇီဝအလင်းပြန်မှုအကျိုးသက်ရောက်မှုကို ဖန်တီးပေးသည်။ ညာဘက်ကော်လံတွင် အလှဆင်ပစ္စည်းများအဖြစ် ပြားချပ်ချပ်ဂျီဩမေတြီ မော်လီကျူးပုံများ (အဖြူရောင်စက်ဝိုင်းများနှင့် မှောင်မိုက်သော ပတ္တူပေါ်တွင် ပါးလွှာသောချိတ်ဆက်မျဉ်းများ) ကို အသုံးပြုထားသည်။ ဓာတ်ပုံများ၊ လူနေမှုပုံစံပုံများ၊ လူများ မပါရှိပါ - မြင်သာထင်ရှားသော ဘာသာစကားသည် သန့်ရှင်းသောဒေတာဂရပ်ဖစ်များနှင့် စိတ္တဇပုံစံများကို အခြေခံထားသည်။ အမှုန်အမွှားပုံသဏ္ဍာန်သည် အမှတ်တံဆိပ်အမှတ်အသား၏ အဓိပ္ပာယ်ဖွင့်ဆိုချက်ဖြစ်သော မြင်သာထင်ရှားသော အစိတ်အပိုင်းဖြစ်သည်။ ၎င်းသည် နက်ရှိုင်းသောဥပစာစကားကို အားဖြည့်ရန် အရေးကြီးသော စာမျက်နှာတိုင်းတွင် အနည်းဆုံးတစ်ကြိမ် ပေါ်လာရမည်။
ရောင်စုံ
အမှတ်တံဆိပ်
- Liquid Abyss
#012624— အဓိကနောက်ခံသည် စာမျက်နှာ၏အောက်ခြေ၊ ခေါင်းစဉ်၊ အဓိကဒြပ်စင်နှင့် လွှမ်းမိုးသော ပြာလဲ့ရင့်ရောင်စက်ဝိုင်းဖြစ်သည်။ ၎င်းသည် ပင်လယ်ရေနက်လေထုကို ဖန်တီးပေးသည်။ - Liquid Deep
#011d1c— ချိုင့်ဝင်နေသော မျက်နှာပြင်အဆင့်သည် အောက်ခြေနောက်ခံနှင့် ပိုနက်ရှိုင်းသော ကတ်ထူပြားများဖြစ်သည်။ ၎င်းကို ပတ္တူထက် ထက်ဝက်အရောင်ပိုမှောင်သည်ဟု မြင်တွေ့ရပြီး အနက်၏ သိမ်မွေ့သော အောက်ဘက်သို့ ရွေ့လျားမှုကို ဖန်တီးပေးသည်။ - Liquid Kelp
#003734— ကတ်မျက်နှာပြင် မြင့်တက်ခြင်းနှင့် ခလုတ်ဖြည့်ခြင်း—ချောက်ကမ်းပါးအထက်တွင် တစ်ဆင့်မြင့်သော မျက်နှာပြင်။ feature ကတ်များ၊ အကြောင်းအရာအကန့်များနှင့် gradient ခလုတ်၏ အစမှတ်အတွက် အသုံးပြုသည်။
ကြားနေ
- Liquid Mist
#edfffe— အေးမြသော အဖြူရောင်အရိပ်သည် ကိုယ်ထည်စာသား၊ အပိုင်းခေါင်းစဉ်များနှင့် နွေးထွေးပြီး ပေါ့ပါးသော စာလုံးပုံစံကို ပေါ်လွင်စေသည်။ သိမ်မွေ့သော အပြာရောင်သည် ကိုယ်ထည်စာသားကို ပြာလဲ့ရောင်ပေါင်းစပ်မှုနှင့် ဆက်စပ်စေသည်။ - Platinum
#ffffff— ခေါင်းစဉ်များ၊ လမ်းညွှန်ဒြပ်စင်များ၊ အိုင်ကွန်အကြမ်းများနှင့် ဆန့်ကျင်ဘက်အရောင်မြင့်မားသောစာသားများအတွက် သန့်စင်သောအဖြူရောင်ကို အသုံးပြုသည်။ ၎င်းသည် ခေါင်းစဉ်အဆင့်အားလုံးနှင့် အဓိကလမ်းညွှန်မှုတွင် အဓိကစာသားအရောင်ဖြစ်သည်။ - Silver Mist
#bbc7c6— ဒုတိယစာသား၊ အသံတိတ်ဖော်ပြချက်များနှင့် လင့်ခ်အရောင်တို့သည် မူလအခြေအနေတွင်ရှိသည်။ ၎င်းတို့တွင် အနည်းငယ်စိမ်းပြာရောင်ရှိပြီး ပြာလဲ့ရောင်နောက်ခံကို လိုက်ဖက်စေသည်။ - Ash
#f2f2f2— ကိုးကားချက်များနှင့် သုံးသပ်ချက်များအတွက် အပိုစာသား။ Silver Mist ၏ ပြာလဲ့ရောင်အောက်ခံသည် အလွန်တောက်ပနေသည်ဟု ခံစားရသည့်အခါအတွက် ကြားနေ၊ အေးမြသော မီးခိုးရောင်။ - Slate Deep
#707777— လှုပ်ရှားမှုမရှိသော သို့မဟုတ် မြင်သာမှုနည်းသော နောက်ခံများအတွက် မျက်နှာပြင်အရောင်ဖျော့ဖျော့။ ၎င်းသည် ပတ္တူနှင့် ကတ်ထူပြားကြားတွင် တည်ရှိပြီး အမြင့်အနည်းငယ်ကွာခြားမှုကို ပေးစွမ်းသည်။ - Lavender Phosphor
#fde9ff— ကြီးမားသော စာရင်းအင်းများ၊ ဂဏန်းရေတွက်မှုများနှင့် အရေးကြီးသော မက်ထရစ်များအတွက် နောက်ခံမီးအရောင်။ ထူးခြားသော ရောင်ပြေးအရောင်ရှိ ပန်းရောင်အရိပ်ကို မှောင်သောမျက်နှာပြင်များတွင် တောက်ပသော အသားပေးအဖြစ် အနည်းငယ်သာ အသုံးပြုထားသည်။
စာလုံးပုံစံ
၁၀ မှ ၉၆px အထိ · အဆင့် ၆ ဆင့်
- Matter — အစားထိုးခြင်း: Inter · မျဉ်းကြောင်းများ 400, 500 · ခေါင်းစဉ်များနှင့် ကိုယ်ထည်မိတ္တူအတွက် အဓိကဖောင့်ကို ခေါင်းစဉ်အားလုံး (H1–H3) နှင့် ကြီးမားသော kinetic စာသား (86–295px) အတွက် အလေးချိန် 500 ဖြင့် အသုံးပြုသည်။ ကိုယ်ထည်မိတ္တူနှင့် UI စာသားအတွက် အလေးချိန် 400 ကို အသုံးပြုသည်။ ၎င်းတွင် အရွယ်အစားကြီးများတွင် အနုတ်လက္ခဏာစာလုံးအကွာအဝေး (61px တွင် -0.04em၊ 86px တွင် -0.046em) နှင့် ခေါင်းစဉ်အဖုံးများတွင် ကျယ်ပြန့်သော အပြုသဘောစာလုံးအကွာအဝေး (20px တွင် 0.08em၊ 12px တွင် 0.12em၊ 10px တွင် 0.15em) တို့ ပါရှိသည်။ ခေါင်းစဉ်များအတွက် အလတ်စားအလေးချိန်ကိုသာ အသုံးပြုသည့် ဗျူဟာသည် ထူးခြားသောအင်္ဂါရပ်တစ်ခုဖြစ်သည် - ထူထဲသော သို့မဟုတ် ပေါ့ပါးသောဖောင့်မပါဝင်ပါ - ၎င်းသည် ဖောင့်ကို တစ်ပြေးညီ၊ စက်ပိုင်းဆိုင်ရာယုံကြည်မှုပေးသည်။
- Arial — အစားထိုးခြင်း: system-ui · မျဉ်းကြောင်းများ 400 · အပြန်အလှန်တုံ့ပြန်နိုင်သော UI အစိတ်အပိုင်းများ (navigation၊ buttons၊ header microcopy၊ footer) အတွက် ဒုတိယ fallback တစ်ခု။ 14px တွင်သာ ပေါ်လာသည် - Matter ကို မတင်သည့်အခါ ဘေးကင်းသော၊ universal fallback အဖြစ် အသုံးပြုပြီး form label များ၊ button text နှင့် small helper text များ ပါဝင်သည်။
ကြားကာလများနှင့်ပုံစံ
| ရည်ရွယ်ချက် | အဓိပ္ပာယ် |
|---|---|
| သိပ်သည်းဆ | ပျမ်းမျှ |
| အခြေခံအဆင့် | 20px |
| ခလုတ်အချင်းဝက် | 6px |
| ကတ်အချင်းဝက် | 16px |
| အရိပ်များ | အရိပ်များအစား ဘောင်မရှိပါ |
| အပိုင်းများအကြား | 68px |
| စာမျက်နှာအကျယ် | 1440px |
AI က သင့်ဝက်ဘ်ဆိုက်ကို Auros ပုံစံနဲ့ တည်ဆောက်ပြီး ဖြည့်စွက်ပေးပါလိမ့်မယ်
- Instagram ၊ TikTok ၊ Facebook လင့်ခ်မှတစ်ဆင့် ထုတ်ကုန်များနှင့် ပို့စ်များကို ဖြည့်ပါ။
- သင့်ဆိုက်ဟောင်းမှ အကြောင်းအရာကို လွှဲပြောင်းပါ—လိပ်စာကို သတ်မှတ်ပါ။
- အကောင်းဆုံးအင်ဂျင်ပေါ်တွင် ခေတ်မီဒီဇိုင်း- server rendering နှင့် SEO optimization ပါဝင်သော React ( Next.js)။
- ရှာဖွေမှုရလဒ်များနှင့် neural network အကြံပြုချက်များအတွက် အပြည့်အဝ အလိုအလျောက် SEO အကောင်းဆုံးဖြစ်အောင်ပြုလုပ်ခြင်း။
အလားတူပုံစံများ
- Design Full-Time — နွေးထွေးသော မီးအိမ်တစ်ခုပါသည့် စတူဒီယိုရုပ်ရှင်ရုံ
- Air — ရုပ်တု "ဖန်ခွက်မှတစ်ဆင့် သန်းခေါင်ယံကောင်းကင်"
- Slash — ရွှေချထားသော စာရင်းဇယားများပါသည့် သန်းခေါင်ယံ သေတ္တာ
- Raycast — သန်းခေါင်ယံ ကွပ်ကဲရေးစင်တာ၊ ကိုရယ်နီယွန်
- Dimension — မှောင်ရီပျိုးစပြုချိန်တွင် အလင်းရောင်ကောင်းစွာရသော အလုပ်စခန်းတစ်ခု
- Modal — မှောင်မိုက်နေသော ဆာဗာအခန်းရှိ ဖော့စဖောရက်စ် တာမီနယ်တစ်ခု - တစ်ခုတည်းသော အလင်းရောင်ရင်းမြစ်မှာ တောက်ပသော အစိမ်းရောင်ဖြစ်သည်
- Giga — ရေခဲအော့ဘ်စီဒီယန်ပေါ်က သန်းခေါင်ယံမိုးကုပ်စက်ဝိုင်း
- Reflect Notes — ကြယ်များပြည့်နှက်နေသော ခရမ်းရောင်အာကာသသည် မှောင်မိုက်သော နက္ခတ်တာရာကြည့်စခန်းတစ်ခုဖြစ်ပြီး အနက်ရောင်အကွက်အကွင်းနောက်ခံတွင် ကြယ်စုများကဲ့သို့ မှတ်စုများ လွင့်မျောနေပါသည်။
- Ameba — သန်းခေါင်ယံအချိန်တွင် ထိန်းချုပ်ခန်း - အေးခဲနေသော မှန်ပြားများအတွင်းမှ လျှပ်စစ်အပြာရောင် လျှပ်စီးကြောင်းတစ်ခု
- AgentQL — ညအချိန်တွင် ဆိပ်ကမ်းပေါ်ရှိ မြောက်ပိုင်းအလင်းရောင်များ
- Frame — ညဉ့်နက်ပိုင်း ရုပ်ရှင်ပြသရန်အတွက် ရုပ်ရှင်ရုံ။ အပြာရောင် မီးအိမ်တစ်ခုတည်းက အလုပ်အားလုံးကို လုပ်ဆောင်ပေးပြီး အသုံးပြုသူမျက်နှာပြင်သည် နောက်ခံသို့ ပျောက်ကွယ်သွားသောကြောင့် ဖန်တီးမှုဆိုင်ရာ အကြောင်းအရာများကို ရှေ့သို့ ပြသနိုင်စေမည့် မှောင်မိုက်သော အခန်းတစ်ခန်း။
- Harness — ဖော့စဖရပ်စ်ရောင် အစိမ်းရောင် အလှဆင်မှုများဖြင့် သန်းခေါင်ယံတွင် မစ်ရှင် ထိန်းချုပ်ရေး