Slush
ပါစတယ်စက္ကူပေါ်တွင် လေမှုတ်နိုင်သော စတစ်ကာများ၏ စကြဝဠာ
Slush သည် စတစ်ကာအယ်လ်ဘမ်ကဲ့သို့ လုပ်ဆောင်သည်- ပါစတယ်စက္ကူကင်းဗတ်စ်၊ တောက်ပသောအပြာရောင်ကြီးမားသော ဖဲကြိုးများနှင့် ကွန်ဖက်တီများကဲ့သို့ ပြန့်ကျဲနေသော သက်တံ့ရောင်စဉ်တန်း စတစ်ကာအနှစ်သာရများ။ စာလုံးမျက်နှာပြင်သည် ကြီးမားပြီး အကျဉ်းချုံးထားသည် (ဘေးတိုက် 800 x 200–640px၊ လိုင်းအကွာအဝေး 0.75–0.80)၊ ထို့ကြောင့် စကားလုံးများသည် စာကြောင်းများထက် ပန်းပုလက်ရာများ ဖြစ်လာသည်။ ကြွယ်ဝပြီး ထူးခြားသော အရောင်ခြောက်မျိုးသည် အထွေထွေစတစ်ကာ palette အဖြစ် လုပ်ဆောင်သည် - အရောင်တစ်ခုစီသည် ဖြည့်ထားသော စတစ်ကာ၊ ကတ်မျက်နှာပြင် သို့မဟုတ် အလှဆင်အလွှာအဖြစ် ပေါ်လာပြီး မသိမသာ အနှစ်သာရအဖြစ် ပေါ်လာသည်။ အစိတ်အပိုင်းများကို ညင်သာစွာဝိုင်းထားသည် (ကတ်များတွင် 20–40px၊ navigation တွင် ဆေးပြားပုံသဏ္ဍာန်) နှင့် လက်ဖြင့်ပြုလုပ်ထားသော အကျိုးသက်ရောက်မှုအတွက် အနက်ရောင်ဖြင့် ဘောင်ခတ်ထားသည်။ ရလဒ်အနေဖြင့် fintech landing page ထက် အရောင်ဖျော့ဖျော့နံရံတွင် ချိတ်ထားသော ရုပ်ပိုင်းဆိုင်ရာ collage တစ်ခုဖြစ်သည်။
အပြင်အဆင်တွင် sidebar သို့မဟုတ် persistent container မပါဘဲ full-width scrolling page ပါရှိသည်။ scrolling text နှင့် minimalist top navigation (ဘယ်ဘက်တွင် logo၊ အလယ်တွင် navbar၊ ညာဘက်တွင် filled call-to-action) တို့သည် အပေါ်ဆုံးတွင် ရှိနေပါသည်။ အပိုင်းတစ်ခုစီသည် full-width color strip (#dceeff → #ffffff → #cccccc) ဖြစ်ပြီး 3D အပြာရောင်ဖဲကြိုးများဖြင့် ဘောင်ခတ်ထားသော ကျယ်ပြန့်သော ဘေးထွက်စာသားပါရှိပြီး အလယ်ဗဟို သို့မဟုတ် ဘယ်ဘက်တွင် ချိန်ညှိထားသည်။ အကြောင်းအရာ အပြင်အဆင်သည် grid-based မဟုတ်ဘဲ ရည်ရွယ်ချက်ရှိရှိ လျော့ရဲရဲနှင့် collage ပုံစံဖြစ်သည်- စတစ်ကာများသည် စာသားကို ထပ်နေပြီး ဖဲကြိုးများသည် စာသားနောက်တွင် ဖြတ်နေပြီး QR ကတ်တစ်ခုကို ဒုတိယအပိုင်းတွင် အလယ်ဗဟိုမှ လွဲ၍ ထားရှိထားသည်။ ဒေါင်လိုက်စည်းချက်သည် အတော်လေးကျယ်သည် (အပိုင်းများအကြား 48px ကွာဟချက်များ)၊ သို့သော် အလျားလိုက်ဖွဲ့စည်းပုံသည် ရည်ရွယ်ချက်ရှိရှိ မညီမျှပါ။ စာမျက်နှာတွင် အပေါ်မှအောက်သို့ ကြီးမားသောအရောင်အစင်းသုံးခုအဖြစ် ဖတ်ရှုရပြီး တစ်ခုစီသည် သီးခြားပိုစတာတစ်ခုဖြစ်သည်။
အမြင်အာရုံဘာသာစကားကို သုံးဖက်မြင် အပြာရောင်ဖဲကြိုးများက လွှမ်းမိုးထားသည်—လျှပ်စစ်အပြာရောင်ဖြင့် အမှုန်အမွှားများပါသော လေမှုတ်နိုင်သော ပြွန်ပုံသဏ္ဌာန်များဖြင့် ဖွဲ့စည်းထားသော ပေါင်းစည်းထားသော အမှတ်တံဆိပ်ပုံစံတစ်ခု—အပိုင်းတစ်ခုစီရှိ ခေါင်းစဉ်စာသားကို ပတ်ပတ်လည် သို့မဟုတ် ဖုံးကွယ်ထားသည်။ အလှဆင်ထားသော နှစ်ဘက်မြင်စတစ်ကာများ (ဒုံးပျံ၊ ရွှေဒင်္ဂါးပြား၊ အစိမ်းရောင် အမှန်ခြစ်၊ ခရမ်းရောင်ပိုက်ဆံအိတ်) သည် ခေါင်းစဉ်များပတ်လည်တွင် ပေါ်နေပြီး တစ်ခုစီတွင် အနက်ရောင်မျဉ်းကြောင်း (1px) ပါရှိသည်။ မည်သည့်နေရာတွင်မျှ ဓာတ်ပုံမရှိပါ။ ရိုးရာသရုပ်ဖော်ဇယားကွက်များ မရှိပါ။ အရာအားလုံးကို ကော်လာ့ဂျ်ဖြင့် ပေါင်းစပ်ပြီး မညီမျှစွာ စီစဉ်ထားသည်။ သုံးဖက်မြင်ဖဲကြိုးများသည် အဓိကလေထုကို ဖန်တီးပေးပြီး စတစ်ကာများသည် ပျော်ရွှင်ဖွယ်ကောင်းသော အထိအတွေ့ကို ပေါင်းထည့်ပေးပြီး ကျန်အရာများမှာ စာလုံးနှင့် အရောင်ဖြစ်သည်။
ရောင်စုံ
အမှတ်တံဆိပ်
- Electric Blue
#4da2ff— အဓိကအမှတ်တံဆိပ်အရောင်—ထူထဲသောဖဲကြိုးပန်းပုများ၊ ရုပ်ပုံနောက်ခံများ၊ ကတ်များပေါ်ရှိ မှုန်ဝါးသောပုံစံများ—သည် မျက်နှာပြင်တစ်ခုစီအတွက် အုတ်မြစ်အဖြစ် ဆောင်ရွက်သော အမြင်အာရုံဆိုင်ရာ အမှတ်အသားတစ်ခုဖြစ်သည်။
ကြားနေ
- Carbon
#000000— အဓိကစာသား၊ ကတ်ဘောင်များ၊ လုပ်ဆောင်ရန် တိုက်တွန်းချက်အတွက် ဖြည့်ထားသော နောက်ခံနှင့် လိုဂိုတို့သည် ပါစတယ်မျက်နှာပြင်များပေါ်တွင် လက်ဖြင့်ဖြတ်တောက်ထားသော စတစ်ကာပုံ အကျိုးသက်ရောက်မှုကို ဖန်တီးပေးသည်။ - Paper White
#ffffff— ပတ္တူစာမျက်နှာ၊ ကတ်ထူပြားမျက်နှာပြင်များ၊ ခလုတ်မျဉ်းကြောင်းဖြည့်ခြင်း၊ မှောင်မိုက်သောနောက်ခံပေါ်တွင် စာသား။ - Sky Wash
#dceeff— အဓိကအပိုင်းနောက်ခံ၊ အပြာဖျော့ဖျော့ ပါစတယ်နောက်ခံ။ - Concrete Gray
#cccccc— ဒုတိယအပိုင်းနောက်ခံ၊ ကြားနေအလယ်အလတ်မျက်နှာပြင် - Soft Mist
#e9e9e9— သိမ်မွေ့သော ခလုတ်နှင့် မျက်နှာပြင်အရောင်များ၊ ပိတ်ထားသော အခြေအနေများ - Mint Pop
#55db9c— နောက်ခံ၊ အလှဆင်အစင်းများနှင့် အကြောင်းအရာနောက်ကွယ်ရှိ နူးညံ့သော အပြင်အဆင်ကို မီးမောင်းထိုးပြရန် အစိမ်းရောင်ဖြည့်ပါ။
စာလုံးပုံစံ
၁၂ မှ ၆၄၀ px အထိ · အဆင့် ၇ ဆင့်
- Lateral — အစားထိုးခြင်း: Druk · မျဉ်းကြောင်းများ 800 · ခေါင်းစဉ်များ — "SLUSH" လိုဂိုနှင့် "ALL THINGS SUI" ကဲ့သို့သော အပိုင်းဘန်နာများ — ကိုသာ 200-640px ဖောင့်ဖြင့် လိုင်းအမြင့် 0.75-0.80 လျှော့ချထားသောကြောင့် စာလုံးများသည် ထွင်းထုထားသော ဘလောက်များအဖြစ် ရှိနေသည်။ ၎င်းသည် ရိုးရာဆန့်ကျင်ရေး ပြသမှုနည်းလမ်းတစ်ခုဖြစ်သည်- အခြားဝဘ်ဆိုက်များတွင် လိုင်းအမြင့် 0.85 အောက်ရှိသော 800-point ဖောင့်ကို အသုံးမပြုပါ၊ ဤအကျိုးသက်ရောက်မှုသည် စာသားကို သုံးဖက်မြင်ဖဲကြိုးများဖြင့် ထုပ်ပိုးထားသော ရုပ်ပိုင်းဆိုင်ရာအရာဝတ္ထုတစ်ခုကဲ့သို့ ပြုမူစေသည်။
- Aeonik Pro — အစားထိုးခြင်း: Inter · မျဉ်းကြောင်းများ 500, 700 · body copy၊ navigation၊ ခလုတ်များနှင့် subheadings များအပါအဝင် user interface တစ်ခုလုံး။ body copy နှင့် metadata အတွက် weight 500 (12–16px)၊ subheadings နှင့် navigation label များအတွက် weight 700 (24–30px) နှင့် secondary headings ကြီးများအတွက် 64px increment 700။ စာလုံးအကွာအဝေးကျဉ်းမြောင်းခြင်း (-0.010em) သည် body copy (14–16px) ကိုကျဉ်းစေသည်။ navigation label များ/ခလုတ်များတွင် အနည်းငယ်ချဲ့ထွင်ခြင်း (0.030–0.032em) သည် controls များကို "white space" ပေးသည်။
ကြားကာလများနှင့်ပုံစံ
| ရည်ရွယ်ချက် | အဓိပ္ပာယ် |
|---|---|
| သိပ်သည်းဆ | သိပ်သည်းသော |
| အခြေခံအဆင့် | 4-12px |
| ခလုတ်အချင်းဝက် | 1600px |
| ကတ်အချင်းဝက် | 20px |
| အရိပ်များ | အရိပ်များအစား ဘောင်မရှိပါ |
| အပိုင်းများအကြား | 48px |
| စာမျက်နှာအကျယ် | 1440px |
AI က သင့်ဝက်ဘ်ဆိုက်ကို Slush ပုံစံနဲ့ တည်ဆောက်ပြီး ဖြည့်စွက်ပေးပါလိမ့်မယ်
- Instagram ၊ TikTok ၊ Facebook လင့်ခ်မှတစ်ဆင့် ထုတ်ကုန်များနှင့် ပို့စ်များကို ဖြည့်ပါ။
- သင့်ဆိုက်ဟောင်းမှ အကြောင်းအရာကို လွှဲပြောင်းပါ—လိပ်စာကို သတ်မှတ်ပါ။
- အကောင်းဆုံးအင်ဂျင်ပေါ်တွင် ခေတ်မီဒီဇိုင်း- server rendering နှင့် SEO optimization ပါဝင်သော React ( Next.js)။
- ရှာဖွေမှုရလဒ်များနှင့် neural network အကြံပြုချက်များအတွက် အပြည့်အဝ အလိုအလျောက် SEO အကောင်းဆုံးဖြစ်အောင်ပြုလုပ်ခြင်း။
အလားတူပုံစံများ
- Apple iPhone Duo — အဖြူရောင်ပြခန်းထဲက ခေါက်သိမ်းလို့ရတဲ့ ကိရိယာတစ်ခု။ ထုတ်ကုန်ရဲ့ ရုပ်ပုံတွေကို အလယ်မှာ ထားပြီး စာလုံးပုံစံနဲ့ အပြာရောင် ထိန်းချုပ်မှုတွေကိုတော့ တမင်တကာ နှိမ့်ချထားပါတယ်။
- AYOCIN — ကျန်းမာခြင်းရဲ့ နေရောင်ခြည်သင်္ကေတ။ နွေးထွေးတဲ့ အတွင်းပိုင်းဓာတ်ပုံနဲ့ ဆင်တူတဲ့ မျက်နှာပြင်တွေကို ဖန်တီးပါ- ကြီးကျယ်ခမ်းနားတဲ့ စာလုံးပုံစံ၊ ဖြည်းဖြည်းချင်း မှုန်ဝါးနေတဲ့ ဗိသုကာလက်ရာအရိပ်တွေနဲ့ တိတ်ဆိတ်ငြိမ်သက်ပြီး ခရင်မ်လို နူးညံ့တဲ့ နေရာမှာ တည်ရှိတဲ့ အလင်းရောင်ရှိတဲ့ အရာဝတ္ထုတစ်ခုတည်း။
- Apple AirPods 5 — Apple — အဖြူရောင်နောက်ခံပေါ်ရှိ ရုပ်ရှင်ရုံ။ တည်းဖြတ်ရန်အတွက် ကျယ်ပြန့်သော အဖြူရောင်နေရာလွတ်သည် ရွေ့လျားနေသော အရာဝတ္ထုများ၏ ပုံရိပ်များနှင့် ပြည့်ဝသောအလင်းရောင်များသည် အမြင်အာရုံဆိုင်ရာ ဒရာမာကို ဖန်တီးပေးသည့် အပြည့်အစုံ ကြော်ငြာများအတွက် နေရာပေးသည်။
- Hopper — နေဝင်ချိန် ဆန်တိုရီနီမြို့ကို မျှော်ကြည့်နေသည့် ပြတင်းပေါက်တစ်ခု။ ဦးတည်ရာ၏ ပျော့ပျောင်းသော ဓာတ်ပုံတစ်ပုံသည် လေထုအလွှာအဖြစ် ဆောင်ရွက်ပေးပြီး ၎င်းပေါ်တွင် ကျစ်လစ်သော အဖြူရောင် လမ်းညွှန်မှုနှင့် ဘွတ်ကင်ခလုတ်များ ရှိနေသည်။
- Bose — ကမ်းရိုးတန်းရှိ အသံစင်မြင့်တစ်ခု။ လေတိုက်ခတ်နေသော ကြော်ငြာပုံတစ်ပုံသည် ဘောင်ကို ပြည့်နှက်နေပြီး ၎င်းပတ်လည်တွင် ကြည်လင်ပြတ်သားသော အဖြူအမည်း ကမ်ပိန်းထိန်းချုပ်မှုများကို တိကျသော အသေးစိတ်အချက်အလက်များကဲ့သို့ စီစဉ်ထားသည်။
- Bauhaus Clock — Bauhaus မှ လှုံ့ဆော်မှုရယူထားသော နာရီများ – ပြာလဲ့ရောင် စက်ပိုင်းဆိုင်ရာ အလင်းပြန်မှု။ တည်ငြိမ်ပြီး ပေါ့ပါးသော မျက်နှာပြင်များကို မှောင်မိုက်သော ရုပ်ရှင်နာရီပုံရိပ်ဖြင့် ဘောင်ခတ်ပြီး ပြာလဲ့ရောင်ကို ရှားပါးသော တောက်ပမှုအသေးစိတ်အဖြစ် အသုံးပြုပါ။
- Cursor — မီးခိုးတလူလူဖြင့် ထွန်းထားသော သက်တောင့်သက်သာရှိသော သိုးသားရေချုပ်အလုပ်ရုံ
- MindMarket — ခရင်မ်စက္ကူပေါ်တွင် ရေးသားထားသော ဇာတ်လမ်းပုံပြင်စာအုပ်တစ်အုပ် - နေရောင်စိုစွတ်ပြီး စတစ်ကာကဲ့သို့ နူးညံ့သော မျက်နှာပြင်ပေါ်တွင် ကြီးမားသော ခေါင်းစဉ်များနှင့် ဖြတ်ထုတ်ထားသော စက္ကူဇာတ်ကောင်များ တစ်ပြိုင်နက်တည်း ရှိနေသည့် ဖော်ရွေသော အယ်ဒီတာ့အာဘော် ပတ္တူတစ်ခုဖြစ်သည်။
- Shop — အဖြူရောင်စကျင်ကျောက်ပေါ်တွင် ပေါလောမျောနေသော ကုန်သွယ်ရေးကြယ်စု
- Airbnb — သန္တာရောင် စာညှပ်တစ်ခုပါသည့် တိတ်ဆိတ်ငြိမ်သက်သော အဖြူရောင် ပြခန်းနံရံတစ်ခု
- Superr — နေ့လည်ခင်းနေရောင်ဖျော့ဖျော့အောက်က နွေးထွေးတဲ့ ကျောင်းသုံးမှတ်စုစာအုပ်တစ်အုပ်။ ခရင်မ်ရောင်စာမျက်နှာ၊ အဖုံးမပါသော လိမ္မော်ရောင်မာကာနှင့် ခွာရန်စောင့်ဆိုင်းနေသော ကော်ဖြင့်ပြုလုပ်ထားသော အမည်စတစ်ကာတစ်ထပ်။
- Apple (España) — ပြတိုက်ပြခန်းသည် နေ့အလင်းရောင်ဖျော့ဖျော့အောက်တွင် တစ်ခုတည်းသော ဆွဲဆောင်မှုရှိသော အလေးချိန်မဲ့ အဖြူရောင်နေရာတစ်ခုဖြစ်ပြီး ပြပွဲတစ်ခုစီကို အရောင်ဖျော့ဖျော့ဖြင့် အလှဆင်ထားသော မီးအိမ်ဖြင့် ထွန်းလင်းထားသည်။