Duo Design Lab

Duo Design Lab We are a humble boutique web design studio, led by a group of young people with design and development background.

ကျွန်တော်တို့ website လေးလည်း လုပ်လိုက်ပါပြီ။ Design & Development Service တွေပေးနေပြီဆိုတော့ စိတ်ဝင်စားရင် ဝင်ကြည့်သွား...
05/09/2022

ကျွန်တော်တို့ website လေးလည်း လုပ်လိုက်ပါပြီ။ Design & Development Service တွေပေးနေပြီဆိုတော့ စိတ်ဝင်စားရင် ဝင်ကြည့်သွားလို့ရပါတယ်။

https://www.duodesignlab.com/

မင်္ဂလာပါဗျာ ဒီနေ့တော့ Size Calculator ဆိုတဲ့ Tool လေး အကြောင်းကို Share ပေးလိုက်ပါတယ်ဗျာ။ ဒီ Website လေးမှာတော့ Vinyl တ...
28/01/2021

မင်္ဂလာပါဗျာ ဒီနေ့တော့ Size Calculator ဆိုတဲ့ Tool လေး အကြောင်းကို Share ပေးလိုက်ပါတယ်ဗျာ။

ဒီ Website လေးမှာတော့ Vinyl တို့ဘာတို့လုပ်တဲ့ အခါကြရင် Font Size ဘယ်လောက်ထားရင်ရမလဲ ဆိုတာကို မှန်းကြည့်လို့ရအောင် ပြပေးမှာဖြစ်ပါတယ်။ အဲ့တာကို သုံးတာကတော့ သူ့မှာ Value ၃ခုပေးထားတာပါတယ် ကြည့်တဲ့လူနဲ့ စာလုံးရဲ့ အကွာအဝေး(Distance) ရယ်၊ စာလုံးရဲ့ တကယ့် Size အမှန်( Physical Size) ရယ်၊ ကြည့်တဲ့လူရဲ့ မျက်လုံးထဲမှာ မြင်ရမယ့် စာလုံး Size ( Perceived Size) ရယ်ဆိုပြီးတော့ပါ။ ကျွန်တော်တို့ သိချင်တဲ့ Value ကို အလွတ်ထားပြီး ကျန်တဲ့ နှစ်နေရာမှာ သိထားတဲ့ Value တွေထည့်ပေးရမှာပါ။ ဥပမာ ၁၀ပေ အကွာအဝေးကနေ Point 80 ရဲ့ရေးထားတဲ့ စာလုံးကိုဘယ်လိုမြင်ရမလဲဆိုပြီးတွက်လိုက်ရင် 5 Point လောက် သေးသေးလေးပဲမြင်ရမှာပါ ဆိုပြီးတော့ အဖြေပြန်ထုတ်ပေးပါတယ်။ နောက်ပြီး Site ထဲက လူပုံနဲ့ စာလုံးပုံ တွေကလည်း ကျွန်တော်တို့ထည့်တဲ့ Value တွေအတိုင်း ပြောင်းလဲပေးတယ် ဆိုတော့ စာလုံးကို ဘယ်လောက် အရွယ်လောက်မြင်ရလဲဆိုတာပါကြည့်လို့ရတာပေါ့။😇

ဒါလေးက သူ့ရဲ့ Link ပါ
www.sizecalc.com

ဒီpostလေးကနေတစ်ခုခုရမှာမယ်လို့မျှော်လင့်ပါတယ်ဗျာ။ အချိန်ယူဖတ်ပေးတဲ့အတွက်ကျေးဇူးတင်ပါတယ်။

ဒီpost လေးကို ရေးတာကတော့ Duo Design Lab က Admin Auston ဖြစ်ပါတယ်ဗျာ။

မင်္ဂလာပါ။ ကျွန်တော်တို့ ဒီနေ့ဆွေးနွေးမှာကတော့ User Experience ကောင်းမကောင်းဆုံးဖြတ်ရာမှာ အရေးကြီးတဲ့ topic တွေဖြစ်တဲ့ U...
25/01/2021

မင်္ဂလာပါ။ ကျွန်တော်တို့ ဒီနေ့ဆွေးနွေးမှာကတော့ User Experience ကောင်းမကောင်းဆုံးဖြတ်ရာမှာ အရေးကြီးတဲ့ topic တွေဖြစ်တဲ့ Usability and Accessibility အကြောင်းဖြစ်ပါတယ်။ ဒီနှစ်ခုက တစ်ခုနဲ့တစ်ခုဆက်နွယ်နေတာကြောင့် တူတူပဲလို့ထင်ရပေမယ့် ဒီ post မှာတော့ ဒီနှစ်ခုက ဘာကိုဆိုလိုတယ်၊ ဘယ်လိုကွာတယ်ဆိုတာလေးကိုဆွေးနွေးကြတာပေါ့ဗျာ။ စလိုက်ကြရအောင်။

ကျွန်တော်ကတော့ Usability နဲ့စလိုက်ပါမယ်။ Web/App တစ်ခုရဲ့ Usability ဆိုတာ အဲ့Appကိုသုံးရတာ ဘယ်လောက်လွယ်လဲဆိုတာနဲ့ ဆုံးဖြတ်ပါတယ်။ technical terms တွေနဲ့ပြောရမယ်ဆိုရင်
1. Memorability (အသုံးပြုပုံပြုနည်းကို မှတ်ရတာ ဘယ်လောက်လွယ်လဲ)
2. Efficiency (user ကို သူပြီးမြောက်ချင်တဲ့ task တစ်ခုကို ဘယ်လောက် မြန်မြန်နဲ့ စိတ်ချချလုပ်ဆောင်နိုင်သလဲ)
3. Error (error handling ကို user တွေအတွက်ဘယ်လောက်လွယ်အောင်လုပ်ထားသလဲ)
4. Learnability (ဒီAppကိုသုံးတတ်ဖို့ ဘယ်လောက်အချိန်ယူရလဲ)
5. Satisfaction (ဒီAppကစိတ်ကျေနပ်မှုဘယ်လောက်ထိပေးနိုင်လဲ) စသည်ဖြင့်ပေါ့။

နောက်တစ်ခုကတော့ Accessibility။ သူကတော့ ကိုယ့် Web/App ကို user type မျိုးစုံက အသုံးပြုနိုင်ခြင်းနဲ့ ဆုံးဖြတ်ပါတယ်။ disabled users တွေလို့ပြောတဲ့ color blind ဖြစ်နေတဲ့သူတွေ၊ အကြားအာရုံချို့ယွင့်နေတဲ့သူတွေ စသည်ဖြင့် အဲ့လို user တွေအတွက်ပါ အသုံးပြုရအဆင်ပြေအောင် ထည့်စဉ်းစားရတာဖြစ်ပါတယ်။ ဘယ်လိုအချက်တွေက Accessibility ကိုကျစေနိုင်သလဲဆိုရင်
1. ကိုယ့် website ကို host ထားတဲ့ server က downtime များနေတာ၊ ဒါမှမဟုတ် website က load time အရမ်းကြာနေတာမျိုး။
2. ကိုယ့် Web/App မှာ နှိပ်လို့မရတဲ့ (ဒါမှမဟုတ်) နှိပ်လိုက်လဲ ဘာမှမရှိတော့‌တဲ့နေရာဆီ‌ရောက်နေတဲ့ broken links တွေရှိနေတာမျိုး။
3. ကိုယ့် Website က responsive မဖြစ်တာမျိုး။ ဒါဆိုရင် mobile နဲ့ access လုပ်မယ့် user တွေကို ဆုံးရှံးရမှာဖြစ်ပါတယ်။
4. Color contrast ကောင်းကောင်းမရှိတာမျိုး။
5. Information Architecture သတ်သတ်မှတ်မှတ်မရှိတာမျိုးတွေ။
6. Image တွေမှာ Alt tag မပါတာမျိုး။
7. Video တွေမှာ caption မထည့်ပေးထားတာမျိုး စသည်ဖြင့်ပေါ့။

အနှစ်ချုပ်ပြောရရင် Usability ဆိုတာကတော့ Product ဖက်ကကြည့်တာဖြစ်ပြီး Accessibility ဆိုတာကတော့ User ဖက်ကကြည့်တာလို့မြင်မိပါတယ်။ broတို့ sisတို့ရဲ့ အမြင်ကိုလဲ comment မှာဆွေးနွေးလို့ရပါတယ်။

ကျွန်တော်အခုဆွေးနွှေးခဲ့တာတွေကတော့ ကျွန်တော့် level နဲ့မှီသလောက်လေးပေါ့။ ပိုပြီး deep ဖြစ်တဲ့ info တွေကိုတော့ Experience နဲ့သာသင်ယူသွားရမယ်လို့မြင်ပါတယ်။ ပြီးတော့ Product တစ်ခုက ချက်ချင်းကြီး Usability and Accessibility ကောင်းတဲ့ Product တစ်ခုဖြစ်လာမှာမဟုတ်ပါဘူး။ It's all about research and testing ပါတဲ့ 😂။ နောက်ဆုံးပြောချင်တာကတော့ UIUX Designer ရယ်လို့မှမဟုတ်ပါဘူး၊ အခု ကျွန်တော်တို့pageကစာတွေကိုဖတ်နေတဲ့ထဲမှာ freelance or junior developer လေးတွေလဲ ပါမှာပါ။ Developer တွေအနေနဲ့လဲ ဒီလို UX နဲ့ပတ်သတ်တာလေးတွေကိုထည့်တွေးပြီးလုပ်ရင် ပိုကောင်းတဲ့ product တွေဖြစ်လာမှာပါလို့ ပြောရင်းနဲ့ပဲ ဒီpostလေးကိုတော့ ဒီမှာပဲရပ်လိုက်ပါတယ်ဗျာ။ ဒီ post လေးကနေ ကိုယ့်အတွက်တစ်ခုခု ရသွားတယ်လို့ ယူဆရင် share သွားပေးပါဦးဗျ။ အချိန်ယူဖတ်ပေးတဲ့အတွက် ကျေးဇူးတင်ပါတယ်ဗျာ။

References:
https://www.usability.gov/get-involved/blog/2013/01/accessibility-and-usability.html
https://www.crazyegg.com/blog/principles-website-usability/
https://careerfoundry.com/en/blog/ux-design/the-importance-of-usability-and-accessibility-in-design/ #4-its-all-about-research-and-testing

အခု content ကိုရေးသားတာကတော့ Duo Design Lab က ကျွန်တော် Admin 311 ဖြစ်ပါတယ် 👻။

မင်္ဂလာပါဗျာ။ ကျွန်တော်ဒီနေ့မှာ Pantone Color Finder ဆိုတဲ့ Color Resource လေးတစ်ခုကို Share ပေးချင်ပါတယ်ဗျာ။ Color Find...
21/01/2021

မင်္ဂလာပါဗျာ။ ကျွန်တော်ဒီနေ့မှာ Pantone Color Finder ဆိုတဲ့ Color Resource လေးတစ်ခုကို Share ပေးချင်ပါတယ်ဗျာ။ Color Finder ဆိုတော့ နာမည်အတိုင်းပဲ Pantone က Standardizedလုပ်ထားတဲ့ Color တွေ ရှာလို့ရတဲ့ resource တစ်ခုပါ။

Pantone ဆိုတာကတော့ Graphic Design တို့ Fashion Design တို့ Product Designတို့ရယ် နောက်ပြီးတစ်ခြား Printing နဲ့ Production ဘက်မှာ သုံးဖို့ Color ညှိတဲ့ System တွေထုတ်တဲ့ Company တစ်ခုဖြစ်ပါတယ်။ အဲ့company က PMS လို့ခေါ်တဲ့ Pantone Matching System က တော်တော်လူသိများပါတယ်။

အဲ့ Color Finder အကြောင်းပြန်ဆက်ရအောင် ပထမ Feature အနေနဲ့ သူ့မှာ Color Of the Year ရဲ့ Color တွေပါမယ် အဲ့ Color ကိုနှိပ်လိုက်ရင် RGB နဲ့ HEX Values တွေကျလာပါတယ်။ CMYK Value လိုချင်ရင် အဲ့ Color ရဲ့ Pantone နာမည်ကိုယူပြီး Pantone to Pantone Converter မှာ CMYK Coated Library ရွေးရင်ရွေး မရွေးရင် Uncoated ကိုရွေးပြီး Color ယှဉ်ကြည့်လို့ရတယ် ကျွန်တော်စမ်းကြည့်တာတော့ Color တွေက တစ်ထပ်တည်းတူတာတွေမတွေ့ဘူး နည်းနည်းချင်းဆီကွဲကြတာတွေကြီးပဲ။ ကျွန်တော်ထင်တာကတော့ ကျွန်တော်တို့ Screen တွေပေါ်က တစ်ချို့အရောင်တွေနဲ့ Print လုပ်တဲ့ အရောင်တွေကွဲသလိုမျိုး သုံးတဲ့ Material တွေပေါ်မူတည်ပြီးကွာသွားလို့ အရောင်တွေကွဲသွားတာလို့ထင်ပါတယ်။

နောက်Feature ကတော့ Pickပါ။ အဲ့မှာမှ Color Swatches တွေနဲ့ ကိုယ်ကြိုက်တဲ့ Color စိတ်ကြိုက်ရွေးရုံပါပဲ။ But Color Library ကိုတော့ ကိုယ်သုံးမယ့် မှင်အမျိုးအစားတွေ Material အမျိုးအစားတွေကိုကြည့်ပြီး Library ပြန်ရွေးဖို့လိုမယ်ထင်ပါတယ်။ ကျွန်တော်တို့အသုံးများမယ့် Library နှစ်ခုကတော့ Pantone CMYK coated နဲ့ uncoated ဖြစ်မယ်ထင်ပါတယ်။ Coated နဲ့ Uncoated ကဘာကွာတာလဲဆိုတော့ Coated က စာရွက်ပေါ်မှာ ပြောင်ပြောင်လေးဖြစ်နေတဲ့ အလွှာတစ်ခုအုပ်ထားတဲ့စာရွက်အမျိုးအစားပါ။ Uncoated ကတော့ရိုးရိုး ပလိန်းစာအရွက်ပါပဲ။ အဲ့လိုစာရွက်အမျိုးအစားကွဲတာပေါ်မူတည်ပြီးတော့ Library နှစ်ခုကွဲနေတာပါ။ Library ရွေးပြီးပြီဆို ကိုယ်ကြိုက်တဲ့ Color swatch တစ်ခုကိုနှိပ်လိုက်ရင် RGB HEX CMYK Value တွေပြပေးပါတယ်။

နောက် Feature ကတော့ converter ပါ RGB HEX CMYK Value တွေကို Color Library ရွေးပြီး convert လိုက်ရင် အဲ့ Library ထဲက အနီးစပ်ဆုံး Color တွေပြပေးပါတယ် နောက်ပြီး converter ကတော့ Pantone to Pantone converterပါ အဲ့တာကတော့ အပေါ်မှာပြောခဲ့သလိုပဲ Library တစ်ခုက Pantone Color တစ်ခုကို တစ်ခြား Library က အနီးစပ်ဆုံး တူတဲ့ Color တွေပြပေးပါတယ်။

ဒီ Link လေးကနေဝင်စမ်းကြည့်လို့ရပါတယ်ဗျ။
https://www.pantone.com/color-finder

ဒီPost လေးကတော့ ဒီလောက်ပါပဲ။ ဒီ Postလေးကနေ Design တွေမှာ သုံးဖို့ Color လန်းလန်းလေးတွေရွေးဖို့အထောက်အကူဖြစ်သွားမယ်ဖို့ မျှော်လင့်ပါတယ်ဗျာ။ အချိန်ယူဖတ်ပေးလို့ကျေးဇူးတင်ပါတယ်။

ဒီ Postလေးကို ရေးသားတာကတော့ Duo Design Lab က ကျွန်တော် Admin Auston ဖြစ်ပါတယ်ဗျာ။

မင်္ဂလာပါဗျာ။ ဒီတစ်ခေါက် ကျွန်တော်တို့ share ပေးချင်တာကတော့ လတ်တလောရေပန်းစားလာနေတဲ့ Glassmorphism ဆိုတဲ့ UI trend တစ်ခုအ...
18/01/2021

မင်္ဂလာပါဗျာ။ ဒီတစ်ခေါက် ကျွန်တော်တို့ share ပေးချင်တာကတော့ လတ်တလောရေပန်းစားလာနေတဲ့ Glassmorphism ဆိုတဲ့ UI trend တစ်ခုအကြောင်း ဖြစ်ပါတယ်။ ဖန်သားပြင်ဆန်ဆန် Interface Design ပေါ့။ ဆိုတော့ အခု post ရဲ့ cover photo ကို ကျွန်တော်တို့တူတူ ပြန်လုပ်ကြည့်တာပေါ့ဗျာ။ ခက်ခက်ခဲခဲတော့မဟုတ်ပါဘူးဗျ။ ကျွန်တော်ကတော့ ထုံးစံအတိုင်း Figma user ဆိုတော့ Figma နဲ့ပေါ့။ bro တို့ sis တို့က တစ်ခြား tool တွေသုံး‌တယ်ဆိုလဲ Design tool တွေက ခပ်ဆင်ဆင်‌ေတွပဲမို့ tool နေရာအထားအသိုပဲကွာမှာပါ။ theory ကတော့ ဒါပါပဲ။ ဟုတ်ပါပြီ။ စကြည့်လိုက်ရအောင်။

မင်္ဂလာပါဗျာ ဒီနေ့မှာတော့ Graphic Design အကြောင်းကို အခမဲ့လေ့လာလို့ရမယ့် Online Course လေးတွေကို Share ပေးလိုက်ပါတယ်ဗျ။အ...
14/01/2021

မင်္ဂလာပါဗျာ ဒီနေ့မှာတော့ Graphic Design အကြောင်းကို အခမဲ့လေ့လာလို့ရမယ့် Online Course လေးတွေကို Share ပေးလိုက်ပါတယ်ဗျ။

အဲ့တော့ စလိုက်ကြရအောင်ဗျာ။

၁။ ပထမတစ်ခုကတော့ CalArts (California Institutes of Arts) နဲ့ Coursera နဲ့ပေါင်းလုပ်တဲ့ Graphic Design Specialization Program ပါ သူ့မှာ Course 5 ခုပါပါတယ်။

Course 1: Fundamentals of Graphic Design
Course 2: Introduction to Typography
Course 3: Introduction to Imagemaking
Course 4: Ideas from the history of Graphic Design
Course 5: Brand New Brand ဆိုပြီးတော့ပါ။

ဒီ Program ကတော့တော်တော်ပြည့်စုံပါတယ် ဒီဟာကိုပြီးအောင်တက်လိုက်ရင် Graphic Design ရဲ့ Fundamental တော်တော်သိသွားပါပြီ။ Uniက သင်တာဆိုတော့ သူ့ Course တွေလိုက်လုပ်ရတာ ကျောင်းစာလိုက်လုပ်ရသလို Feelလေးနဲ့ပါ။

Graphic Design Specialization Program
https://tinyurl.com/y7dgpzkw

၂။ဒီတစ်ခုက Kadenze က Introduction to Graphic Design History ဆိုတဲ့ Course လေးပါ။ ဒီcourse ကတော့ နာမည်အတိုင်းပဲ Graphic Design ရဲ့ သမိုင်းကြောင်းတွေ ဘယ်လိုဖြစ်ပေါ်လာတာလဲ ဆိုတာတွေ Graphic Design Styleတွေ Movement အမျိုးမျိုးတွေအကြောင်းလေ့လာလို့ရမှာဖြစ်ပါတယ်။

Introduction to Graphic Design History
https://tinyurl.com/y2yckbmx

၃။ ဒီတစ်ခုကတော့ Envatotuts+ က Illustrator ရယ် Photoshop ရယ် Indesign ရယ်ကို အခုမှစသုံးမယ်သူတွေအတွက် အသုံးပြုပုံတွေကို လေ့လာလို့ရမယ် Courseပါ ဒီ Course ကိုလိုက်လုပ် လိုက်ရင် software သုံးရတာတော်တော်အဆင်ပြေသွားပါပြီ။

Illustrator Basics Course
https://tinyurl.com/y5wykx55

Photoshop Basics Course
https://tinyurl.com/y53gglrc

Indesign Basics Course
https://tinyurl.com/y332jwy8

၄။ ဒီတစ်ခုကတော့ Skillshare နဲ့ Maryland Institutes of Arts နဲ့ ပေါင်းလုပ်ထားတဲ့ Graphic Design Basics: Core Principle of Graphic Design ဆိုတဲ့ Course ပါ။ ဒီ Course မှာ Basic Principles ၅ခု ဖြစ်တဲ့ Symmetry, Scale, Framing, Hierarchy, and Grid အကြောင်းတွေရယ် အဲ့ Principle တွေကို ဘယ်လိုအသုံးချလို့ရလဲဆိုတာရယ်ကို လေ့လာလို့ရမှာဖြစ်ပါတယ်။ နောက်ပြီး Course က ၃၅မိနစ်လောက်ပဲဆိုတော့ပေါ့ပေါ့ပါးပါးကြည့်သွားရုံပါပဲ။

Graphic Design Basics: Core Principles for Visual Design
https://tinyurl.com/y7qjyasx

၅။နောက်ဆုံးတစ်ခုကတော့ Canva Design School က Course ပါ အဲ့တစ်ခုကတော့ကျွန်တော်ပြောထားပေးပြီးသားဆိုတော့ အဲ့အကြောင်းကို အောက်ကLinkကနေ ဝင်ဖတ်ကြည့်လို့ရပါတယ်ဗျ။

Graphic Design Basics
facebook.com/duodesignlab/posts/124173342626651

ဒီcontent လေးကတော့ဒီလောက်ပါပဲဗျာ။ ဒီ Course တွေကိုလုပ်ကြည့်ပြီး Designer အဂျွတ်ကြီးတွေဖြစ်ဖို့အတွက် အစပျိုးလို့ရသွားမယ်လို့မျှော်လင့်ပါတယ်ဗျာ။ အချိန်ယူဖတ်ပေးလို့ကျေးဇူးတင်ပါတယ်။

ဒီ content လေးကိုရေးတာကတော့ Duo Design Lab ကကျွန်တော် Admin Auston ဖြစ်ပါတယ်ဗျ။

မင်္ဂလာပါ။ ကျွန်တော် ဒီနေ့ sharing လုပ်ပေးချင်တာကတော့ typography နဲ့ပတ်သတ်ပြီး improve ဖြစ်စေမယ့် tips လေးတွေဖြစ်ပါတယ်။ ...
11/01/2021

မင်္ဂလာပါ။ ကျွန်တော် ဒီနေ့ sharing လုပ်ပေးချင်တာကတော့ typography နဲ့ပတ်သတ်ပြီး improve ဖြစ်စေမယ့် tips လေးတွေဖြစ်ပါတယ်။ ခက်ခက်ခဲခဲမဟုတ်ပေမယ့် ဒီအချက်လေးတွေကလဲ design အပေါ် အကျိုးသက်ရောက်မှုတော်တော်ရှိတာမို့ သိထားသင့်ပါတယ်။ စကြည့်ရအောင်။

မင်္ဂလာပါဗျာ ကျွန်တော် ဒီနေ့တော့ Photoshop နဲ့ ဆံပင်တွေ Selection မှတ်ပြီးဖြတ်ထုတ်တဲ့ အခါမှာ ဘေးနားမှာ Background အရောင်...
07/01/2021

မင်္ဂလာပါဗျာ ကျွန်တော် ဒီနေ့တော့ Photoshop နဲ့ ဆံပင်တွေ Selection မှတ်ပြီးဖြတ်ထုတ်တဲ့ အခါမှာ ဘေးနားမှာ Background အရောင်တွေကျန်နေတာကို ဖျောက်တဲ့နည်းလေးကို Share ပေးချင်ပါတယ်ဗျာ။

Post ရှည်သွားမှာစိုးလို့ ဆံပင်ကိုSelection မှတ်တာကိုတော့ ဒီ Postမှာ မထည့်တော့ပါဘူးဗျာ။ Selection မှတ်တဲ့နည်းတွေသိချင်ရင်တော့ အောက်က Link ကနေဝင်ပြီးဖတ်ကြည့်လို့ရပါတယ်ဗျ။
facebook.com/duodesignlab/posts/206260421084609

အဲ့တော့ စလိုက်ကြရအောင်ဗျာ။

မင်္ဂလာပါဗျ။ ကျွန်တော် ဒီတစ်ခေါက် sharing လုပ်ပေးချင်တာကတော့ Figma ရဲ့ Auto Layout အကြောင်းဖြစ်ပါတယ်။ ဒီကောင်ကဘာတွေထူးခြ...
03/01/2021

မင်္ဂလာပါဗျ။ ကျွန်တော် ဒီတစ်ခေါက် sharing လုပ်ပေးချင်တာကတော့ Figma ရဲ့ Auto Layout အကြောင်းဖြစ်ပါတယ်။ ဒီကောင်ကဘာတွေထူးခြားလို့လဲ? အခြေခံအကျဆုံးနဲ့ အမြင်သာဆုံးဥပမာပေးရရင် button component တစ်ခု create လုပ်တယ်ဆိုပါစို့။ ပုံမှန်ဆို ကျွန်တော်တို့ rectangle တစ်ခုဆွဲတယ်။ text တစ်ခုရေးပြီး အဲ့ rectangle နဲ့ text ကို center ‌လုပ်ပေးလိုက်တယ်မလား။ တကယ်လို့ ကျွန်တော်တို့က အထဲက text ကိုပြောင်းကြည့်ချင်တယ်။ စာလုံးတိုသွားတာလဲဖြစ်နိုင်သလို စာလုံးပိုလာတာလဲဖြစ်နိုင်တယ်။ အဲ့ကျရင် ကျွန်တော်တို့က အနောက်က rectangle ကိုပါ လိုက်ပြန်ညှိရတော့မယ်။ဟုတ်တယ်ဟုတ်။ Auto Layout က အဲ့လိုမျိုးတွေ လိုက်မညှိရပဲ Figma ကို မင်းဟာမင်းညှိပေးပါဆိုပြီး လုပ်ခိုင်းလိုက်တဲ့ feature ပေါ့။နာမည်အတိုင်းပါပဲ။ layout တွေကို auto ညှိပေးတာပေါ့ဗျာ။

Auto Layout က Figma မှာပါတာကြာပြီဆိုပေမယ့် မကြာသေးခင်ကပဲ control လုပ်လို့ရမယ့် options အသစ်တွေနဲ့ update ထွက်ခဲ့ပါတယ်။ ဆိုတော့ ဘာတွေ control လုပ်လို့ရတာလဲ? elements တစ်ခုနဲ့တစ်ခုကြား spacing တွေ၊ padding တွေ၊ horizontal to vertical align ပြောင်း‌တာတွေ စသည်ဖြင့်ပေါ့။ Auto Layout အောက်က properties တွေက နားလည်ရလွယ်ပေမယ့် သူနဲ့အတူတွဲပါလာတာကတော့ Constraints and Resizing ဆိုတဲ့ကောင်ပါ။ သူ့အောက်မှာပါတဲ့ hug contents, fixed width, fill container စသည်ဖြင့် အဲ့ properties တွေကတော့ စစသိချင်း နားလည်ရနည်းနည်းခက်နိုင်ပါတယ်။

ဒါကြောင့် ဒီ Auto Layout ကို ကောင်းကောင်းအသုံးချတတ်ဖို့ YouTube က Crash Course လေးတစ်ခုကို share ပေးချင်ပါတယ်။ အဲ့ course လေးမှာတော့ video 7 ခုရှိပြီးတော့ Auto Layout ကို ရှယ်သုံးပြပေးသွားမှာဖြစ်ပါတယ်။ ကြည့်ပဲမကြည့်ပဲ လိုက်လုပ်ကြည့်မယ်ဆိုရင် အဲ့ Course လေးပြီးသွားတာနဲ့ စောနက နားလည်ရနည်းနည်းခက်တယ်လို့ပြောတဲ့ Constraints and Resizing properties ကိုလဲ နားလည်သွားမှာဖြစ်ပါတယ်။

ဒါကတော့ course link ပါ။
https://tinyurl.com/auto-layout-crash-course

ဒါကတော့ admin practice လိုက်လုပ်ထားတဲ့ result ပါ။
https://tinyurl.com/al-practice

လေ့လာရတာ အဆင်ပြေမယ်လို့မျှော်လင့်ပါတယ်ဗျ။ တကယ်လို့ English လိုမို့ လေ့လာရအဆင်မပြေဘူး၊ video တွေလုပ်ပေးစေချင်တယ်ဆိုရင်‌လဲ comment မှာပြောခဲ့ပေးလို့ရပါတယ်။ ဟုတ်ပါပြီ။ ကျွန်တော် ဒီ post လေးက‌ိုတော့ ဒီမှာပဲရပ်ပါမယ်။ ဒီ post လေးကနေ ကိုယ့်အတွက်တစ်ခုခု ရသွားတယ်လို့ ယူဆရင် share သွားပေးပါဦးဗျ။ အချိန်ယူဖတ်ပေးတဲ့အတွက် ကျေးဇူးတင်ပါတယ်ဗျာ။

အခု content ကိုရေးသားတာကတော့ Duo Design Lab က ကျွန်တော် Admin 311 ဖြစ်ပါတယ် 👻။

မင်္ဂလာပါဗျာ ဒီနေ့မှာတော့ ကျွန်တော် ဒီ၂၀၂၀မှာ တင်ခဲ့တဲ့ Graphic Design နဲ့ပတ်သတ်တဲ့ Post တွေထဲက လူကြိုက်အများဆုံးဖြစ်ခဲ့...
30/12/2020

မင်္ဂလာပါဗျာ ဒီနေ့မှာတော့ ကျွန်တော် ဒီ၂၀၂၀မှာ တင်ခဲ့တဲ့ Graphic Design နဲ့ပတ်သတ်တဲ့ Post တွေထဲက လူကြိုက်အများဆုံးဖြစ်ခဲ့တဲ့ Post တွေရဲ့ Link တွေကို စုပြီးပြန်တင်ပေးလိုက်ပါတယ်ဗျာ။

Free Graphic Design Course, Canva Design School
facebook.com/duodesignlab/posts/124173342626651

How To Create Unified Designs
facebook.com/duodesignlab/posts/126424405734878

Balance In Graphic Design
facebook.com/duodesignlab/posts/133904894986829

Color Harmony
facebook.com/duodesignlab/posts/140180531025932

Type Classifications
facebook.com/duodesignlab/posts/155043632872955

Facebook Post Dimensions
facebook.com/duodesignlab/posts/156576702719648

Font Pairs With W Art Fonts
facebook.com/duodesignlab/posts/159493675761284

How To Start Learning Graphic Design
facebook.com/duodesignlab/posts/170040228039962

Postလေးကတော့ ဒီလောက်ပါပဲဗျာ။ နည်းနည်းပဲဖြစ်ဖြစ်အသုံးဝင်သွားတယ်ဆိုရင် ကျေနပ်ပါတယ်။ ကျွန်တော်တို့တင်တဲ့ Post တွေကိုအချိန်ယူဖတ်ပေးကြတဲ့ သူတွေအားလုံးကိုလည်း ကျေးဇူးတင်ပါတယ်ဗျာ။

ဒီContent ကိုရေးသားတာကတော့ Duo Design Lab ကကျွန်တော် Admin Auston ဖြစ်ပါတယ်။

အခုဆိုရင်တော့ ကျွန်တော်တို့ Page လေး Like 3K ပြည့်သွားပါပြီ။ကျွန်တော်တို့ Post တွေကို ဖတ်ပေးကြတဲ့ သူတွေတစ်ယောက်ချင်းစီကိ...
29/12/2020

အခုဆိုရင်တော့ ကျွန်တော်တို့ Page လေး Like 3K ပြည့်သွားပါပြီ။ကျွန်တော်တို့ Post တွေကို ဖတ်ပေးကြတဲ့ သူတွေတစ်ယောက်ချင်းစီကိုကျေးဇူးတင်ပါတယ်ဗျာ။

နောက်လည်း အသုံးဝင်မယ့် Post လေးတွေ မျှဝေပေးသွားမှာမို့လို့ဆက်လက်အားပေးကြပါဦးဗျ။

Review of 2020, Most Popular Postမင်္ဂလာပါဗျာ ကျွန်တော် ဒီနေ့မှာတော့ ဒီ၂၀၂၀မှာ တင်ခဲ့တဲ့ Post တွေထဲက လူကြိုက်အများဆုံးတွ...
28/12/2020

Review of 2020, Most Popular Post

မင်္ဂလာပါဗျာ ကျွန်တော် ဒီနေ့မှာတော့ ဒီ၂၀၂၀မှာ တင်ခဲ့တဲ့ Post တွေထဲက လူကြိုက်အများဆုံးတွေဖြစ်ခဲ့တဲ့ Post တွေရဲ့ Link တွေကို စုပြီးတင်ပေးလိုက်ပါတယ်ဗျာ။ ဒီအပိုင်းကတော့ Web Design နဲ့ပတ်သတ်တာလေးတွေပေါ့။ like တွေထောင်ချီနေတာမဟုတ်ပေမယ့် ကျွန်တော်တို့ထင်ထားတာထက် engagement ကောင်းခဲ့တဲ့ post လေးတွေပေါ့ဗျာ။

1. UIUX Design Tools You Need To Master (at least ONE)
facebook.com/duodesignlab/posts/125358169174835

2. Free Resources To Learn Web Design & Development
facebook.com/duodesignlab/posts/132987701745215

3. Webflow (a powerful website builder )
facebook.com/duodesignlab/posts/137564031287582

4. Before You Design A Website
facebook.com/duodesignlab/posts/139351564442162

5. Learn Figma For Free
facebook.com/duodesignlab/posts/157275379316447

6. Neumorphism
facebook.com/duodesignlab/posts/160372922340026

7. Web Design Inspirations
facebook.com/duodesignlab/posts/164399925270659

8. Chrome Extensions For Designers
facebook.com/duodesignlab/posts/195281592182492

9. Prototyping In Figma
facebook.com/duodesignlab/posts/201561861554465

Postလေးကတော့ ဒီလောက်ပါပဲဗျာ။ နည်းနည်းပဲဖြစ်ဖြစ်အသုံးဝင်သွားတယ်ဆိုရင် ကျေနပ်ပါတယ်။ ကျွန်တော်တို့တင်တဲ့ Post တွေကိုအချိန်ယူဖတ်ပေးကြတဲ့ သူတွေအားလုံးကိုလည်း ကျေးဇူးတင်ပါတယ်ဗျာ။

ဒီContent ကိုရေးသားတာကတော့ Duo Design Lab ကကျွန်တော် Admin 311 ဖြစ်ပါတယ်။

Address

Naypyidaw

Website

Alerts

Be the first to know and let us send you an email when Duo Design Lab posts news and promotions. Your email address will not be used for any other purpose, and you can unsubscribe at any time.

Contact The Business

Send a message to Duo Design Lab:

Shortcuts

Share

Category