NEWMEN NEWMEN
MENU
8 May 2015
စကားပြောခြင်း အနုပညာကို Design မှာဘယ်လိုအသုံးချမလဲ

ကျွန်တော်တို့က Web Projects တွေလုပ်နေတာဆိုတော့... Web Design ပေါ့ဗျာ.... Interface တိုင်းမှာ...အဓိကကျတာက... Conversation(စကားပြောဆိုခြင်း) ဆိုတာပါ... Users တွေကိုကိုယ်လိုချင်တဲ့...ပုံစံအတိုင်းပြုမူလုပ်ဆောင်စေဖို့... ပညာပေးတဲ့အနေနဲ့...ထိတွေ့ပြောဆိုမလား... ဖျော်ဖြေရေးအနေနဲ့ ဆက်ဆံမလား...ဒါမှမဟုတ်..စည်းရုံးသိမ်းသွင်းမလား... ကိုအပြင်မှာတွေ့တဲ့ သူငယ်ချင်း...ဒါမှမဟုတ် သူစိမ်းတစ်ယောက်ကိုတောင်...စိတ်အားထက်သန်စွာပြောကြတယ်...စိတ်ဝင်စားမှုရှိလာအောင်ပြောဆိုကြတယ်ဗျာ...။

Web Design မှာ... Conversation က... User Interactions တွေရဲ့...အခြေခံပါပဲ...မယုံဘူးလားဗျ...မယုံရင်တော့...ဥပမာလေးတွေနဲ့ပြောကြည့်မယ်ဗျာ..

(၁) Home Page - ကျွန်တော်တို့အနေနဲ့ တစ်ယောက်ယောက်ကိုတွေ့လိုက်တယ်ပေါ့...ပြီးတော့ ကိုယ်ဘာတွေလုပ်လဲသူ့ကိုရှင်းမယ်ဗျာ...အဲဒီမှာ...သူတို့ကြုံ တွေ့ဖူးတာထဲက တစ်ခုခုနဲ့...ကိုယ့်အလုပ်ကိုစပ်ဆက်ပြီး ရှင်းနိုင်မယ့် နည်းရှိရင်တော့ အကောင်းဆုံးပဲ...ကိုယ့်အလုပ်ကို..သူတို့မေ့မှာမဟုတ်တော့ဘူး... ။

(၂) Contact Form - ဒါလေးကတော့..ကျွန်တော်တို့..တစ်စုံတစ်ယောက်ရဲ့လိုအပ်ချက်ကိုသိပြီးတော့သူတို့ကိုကူညီပေးဖို့ကြိုးစားတာပါ...။ သူတို့ဆီကို ကျွန်တော်တို့ Reply ပြန်တာဘယ်လောက်ကြာမလဲဆိုတဲ့ အချိန်လေးနဲ့တောင်သူတို့ရဲ့ Expectations ကို... manage လုပ်နိုင်တယ်...။

(၃) Product Page - ဒါကတော့..ကျွန်တော်တို့ရဲ့ Product ( သို့ ) Service ကဘာလဲပေါ့...ဘာတွေလုပ်တယ်...သူတို့အတွက်ဘာတွေအကျိုးဖြစ်စေတယ်ဆိုတာကို ရှင်းပြပေးတာပါ...။ တကယ်လို့..သူကဘယ်လိုလူမျိုးလဲဆိုတာ...သိထားနိုင်ရင်... ကိုကဦးဆောင်ပြီးစကားပြောသွားလို့ရတယ်... နောက်ဆုံးသူတို့ဘာတွေမေးရင် ဘာဖြေရမလဲဆိုတာတောင်..လွယ်လွယ်ကူကူ ပြင်ဆင်ထားလို့ရတယ်.... ။

အခုလိုမျိုး... Interfaces တွေကို Conversations အနေနဲ့ ချဉ်းကပ်မယ်ဆိုရင်...လူအချင်းချင်းမဟုတ်တောင်...ပိုပြီးလူသားဆန်လာမယ်...နောက်ပြီး..User Experiences ( UX ) ပိုကောင်းလာမယ်.... အဲဒါဆိုရင် ကျွန်တော်တို့...Content Writing လုပ်ရင်တောင်... ဘာတွေရေးမယ်ဆိုတာထက်...ဘယ်လိုရေးရမလဲဆိုတာ... focus လုပ်ဖို့ ကူညီပေးတယ်...။

ကိုယ်ပြောမယ့်စကားတွေကို နားထောင်တဲ့သူသေချာနားလည်အောင်ဘယ်လိုပြောကြမလဲပေါ့...။ Content Strategy လို့ခေါ်ပါတယ်...။ Designing With Web Standards ဆိုတဲ့စာအုပ်ကိုရေးတဲ့လူပြောတာ ပိုစိတ်ဝင်စားဖို့ကောင်းတယ်ဗျ..။

Content precedes design. Design in the absence of content is not design, it's decoration. " _ Jeffery Zeldman

ကျွန်တော်တို့ အနေနဲ့...Website တစ်ခု Design စလုပ်တယ်ဆိုပါစို့...။ ကိုယ့်ကို ... Client က သူ့ Website မှာပါမယ့်... Content တွေကို အကုန်မပေးဘူးဗျာ ( ကျွန်တော်တို့..Web Projects တွေမှာ... ကြုံ နေကြအတိုင်း... ။ အဲမှာ ကျွန်တော်တို့... Lorem Ipsum ဆိုတဲ့...ဘာအဓိပ္ပယ်တွေမှန်း...မသိတဲ့ Latin Texts တွေနဲ့...Gray Boxs တွေကိုသုံးပြီး... Client ကို ပြဖို့ ကြိုးစားရတော့တာပဲ...။ ( အဲဒါမှလဲ Design က မြန်မြန်ပြတ်မယ် မဟုတ်လား...ဒါပေမယ့်...သေချာတာကအဲဒီ.. Latin Text တွေမှာက...အဓိပ္ပယ်မရှိး...အကြောင်းအရာ မပါဘူး..။ ကျွန်တော်တို့ ပြချင်တဲ့ .. Design နဲ့ Content ကြားမှာ...နည်းနည်းပဲ...ဆက်သွယ်မှု ရှိတယ်..။

ကျွန်တော်တို့ Lorem Ipsum ဆိုတဲ့ Latin Text တွေကို...Design မှာတကယ်သုံးမယ့်... Approved Copy မရခင်... Interface တစ်ခု Design လုပ်နေရင်...Progress မြန်အောင်လို့...Tool အနေနဲ့ အမြဲသုံးဖြစ်ကြတယ်...။ ဘာလို့လဲဆိုတော့ ကျွန်တော်တို့က ကျောက်တုံး၊ ကျောက်ခဲတွေအပေါ်မှာ... ပုံဖော်နေကြတာမှမဟုတ်ဘဲ...။ Software သုံးပြီးပုံဖော်ကြတာလေ...ကိုဖတ်ချင်တာနဲ့ စရေးပြီးနောက်ပိုင်း...ပြန်ပြောင်းနိုင်တယ်လေ...။ စကားလုံးတွေမှာ ပါဝါ ရှိတယ်ဗျ..။ သူတို့က ကိုယ်တွေရဲ့ အသိဉာဏ်ကို ထုံထိုင်းသွားစေသလို...အသိအမြင်တွေ... ပွင့်လင်းသွားအောင်လည်း လုပ်နိုင်တယ်...။

အကြောင်းအရာ တစ်ခုကို ပုံဖော်တော့မယ်ဆိုရင်...ဘာကိုရေးမယ်ဆိုတာရော...အဲဒါကိုဘယ်လိုရေးမလဲဆိုတာပါ...စဉ်းစားဖို့လိုပါတယ်..။ Content Strategist တစ်ယောက်ဖြစ်တဲ့ Stephanie Hay က Design အစမှာကတည်းက...Copy Driven Interfaces နဲ့ချဉ်းကပ်မယ်ဆိုရင်...ပိုအောင်မြင်မယ်ဆိုတာ မြင်ခဲ့တယ်...။ သူက Design Process အစမှာကတည်းက...Real Copy ကိုသုံးပြီး... Client နဲ့အပြန်အလှန်ဆက်သွယ်ပြီး..လုပ်ခဲ့တယ်...။ အဲလို ထိထိရောက်ရောက်လုပ်နိုင်ဖို့... သူက Guidelines တွေသတ်မှတ်ထားတယ်...။

၁။ Interfaces အများစုကို... Real Copy နဲ့ပဲရေးဖို့... Focus လုပ်ပါ...။

၂။ Structure နဲ့ Flow ကိုမစဉ်းစားနဲ့...။ - Topic တစ်ခုခြင်းဆီပေါ်မှာ...Users တွေနဲ့ အပြန်အလှန်ပြောမယ့်...Real Conversation ကဘာလဲ...။ - Users တွေမေးလာမယ့် Questions တွေကို ရှင်းရှင်းလင်းလင်းဖြေနိုင်ဖို့ ဘယ်လိုပြင်ဆင်မလဲ...။ - User နာလည်သွားအောင်ပြောပြီးရင်...နောက်ဆုံ.. End Result ကဘာဖြစ်မလဲ... Sign Up Button လား...။

၃။ ကိုယ့်မှာရှိတဲ့ Target Audiences တွေနဲ့ပြောမယ့်စကားတွေကို ဖော်ပြမယ့်... Content တွေကိုပဲ ဖန်တီးပါ...။ တကယ်လို့ဗျာ...ထားပါတော့...ဥပမာကျွန်တော်တို့... အခု Website မှာ အိမ်မွေးခွေးလေးတွေအတွက် Biscuits ဝယ်မယ့်...Potential Client တစ်ယောက်ရဖို့... ရည်ရွယ်မယ်ဗျာ...။ ( အဲလူကို Sam လို့ခေါ်ရအောင်..)

ကျွန်တော်တို့ ပြောမယ့် Conversation က ဒီလိုဖြစ်မယ်ထင်တယ်...။ ၁။ ခွေးလေးတွေစားတဲ့ .. Biscuits မှာဘာတွေပါတယ်ဆိုပြီး အရင် ရှင်းပြမယ်ဗျာ...။ ၂။ Sam ရဲ့..ခွေးစားမယ့်... Biscuits ထဲမှာ ခွေးတွေအတွက် သင့်တော်မယ့်...သဘာဝ အသီးအနှံတွေနဲ့လုပ်ထားတဲ့ အကြောင်းတွေပြောတာပေါ့ဗျာ...။ ၃။ နောက်ပြီးမှ...သူ့အတွက် Time Limit လုပ်ထားတဲ့...Trial Order Free Sample Pack တစ်ခုကို Shipping Free ပါလုပ်ပြီး..ပို့ပေးမယ်ဆိုပြီး..ကမ်းလှမ်းလိုက်မယ်ဗျာ...။ မကောင်းဘူးလား..။ ၄။ ဒါပေမယ့်...ကျွန်တော်တို့ Biscuits ကို Sam ရဲ့ ခွေးလေးက မကြိုက်ဘူဆိုရင်လဲ...ကျွန်တော်တို့က ယုံယုံကြည်ကြည်နဲ့...Refund ပြန်ပေးမယ်ဆိုတာကို Sam သိစေရမယ်...။ ကောင်းတယ်နော်...။ ၅။ တကယ်လို့ Sam ကသာဝယ်လိုက်ပြီဆို..ကျွန်တော်တို့က တစ်ပတ်ကြာရင်..သူ့ရဲ့ အခြေအနေ ဘယ်လိုရှိလဲဆိုတာ...သိအောင် Follow Up လိုက်မယ်ဗျာ...။ ကျွန်တော်တို့က သူ့ကို Subscription တစ်ခုစနိုင်အောင် ကမ်းလှမ်းမယ်...။ ဟား...မလွယ်ဘူးလားဗျာ....။ ၆။ Sam သာ...Subscription ကိုလုပ်လိုက်ပြီဆိုရင်...ကျွန်တော်တို့က Biscuits နမူနာ အထုတ်လေးတွေကို...ပို့ပေးမယ်...။ Sam ကိုလည်း..တခြားသူ့ရဲ့..သူငယ်ချင်းတွေကို ဒီအကြောင်း Share ပေးဖို့ပြောမယ်ဗျာ...။ ကဲ ဒါကတော့... ကျွန်တော်တို့က Sam ကိုရစေချင်တဲ့ User Experience ( UX ) ကို လွယ်ကူစေမယ့် နည်းလမ်းလေးပါ...။ ကျွန်တော်တို့ Design လုပ်မယ့် Pages တွေရော..သူ့ကိုပို့ပေးမယ့်..Emails တွေအတွက်ရောကို Real Copy ထွက်လာဖို့.. Design Frame လေးတစ်ခုလဲဖြစ်နေပြန်ရောဗျ...။ ဘာလို့လဲဆိုတော့ ကျွန်တော်တို့အနေနဲ့ Sam ကိုပြောချင်တဲ့စကားတွေရယ်...သူ့အနေနဲ့...ဘယ်လို... User Interactions ( ဥပမာ..Sign Up ) တွေကို လုပ်စေချင်လဲဆိုတာ ... မျှော်လင့်လို့ရတယ်ပေါ့ဗျာ...။

ဒါလေးဖတ်ပြီး Design မှာဖြစ်ဖြစ်.. Production မှာဖြစ်ဖြစ်...ဆုံးဖြတ်ချက်တွေချဖို့အတွက်...User Experiences ( UX ) ကို Conversation အနေနဲ့ ပုံဖော်ထုဆစ်ကြည့့်ရင်...အသုံးဝင်နိုင်တာပေါ့ဗျာ...။ အမှန်ကတော့... Web Design မှာဆရာကြီး လေးပါးရှိတယ်ဗျ...။

၁ ။ Content
၂ ။ Markup
၃ ။ Design
၄ ။ Interaction

Content ကတော့ Foundation ပါ...။ ဒီဆရာကြီးတွေကို.. Progressive Enhancement Checklist လို့ခေါ်ပါတယ်..။

I believe you can make a good living doing work you love.
Just a sec.