ThoughtLab
ကြက်သွေးရောင် အချက်ပြမှုပါသည့် obsidian အထိမ်းအမှတ်ကျောက်တိုင်။ ဘုရားကျောင်းတွင် တစ်ခုတည်းသော ပြည့်ဝနေသော အနီရောင်အရာဝတ္ထုကို အဖြူရောင်စာလုံးကြီးများဖြင့် ရိုက်နှိပ်ထားပြီး အရောင်တစ်မျိုးတည်းသာရှိသော ပုံသဏ္ဍာန်ရှိသည့် အနက်ရောင် ဗလာနတ္ထိပန်းချီကား။
ThoughtLab သည် Black Cathedral ဒီဇိုင်းဘာသာစကားကဲ့သို့ လုပ်ဆောင်သည်- ဗလာအနက်ရောင်ကင်းဗတ်စ်၊ တစ်ခုတည်းသော အနီရောင် pulse နှင့် ကြီးမားသော typography သည် ဗိသုကာလက်ရာအဖြစ် လုပ်ဆောင်သည်။ စနစ်သည် လုံးဝနီးပါး achromatic ဖြစ်သည်—#cccccc သည် ခန္ဓာကိုယ်ကို ကိုယ်စားပြုပြီး #ffffff သည် display ကို ကိုယ်စားပြုသည်—#fc1c46 သည် ဗလာနောက်ခံတွင် ထိန်းချုပ်ထားသော တင်းမာမှုလှိုင်းတစ်ခုအနေဖြင့် တစ်ခုတည်းသော primary action အတွက်သာ ပေါ်လာသည်။ Hierarchy ကို အရောင်၊ အရိပ်များ သို့မဟုတ် ဖြည့်မှုများမှတစ်ဆင့် မဟုတ်ဘဲ ထက်မြက်သော scale jumps (198px → 14px) မှတစ်ဆင့် တည်ဆောက်ထားသည်။ အစိတ်အပိုင်းများသည် အလေးချိန်မဲ့သည်- ပွင့်လင်းမြင်သာသော ကတ်များ၊ ဆေးပြားပုံသဏ္ဍာန် ခလုတ်များ၊ ပါးလွှာသော input fields များ၊ မြင့်မားသော stacking မရှိခြင်း—စာမျက်နှာသည် containers များမှတစ်ဆင့် မဟုတ်ဘဲ negative space နှင့် သိပ်သည်းစွာထုပ်ပိုးထားသော အကြီးစာလုံးများကို ဖြတ်သန်းသွားသည်။
စာမျက်နှာရဲ့ အကျယ်တစ်ခုလုံးကို မှောင်မိုက်တဲ့ ပတ္တူတစ်ခုနဲ့ ဖုံးအုပ်ထားပြီး အလျားလိုက်အနားသတ်တွေ ကျယ်ပါတယ် (တစ်ဖက်စီမှာ 126px ရှိပြီး အကြောင်းအရာကော်လံကို 1400px ခန့်အထိ တွန်းပို့ထားပါတယ်)။ ခေါင်းစဉ်က 72px လိုင်းတစ်ခုတည်းပါပါတယ်- ဘယ်ဘက်မှာရှိတဲ့ လိုဂို၊ အလယ်မှာ tagline၊ ဆေးပြားပုံသဏ္ဍာန် call-to-action ခလုတ်နဲ့ ညာဘက်မှာရှိတဲ့ hamburger bar။ hero က ပိုင်းခြားထားတဲ့ ဖွဲ့စည်းပုံတစ်ခုပါ - ဘယ်ဘက်မှာရှိတဲ့ စာလုံးကြီးအားလုံးနဲ့ 198px အရွယ်အစားကြီးမားတဲ့ ခေါင်းစဉ်တစ်ခုဖြစ်ပြီး အောက်မှာ 18px ထောက်ပံ့ပေးထားတဲ့ ကိုယ်ထည်မိတ္တူတစ်ခုပါရှိပြီး အလယ်ရဲ့ ညာဘက်မှာရှိတဲ့ စာသားကို 3D စက်ဝိုင်းတစ်ခုက ထပ်နေပြီး တစ်စိတ်တစ်ပိုင်း "စားသုံး" နေပါတယ်။ hero အောက်မှာ အပိုင်းတွေကို ကျယ်ဝန်းတဲ့ ဒေါင်လိုက်စည်းချက်နဲ့ စီစဉ်ထားပြီး 86–108px အကွာအဝေးရှိပါတယ်။ လက်ရာရဲ့ အစိတ်အပိုင်းတွေကို ကတ်တွေရဲ့ grid အနေနဲ့မဟုတ်ဘဲ စာမျက်နှာရဲ့ အကျယ်တစ်ခုလုံးနီးပါးကို စာရင်းတစ်ခုအဖြစ် ပြသထားပါတယ်။ sidebar မရှိ၊ mega-menu မရှိ၊ column grid ပါတဲ့ footer မရှိ - footer က မူပိုင်ခွင့်အချက်အလက်နဲ့ ဆက်သွယ်ရန်အချက်အလက်တွေပါတဲ့ တစ်ခုတည်းသော တိတ်ဆိတ်တဲ့လိုင်းတစ်ခုပါ #4c4c4c။ ခေါင်းစီးထက်ကျော်လွန်သော လမ်းညွှန်မှုသည် မျက်နှာပြင်အပြည့် ထပ်ဆင့်ပြသမှုတွင် ဟမ်ဘာဂါ မီနူးအဖြစ် စတင်သည်။
ပုံများသည် ရှားပါးပြီး ရည်ရွယ်ချက်ရှိရှိ စီစဉ်ပေးထားသည်။ အဓိက မြင်သာထင်ရှားသော အစိတ်အပိုင်းမှာ WebGL ဖြင့် ဖန်တီးထားသော obsidian အရည်၏ ကြီးမားသော စက်ဝိုင်းပုံဖြစ်ပြီး မှောင်မည်းပြီး အနက်ရောင်နီးပါးရှိသော 3D ပုံသဏ္ဌာန်တစ်ခုဖြစ်ပြီး အနားတစ်လျှောက်တွင် အပြာရောင်နှင့် ပယင်းရောင် အရိပ်အယောင်များ ပေါ်လွင်နေပြီး အနက်ရောင်နောက်ခံတွင် ပေါလောမျောနေပြီး ခေါင်းစဉ်နှင့် တစ်စိတ်တစ်ပိုင်း ထပ်နေသည်။ ၎င်းသည် သရုပ်ဖော်ပုံထက် အမှတ်တံဆိပ် သင်္ကေတအဖြစ် ပိုမိုလုပ်ဆောင်သည်။ ပရောဂျက် ပုံငယ်များကို ဓာတ်ပုံများ သို့မဟုတ် ဗီဒီယိုများအဖြစ် ဒေါင်လိုက်စာရင်းတွင် ပြသထားပြီး ဘောင်မပါဘဲ အစွန်းမှအစွန်းအထိ တင်ပြထားသည်။ လူနေမှုပုံစံ ဓာတ်ပုံများ၊ စတော့ရှယ်ယာပုံများ၊ အလှဆင်ထားသော gradient များ မရှိပါ။ စက်ဝိုင်းနှင့် စာလုံးများသည် စာမျက်နှာပေါ်ရှိ မြင်သာထင်ရှားသော အစိတ်အပိုင်းများသာ ဖြစ်သည်။
ရောင်စုံ
အမှတ်တံဆိပ်
- Crimson Signal
#fc1c46— အဓိက အသားပေးဖော်ပြချက်မှာ အနီရောင် အစိတ်အပိုင်းတစ်ခုတည်းဖြစ်သည်။ ၎င်းကို "Contacts" tab၊ brand logo တွင် ပေါ်ပြီး အခြားနေရာတွင် ပေါ်သည်။ ၎င်း၏ ရှားပါးမှုမှာ ဒီဇိုင်း၏ အသေးစိတ်အချက်အလက်များကြောင့် ဖြစ်သည်။
ကြားနေ
- Void
#000000— စာမျက်နှာနောက်ခံ၊ ပတ္တူသည် အခြားဒြပ်စင်အားလုံး တည်ရှိနေသည့် လုံးဝအခြေခံအုတ်မြစ်ဖြစ်သည်။ - Ash
#cccccc— အဓိကစာသားနှင့် လင့်ခ်စာသား၊ အနက်ရောင်ကင်းဗတ်စ်ပေါ်ရှိ မူရင်းစာသားအရောင် - အလင်းပြန်မှုကို လျှော့ချရန် သန့်စင်သောအဖြူရောင်အစား ရွေးချယ်ထားသည်။ - Frost
#ffffff— ခေါင်းစဉ်များ၊ ခလုတ်စာသား၊ ထည့်သွင်းရန်အကွက်စာသားနှင့် markup ကိုပြသခြင်းသည် အထင်ရှားဆုံးအဆင့်ဖြစ်ပြီး၊ linear ဖြစ်သင့်သော အကြောင်းအရာအတွက် ရည်ရွယ်ပါသည်။ - Graphite
#4c4c4c— မူပိုင်ခွင့်၊ မက်တာတဂ်များ၊ အရန်စာသား - အဓိကစာသားနှင့် ယှဉ်ပြိုင်ခြင်းမရှိစေရန် ရည်ရွယ်ချက်ရှိရှိ အသံဖျောက်ထားသည်။
စာလုံးပုံစံ
၁၀ မှ ၁၉၈ px အထိ · အဆင့် ၇ ဆင့်
- sui — အစားထိုးခြင်း: Space Grotesk (closest free geometric match) or Inter for a more neutral alternative. Neue Haas Grotesk Display if licensed. · မျဉ်းကြောင်းများ 300, 400, 500, 700 · တစ်ခုတည်းသောဖောင့်။ Sui သည် ခေါင်းစဉ်များအတွက် 198px မှ စာတန်းများအတွက် 10px အထိ အရာအားလုံးအတွက် အသုံးပြုသည့် စိတ်ကြိုက်ဒီဇိုင်းထုတ်ထားသော ဂျီဩမေတြီ sans-serif ဖောင့်တစ်ခုဖြစ်သည်။ 700 အလေးချိန်ကို ကြီးကျယ်သော ခေါင်းစဉ်များနှင့် ခေါင်းစဉ်ကြီးများအတွက် သီးသန့်ထားရှိပြီး 400 အလေးချိန်ကို စနစ်၏ ကျန်အပိုင်းအတွက် အသုံးပြုသည်။ bold နှင့် regular အကြား ဆန့်ကျင်ဘက်မှုသည် အဓိကဖောင့်စနစ်ဖြစ်ပြီး ဒုတိယမိသားစု မလိုအပ်ပါ။
ကြားကာလများနှင့်ပုံစံ
| ရည်ရွယ်ချက် | အဓိပ္ပာယ် |
|---|---|
| သိပ်သည်းဆ | သိပ်သည်းသော |
| အခြေခံအဆင့် | 9px |
| ခလုတ်အချင်းဝက် | 9999px |
| ကတ်အချင်းဝက် | 0px |
| အရိပ်များ | အရိပ်များအစား ဘောင်မရှိပါ |
| အပိုင်းများအကြား | 86-108px |
| စာမျက်နှာအကျယ် | 1400px |
AI က သင့်ဝက်ဘ်ဆိုက်ကို ThoughtLab ပုံစံနဲ့ တည်ဆောက်ပြီး ဖြည့်စွက်ပေးပါလိမ့်မယ်
- Instagram ၊ TikTok ၊ Facebook လင့်ခ်မှတစ်ဆင့် ထုတ်ကုန်များနှင့် ပို့စ်များကို ဖြည့်ပါ။
- သင့်ဆိုက်ဟောင်းမှ အကြောင်းအရာကို လွှဲပြောင်းပါ—လိပ်စာကို သတ်မှတ်ပါ။
- အကောင်းဆုံးအင်ဂျင်ပေါ်တွင် ခေတ်မီဒီဇိုင်း- server rendering နှင့် SEO optimization ပါဝင်သော React ( Next.js)။
- ရှာဖွေမှုရလဒ်များနှင့် neural network အကြံပြုချက်များအတွက် အပြည့်အဝ အလိုအလျောက် SEO အကောင်းဆုံးဖြစ်အောင်ပြုလုပ်ခြင်း။
အလားတူပုံစံများ
- Vivid+Co — အော့ဘ်စီဒီယန်မှတစ်ဆင့် ပရစ်စမက်တစ်အလင်းရောင်
- Sequel — မှောင်မိုက်နေတဲ့ ရုပ်ရှင်ရုံမှာ ညအချိန် သီးသန့်ပြသတာက တစ်ခုတည်းသော နွေးထွေးတဲ့အလင်းရောင်ပါပဲ။
- Dovetail — လရောင်မည်းအောက်က ပုံစံငယ်တစ်ခု—မမြင်ရတဲ့ ဂရပ်မျဉ်းကြောင်းတွေ၊ အဖြူရောင်ဖောင့်၊ ခရမ်းရောင်တောက်ပမှုတစ်ခု
- MekaVerse — ဒစ်ဂျစ်တယ်ပစ္စည်းများ၏ monochrome ပြခန်း—ပုံဖော်ထားသောကမ္ဘာသည် ပြတိုက်ပြပွဲတစ်ခုကဲ့သို့ တွဲလောင်းကျနေသော လုံးဝမည်းနက်သော အလွတ်ကွက်လပ်တစ်ခုဖြစ်ပြီး အသုံးပြုသူမျက်နှာပြင်တစ်ခုလုံးသည် မှိန်ဖျော့သောအနက်ရောင်ဖန်သားပေါ်တွင် အဖြူရောင်မင်ဖြင့် ပြုလုပ်ထားသည်။
- Krea — သန်းခေါင်ယံတွင် ပြခန်း noir
- Factory — သန်းခေါင်ယံတွင် "စစ်ခန်း" ဂိတ်။ "စက်ရုံ" သည် မီးအိမ်ထွန်းထားသော ညွှန်ကြားချက်တစ်ခုကဲ့သို့ အဖြူရောင်ကတ်တစ်ခု ကျရောက်နေသည့် လုံးဝမည်းနက်သော ထိန်းချုပ်ခုံတစ်ခုဖြစ်ပြီး အခန်းထဲတွင် တစ်ခုတည်းသော အရာဝတ္ထုမှာ အလုပ်ဖြစ်သည်။
- basement — မနက် ၃ နာရီတွင် ဗလာပုံနှိပ်စက်တစ်လုံး - မည်းမှောင်နေသော မျက်နှာပြင်ပေါ်တွင် ကြီးမားသော၊ ချုံ့ထားသော ဖောင့်များသည် ပြန့်ကျဲနေပြီး၊ လမ်းညွှန်ဘားတွင် လိမ္မော်ရောင်အလင်းတန်းတစ်ခုသာ ရှိနေပြီး၊ ကျန်အရာအားလုံးသည် အဖြူရောင် သို့မဟုတ် မီးခိုးရောင်ကဲ့သို့ ဖြစ်နေသည်။
- Stink Studios — သန်းခေါင်ယံမှာ ရုပ်ရှင်စတူဒီယိုတစ်ခု - ပရိုဂျက်တာရဲ့ အသံမြည်နေတယ်၊ အခန်းက မှောင်နေတယ်၊ ရုပ်ရှင်ပဲ မီးထွန်းထားတယ်
- Apple (España) — မီးအလင်းရောင်တပ်ဆင်ထားသော အနက်ရောင်ပြဇာတ်ရုံ
- Charlie — ဘုန်းကြီးကျောင်းကျောက်တုံးမှ အော့ဘ်စီဒီယန်ပေါ်တွင် ထွင်းထုထားသော စာလုံးပုံစံ။ တစ်ခုတည်းသော အနီရောင်နံရံက နားကွဲမတတ် တိတ်ဆိတ်မှုကို ဖန်တီးပေးသည့် ဖိုင်တွဲတစ်ခု။
- Rive — မြင့်မားသောတိကျသောညမြင်ကွင်း။ အင်တာဖေ့စ်တွင် မှောင်မိုက်မှုကို ထိုးဖောက်ဝင်ရောက်နိုင်သော အထူးမှန်ဘီလူးတစ်ခုပါရှိပြီး နည်းပညာဆိုင်ရာအသေးစိတ်အချက်အလက်များကို လုံးဝရှင်းလင်းစွာ အာရုံစိုက်နိုင်စေပါသည်။
- Datalands — နီယွန်မီးတစ်ချက်သာ လင်းနေသော အနက်ရောင် ဘုရားကျောင်းကြီး။ လိုဂိုသည် ဘုရားကျောင်းဝင်းကို ဖြည့်ထားပြီး ကျန်တာအားလုံးသည် အောက်တွင် မကြားရသော စာသားများသာ ဖြစ်သည်။