Foodnoms
အဖြူရောင်ကြွေထည်ပေါ်တွင် နေသာသော သစ်သီးဈေး - နွေးထွေးသော လိမ္မော်သီးများ၊ လတ်ဆတ်သော အစိမ်းရောင်များနှင့် ကြီးမားသော လုံးဝန်းသော ပုံသဏ္ဍာန်များ
Foodnoms မှာ အာဟာရခြေရာခံခြင်းအတွက် ပေါ့ပါးတဲ့ စျေးကွက်ရှာဖွေရေးဘာသာစကားတစ်ခု ပါဝင်ပါတယ်- သန့်ရှင်းတဲ့ အဖြူရောင်ကင်းဗတ်စ်၊ အမြင်အာရုံဆိုင်ရာ အထောက်အပံ့အဖြစ် အရွယ်အစားကြီးမားတဲ့ ဖုန်းပုံစံငယ်တွေနဲ့ အရောင်တွေက အာဟာရဓာတ်တွေနဲ့ တိုးတက်မှုကို ကိုယ်စားပြုတဲ့ ပျော်ရွှင်စရာကောင်းတဲ့ အရောင်ဝေါဟာရတွေ ပါဝင်ပါတယ်။ အရောင်နှစ်ရောင် header ပုံစံ (keyword အတွက် တစ်ရောင်၊ ကျန်အရောင်တွေအတွက် မှောင်တဲ့ဂရပ်ဖိုက်) က တန်ဖိုးအဆိုပြုချက်ကို မြန်မြန်ဆန်ဆန် အကဲဖြတ်နိုင်စေပါတယ်။ စနစ်ဟာ ဒေတာများစွာပါတဲ့ အက်ပ်မျက်နှာပြင်တွေကို နူးညံ့စေတဲ့ ထူးခြားတဲ့ လုံးဝန်းတဲ့ ဂျီဩမေတြီအင်္ဂါရပ်တွေပါတဲ့ single user display (Aquawax Pro) ကို အားကိုးပါတယ်။ မျက်နှာပြင်အများစုဟာ ပြားချပ်ပြီး အရိပ်ကင်းပါတယ်။ ထောင့်အချင်းဝက်တူညီမှုက ခလုတ်တွေ၊ ကတ်တွေနဲ့ label တွေကို ဖော်ရွေပြီး နူးညံ့တဲ့ခံစားချက်ကို ပေးစွမ်းပြီး ကျန်းမာရေးခြေရာခံခြင်းကို ဆေးခန်းထက် ပိုမိုလွယ်ကူစေပါတယ်။
စာမျက်နှာတွင် ကော်လံတစ်ခုတည်း၊ အလယ်ဗဟိုပြု၊ အကျယ်အပြည့် အပြင်အဆင် (~1200px) ပါဝင်ပြီး ဒေါင်လိုက်စည်းချက်ညီညီဖြင့် ပါရှိသည်။ ခေါင်းစဉ်မှာ ဘယ်ဘက်တွင် လိုဂို၊ လမ်းညွှန်ကို အလယ်ဗဟိုပြုထားပြီး ညာဘက်တွင် လိမ္မော်ရောင် လုပ်ဆောင်ချက်ခလုတ် ပါရှိသော အပေါ်ဘားပါးလေးဖြစ်သည်။ ဟီးရိုးအပိုင်းသည် အလယ်ဗဟိုပြု အစုအဝေးတစ်ခုဖြစ်သည်- အရောင်နှစ်ရောင်ခေါင်းစဉ်၊ တစ်ကြောင်းတည်းသော ခေါင်းစဉ်ခွဲ၊ App Store အိုင်ကွန်နှင့် ထို့နောက် အကျယ်တစ်လျှောက် ဖြန့်ကျက်ထားသော ဖုန်းပုံစံငယ် ၃-၅ ခု တန်းတစ်တန်း။ ဟီးရိုးအပိုင်းအောက်တွင် 2x3 ဇယားကွက်တွင် အလယ်ဗဟိုပြုထားသော "အကြံပြုထားသည့်အတိုင်း" စာနယ်ဇင်းလိုဂိုအပိုင်းရှိသည်။ feature အပိုင်းများသည် ထပ်ခါတလဲလဲပုံစံကို လိုက်နာသည်- စာသားနှစ်ကော်လံ + ဖုန်းပုံစံငယ်၊ တစ်ဖက်တစ်ချက်စီတွင် လိမ္မော်ရောင်/အစိမ်းရောင်ဖြင့် နောက်ခံအပိုင်းခေါင်းစဉ်များပါရှိသည်။ အောက်ခြေမတိုင်မီ နောက်ဆုံးဒြပ်စင်မှာ အကျယ်အပြည့် ဒေါင်းလုဒ်လုပ်နိုင်သော CTA ကတ်တစ်ခုဖြစ်သည်။ အပိုင်းများအကြားရှိ မျဉ်းကြောင်းများသည် ကျယ်ဝန်းပြီး ပြခန်းကဲ့သို့ ခံစားချက်ကို ဖန်တီးပေးသည် (96px)။ လမ်းညွှန်သည် minimalist အပေါ်ဘားဖြစ်သည် - ဘေးဘက် သို့မဟုတ် mega menu မရှိပါ။
အက်ပ်ရဲ့ visual language ကို app ရဲ့အလုပ်လုပ်ပုံ interface ကိုပြသတဲ့ အရည်အသွေးမြင့် iPhone frame mockup တွေက လွှမ်းမိုးထားပါတယ် - ဒါတွေက stock photo တွေမဟုတ်ဘဲ အဓိက element တွေပါ။ mockup တွေကို လုံးဝနီးပါး transparency နဲ့ပြသထားပြီး အနည်းငယ်ထပ်နေပြီး ချောမွေ့စွာလည်ပတ်ကာ အဖြူရောင်နောက်ခံပေါ်မှာ တိုက်ရိုက်ထားရှိပါတယ်။ mockup တွေထဲမှာ visual component ကို app ရဲ့ကိုယ်ပိုင် interface က ပံ့ပိုးပေးထားပါတယ်- အာဟာရဆိုင်ရာအချက်အလက်၊ ထုတ်ကုန်ဓာတ်ပုံများ၊ macro ring များနှင့် ရောင်စုံ category tag များ။ ဓာတ်ပုံအကြောင်းအရာတစ်ခုတည်းကတော့ Scan Your Food app ရဲ့ကင်မရာ screen မှာမြင်နိုင်တဲ့ user တင်သွင်းထားတဲ့ အစားအစာပုံတွေပါပဲ။ lifestyle ဓာတ်ပုံတွေ၊ abstract illustration တွေ၊ အလှဆင် graphics တွေ မရှိပါဘူး။ branding ကို custom font၊ orange/green/dark color scheme နဲ့ app ရဲ့ကိုယ်ပိုင် interface တို့နဲ့ အပြည့်အဝသတ်မှတ်ထားပါတယ်။
ရောင်စုံ
အမှတ်တံဆိပ်
- Ember Orange
#ff5406— လိမ္မော်ရောင်ကို အလှဆင်အသေးစိတ်အချက်အလက်များအတွက် ဒုတိယအရောင်အဖြစ်နှင့် ရှားရှားပါးပါး အချက်ပြမှုများကို မီးမောင်းထိုးပြရန်အတွက် အသုံးပြုသည်။ ၎င်းကို လုပ်ဆောင်ရန် လှုံ့ဆော်မှုများအတွက် အဓိကအရောင်အဖြစ် အသုံးမပြုသင့်ပါ။
ကြားနေ
- Graphite
#2f2f2f— အဓိကစာသား၊ မှောင်သောခလုတ်များ (App Store အိုင်ကွန်) နှင့် အိုင်ကွန်ပုံများ။ ခေါင်းစဉ်များနှင့် ကိုယ်ထည်စာသားတွင် အဖြူရောင်မဟုတ်သော အဓိကအရောင်။ - Verdant Green
#00b33f— အစိမ်းရောင်သည် အလှဆင်အသေးစိတ်အချက်အလက်များအတွက် နောက်ထပ်အလေးပေးမှုအဖြစ် ဆောင်ရွက်ပေးပြီး အနိမ့်ကြိမ်နှုန်းများကို အလေးပေးဖော်ပြသည်။ - Signal Red-Orange
#ff3400— အက်ပ်မျက်နှာပြင် UI အစိတ်အပိုင်းများနှင့် ဆက်စပ်အမှတ်တံဆိပ်တွင် မြင်နိုင်သော ဒုတိယနွေးထွေးသော အပြင်အဆင်။ Ember Orange ထက် တစ်ရောင်ပိုနွေးထွေးပြီး ရွေးချယ်ထားသော သို့မဟုတ် လက်ရှိအက်ပ်အခြေအနေများကို အလေးပေးဖော်ပြသည်။ - Sky Blue
#00a9dd— အက်ပ်၏ အတွင်းပိုင်းဒေတာအမျိုးအစားများ (ကာဗိုဟိုက်ဒရိတ်/ပရိုတင်း/အခြားအာဟာရအုပ်စုများ) အတွက် နှစ်လိုဖွယ်ကောင်းသော ဆန့်ကျင်ဘက်ဖြစ်မှု။ ဖုန်းအပြင်အဆင်များတွင် နွေးထွေးပြီး လွှမ်းမိုးထားသော အရောင်ပေါင်းစပ်မှုကို ဟန်ချက်ညီစေသည်။ - Mist Blue
#72a2c5— တိတ်ဆိတ်သော အေးမြသော အပြင်အဆင် - အက်ပ်အတွင်းရှိ နောက်ထပ်ဒေတာ အညွှန်းများနှင့် ဇယားနောက်ခံများအတွက် ကောင်းကင်ပြာရောင်ကို နူးညံ့စေသည်။ - Sunset Orange
#ff6d00— စျေးကွက်ရှာဖွေရေး စာမျက်နှာများတွင် ဒုတိယခေါင်းစဉ်များနှင့် မီးမောင်းထိုးပြထားသော စာသားအတွက် နွေးထွေးသော လေယူလေသိမ်း။
စာလုံးပုံစံ
၁၂ မှ ၆၀ px အထိ · အဆင့် ၇ ဆင့်
- Aquawax Pro Medium — အစားထိုးခြင်း: Inter · မျဉ်းကြောင်းများ 500 · Aquawax Pro Medium - ထုတ်ယူထားသောဒေတာတွင် တွေ့ရှိရသော်လည်း AI မှ မဖော်ပြထားပါ။
- Aquawax Pro — အစားထိုးခြင်း: Nunito Sans · မျဉ်းကြောင်းများ 700, 500, 600 · ခေါင်းစဉ်များနှင့် ကိုယ်ထည်မိတ္တူအပါအဝင် အကြောင်းအရာအားလုံးတွင် အသုံးပြုသော အဓိကအမှတ်တံဆိပ်ဖောင့်။ ဤစိတ်ကြိုက်ဒီဇိုင်းထုတ်ထားသောဖောင့်တွင် ကျယ်ပြန့်သောစာလုံးအမြင့်များ၊ လုံးဝန်းသောဂျီဩမေတြီပုံသဏ္ဌာန်များနှင့် သက်တောင့်သက်သာရှိသောအချိုးအစားများပါရှိသည်။ Bold (700) ကို ခေါင်းစဉ်များနှင့် အပိုင်းများအတွက် အသုံးပြုသည်—စနစ်၏ စာစီစာရိုက်အမှတ်အသားများ။ Semibold (600) ကို 14–1.8 မီလီမီတာတွင် ခေါင်းစဉ်ခွဲများနှင့် ခလုတ်တံဆိပ်များအတွက် အသုံးပြုသည်။ Medium (500) ကို 17–1.8 မီလီမီတာတွင် ကိုယ်ထည်မိတ္တူအတွက် အသုံးပြုပြီး သက်တောင့်သက်သာဖတ်ရှုနိုင်ရန် လုံလောက်သောလိုင်းအကွာအဝေး 1.6–1.8 မီလီမီတာရှိသည်။
- System sans-serif — အစားထိုးခြင်း: Inter · မျဉ်းကြောင်းများ 400, 700 · user interface မှာ စာသားအလွန်သေးငယ်တဲ့ စာသားတွေနဲ့ icon စာသားတွေအတွက် fallback option တစ်ခုကို အသုံးပြုပါတယ်။ Aquawax Pro ကို micro size တွေမှာ မသုံးပါဘူး။ system font က rendering weight လျှော့ချဖို့ ဒါတွေကို ကိုင်တွယ်ပါတယ်။
ကြားကာလများနှင့်ပုံစံ
| ရည်ရွယ်ချက် | အဓိပ္ပာယ် |
|---|---|
| သိပ်သည်းဆ | ကျယ်ဝန်းသော |
| အခြေခံအဆင့် | 20px |
| ခလုတ်အချင်းဝက် | 26px |
| ကတ်အချင်းဝက် | 26px |
| အရိပ်များ | အရိပ်များအစား ဘောင်မရှိပါ |
| အပိုင်းများအကြား | 96px |
| စာမျက်နှာအကျယ် | 1200px |
AI က သင့်ဝက်ဘ်ဆိုက်ကို Foodnoms ပုံစံနဲ့ တည်ဆောက်ပြီး ဖြည့်စွက်ပေးပါလိမ့်မယ်
- Instagram ၊ TikTok ၊ Facebook လင့်ခ်မှတစ်ဆင့် ထုတ်ကုန်များနှင့် ပို့စ်များကို ဖြည့်ပါ။
- သင့်ဆိုက်ဟောင်းမှ အကြောင်းအရာကို လွှဲပြောင်းပါ—လိပ်စာကို သတ်မှတ်ပါ။
- အကောင်းဆုံးအင်ဂျင်ပေါ်တွင် ခေတ်မီဒီဇိုင်း- server rendering နှင့် SEO optimization ပါဝင်သော React ( Next.js)။
- ရှာဖွေမှုရလဒ်များနှင့် neural network အကြံပြုချက်များအတွက် အပြည့်အဝ အလိုအလျောက် SEO အကောင်းဆုံးဖြစ်အောင်ပြုလုပ်ခြင်း။
အလားတူပုံစံများ
- Slite — မြေနီရောင်လက်ကိုင်ပါသည့် နွေးထွေးသော စက္ကူမှတ်စုစာအုပ်တစ်အုပ်—မျက်နှာပြင်တိုင်းသည် ခရင်မ်စက္ကူဖြစ်ပြီး အသားပေးမှုတိုင်းသည် လိမ္မော်ရောင်ဖျော့ဖျော့ဖြင့် လှပနေသည်။
- Adora — အေးခဲထားသောဖန်သားနောက်ကွယ်ရှိ Impressionism ပြတိုက်
- Bento — နေရောင်အောက်က လင်နိုလီယမ်ပေါ်မှာ ဘန်တိုနေ့လယ်စာဘူးတစ်လုံး။ ထူထဲပြီး မှင်နက်နဲ့ ရေးထားတဲ့ ထုံး၊ လာဗင်ဒါ၊ ကိုဘော့နဲ့ ဘာဂန်ဒီရောင်တွေပါတဲ့ လုံးဝိုင်းတဲ့ စတစ်ကာကတ်တွေလို ဇယားကွက်တစ်ခုဟာ ရဲရင့်ပြီး ဂျီဩမေတြီဆန်တဲ့ ခေါင်းစဉ်အောက်မှာ နွေးထွေးပြီး ခရင်မ်ရောင် ပိတ်ချောထည်ပေါ်မှာ ရှိနေပါတယ်။
- Payments — တော်ဝင်ခရမ်းရောင်နောက်ခံတွင် တက်ကြွသော citrus အရောင်။ နက်ရှိုင်းသောလျှပ်စစ်ခရမ်းရောင်သည် ညကောင်းကင်ကို နှိုးဆွပေးပြီး သံပုရာဝါရောင်အပြင်အဆင်များသည် သန့်ရှင်းသောအဖြူရောင်မျက်နှာပြင်ပေါ်တွင် လတ်ဆတ်သော citrus အခွံကဲ့သို့ တောက်ပနေသည်။
- Textla — Sunny Retro Botanical Almanac - စိမ်းပြာရောင်ဖြင့် ရိုက်နှိပ်ထားသော ခရင်မ်ရောင် အဝါရောင် စာမျက်နှာ၊ ဆူးပင်ပုံများကို ထက်မြက်သော၊ အရိပ်များဖြင့် ရေးဆွဲထားသည်။
- AI for Business — နွေးထွေးသော မီးခိုးရောင်အရောင်များဖြင့် ရက်စက်ကြမ်းကြုတ်သော အယ်ဒီတာ့အာဘော်ပြခန်း
- Superhuman — ရွှေရောင်နာရီ အယ်ဒီတာအဖွဲ့
- Visitors — အဖြူရောင်အင်ဂျင်နီယာပုံ
- Vercel — အဖြူရောင်စက္ကူပေါ်တွင် ရိုက်နှိပ်ထားသော တာမီနယ်
- Jeton — နွေးထွေးသော စကျင်ကျောက်ပေါ်ရှိ fintech အကြောင်း အယ်ဒီတာ့အာဘော်
- Say Briefly — ခရင်မ်စက္ကူပေါ်တွင် ဖန်တီးမှုအေဂျင်စီ၏ ပုံဆွဲစာအုပ်
- ClickUp — အဖြူရောင်စကျင်ကျောက်ပေါ်ရှိ အစွမ်းထက်သော ဒိုင်ခွက်။ ဤစာမျက်နှာသည် ထုတ်လုပ်မှုကိရိယာအတွက် ထုတ်ကုန်လက်ကမ်းစာစောင်တစ်ခုဖြစ်သောကြောင့် အမြင်အာရုံဘာသာစကားကို ထုတ်ကုန်ကိုယ်တိုင်မှ ယူထားသည်- သိပ်သည်းသောစာရင်းများ၊ အခြေအနေညွှန်ပြချက်များ၊ avatar အုပ်စုများနှင့် ပြသထားသော ထုတ်ကုန်သတ်မှတ်ချက်ကဲ့သို့ ထင်ရစေသော ရဲရင့်သော စာလုံးပုံစံဖော်ပြချက်များ။