Web Application များအတွက် User Interface Design

ဒီဆောင်းပါးက ကိုဒီဘီရဲ့ ကောင်းမှုနဲ့ ရလာတဲ့ စာအုပ်ထဲက တစ်ခန်းကို အမှီပြုပြီး ရေးသားထားတာ ဖြစ်ပါတယ်။ အရမ်းကောင်းတဲ့ စာအုပ်တစ်အုပ်ပါ။ စာအုပ်တန်ဖိုး ၂၉ ဒေါ်လာထက် အများကြီး တန်ဖိုးရှိတဲ့ စာအုပ်တစ်အုပ် ဖြစ်ပါတယ်။ ကျွန်တော် ဖတ်ကြည့်ရင်း Web Design, Application Design လေ့လာသူများအတွက်ပါ အများကြီး အထောက်အကူ ပြုစေမှာ ဖြစ်တဲ့အတွက် ကြိုးစားပြီး ပြန်လည်ရေးသား မျှဝေရခြင်း ဖြစ်ပါတယ်။ ဖတ်ရတာ အဆင်မပြေဘူး ဆိုရင်တော့ မူရင်းစာအုပ်ကို ဖတ်ရှုပါလို့ ညွှန်းလိုပါတယ်။ E-Book အနေနဲ့ ထုတ်ထားတာ မရှိပဲ Printed Book အနေနဲ့သာ ရရှိနိုင်မှာ ဖြစ်ပါတယ်။ Smashing Book လို့ အမည်ရပါတယ်။ ဒါပေမယ့် အခု အခန်းကိုတော့ နမူနာအနေနဲ့ ရနိုင်ပါတယ်။

User Interface Design ဆိုတာ ဘာလဲ၊ User Interface Design တစ်ခု ထိရောက် အောင်မြင်တယ်ဆိုတာ ဘာတွေ ပါလို့လဲ၊ အဲဒီထက် ပိုအရေးကြီးတာက ကောင်းမွန်တဲ့ User Interface တစ်ခုကို ဘယ်လို တည်ဆောက်မလဲ။ ဒီဆောင်းပါးမှာ သီအိုရီပိုင်းရော လက်တွေ့ပိုင်းပါ နှစ်ခုလုံးရေးသွားမှာ ဖြစ်ပါတယ်။

User Interface Design ဆိုတာ ဘာလဲ

Product (ထုတ်ကုန်)တစ်ခုနဲ့ ပတ်သက်ပြီး လုပ်ငန်းဆောင်တာများ ဆောင်ရွက်သည့် နည်းလမ်း၊ ဘယ်လိုလုပ်တယ်၊ ဘယ်လို တုန့်ပြန်တယ် ဆိုတာကို User Interface လို့ ခေါ်ပါတယ်။

ဂျက်(ဖ်)ရက်စကင်

User Interface လို့ ပြောလိုက်ရင် buttons တွေ menus တွေကို ပြေးမြင် မိကြပါလိမ့်မယ်။ တကယ်တော့ User Interface ဆိုတာ အဲဒီလို အမြင် သဘောတရားတွေထက် အသုံးပြုသူ User နဲ့ Application ဒါမှမဟုတ် ကိရိယာ (device) တို့ အပြန်အလှန် ဆက်သွယ် ဆောင်ရွက်မှုတွေကိုသာ User Interface လို့ ဆိုနိုင်မှာ ဖြစ်ပါတယ်။ နေရာ အတော်တော် များများမှာ တစ်ဦးထက်ပိုတဲ့ အသုံးပြုသူများဟာ ကိရိယာများ၊ Application များကို အသုံးပြုနေကြမှာ ဖြစ်ပါတယ်။ ဒီတော့ User Interface ဆိုတာ Product က ဘယ်လိုပုံစံရှိတယ် ဆိုတာထက် ဘယ်လိုအလုပ်သလဲ ဆိုတဲ့ အပေါ်မှာ ပိုပြီး မူတည်ပါတယ်။ အဲဒီလိုပါပဲ buttons တွေ အရောင်တွေ ဘယ်လိုရွေးမယ် ဆိုတာထက် မှန်ကန်တဲ့ tool ကို ရွေးချယ်ဖို့က ပိုအရေးကြီးပါတယ်။

User Interface နဲ့ ပတ်သက်လာရင် စဉ်းစားရမယ့် ပုံစံ တစ်ခုကို လေ့လာကြည့်ရအောင်၊ ဒီ Interface မှာ button တွေ လိုလို့လား၊ လိုတယ်ဆိုရင် ဘာအတွက်လိုတာလဲ၊ အဲဒီလို button ကို ထည့်လိုက်ရင် အသုံးပြုသူတွေ အနေနဲ့ ဘယ်လို နားလည်ပြီး၊ ဘယ်လို အထောက်အပံ့ပေးမှာလဲ၊ application ဒါမှမဟုတ် device အတွက် ဘယ်လို ပံ့ပိုးမှုတွေ ပေးနိုင်လဲ၊ ဒီ buttons တွေထည့်လိုက်တာနဲ့ ကိုယ်လုပ်ချင်တဲ့ အလုပ်တွေ လုပ်နိုင်မှာလား စသည်ဖြင့် စဉ်းစားရပါမယ်။ ဒီနေရာမှာ ဘာကြောင့် ခွဲခြားပြောနေရသလဲဆိုရင် User Interface လို့ ဆိုလိုက်တာနဲ့ button လေးတွေကို လှအောင်၊ menu လေးတွေကို လှအောင် စသည်ဖြင့် နည်းလမ်းမျိုးစုံနဲ့ ကြိုးစားတဲ့ဖက်ကို အာရုံကျတတ်လို့ပဲ ဖြစ်ပါတယ်။

Product တစ်ခု (ဥပမာ – Web Application) စတင် ထုတ်လုပ်တော့မယ် ဆိုရင် User Interface Design ချတဲ့ ကိစ္စကို Development Life Cycle ရဲ့ အစောပိုင်း ကာလတွေမှာ လုပ်ဆောင်ရလေ့ရှိပြီး အရေးအကြီးဆုံး အခန်းကဏ္ဍထဲမှာ ပါဝင်ပါတယ်။ ဘာကြောင့် အဲဒီလောက် အရေးပါရသလဲ ဆိုတာကို လေ့လာ ကြည့်မယ်ဆိုရင် ကိုယ်ရေးလိုက်မယ့် Web Applicaton တစ်ခုကို အသုံးပြုမယ့် Customer တွေနဲ့ တိုက်ရိုက် ထိတွေ့ရမယ့် အပိုင်းဟာ User Interface ဖြစ်တာ ကြောင့်ပါ။ Customer အနေနဲ့ အထဲမှာ ဘယ်လို တည်ဆောက် ထားတယ်ဆိုတာကို သိမှာမဟုတ်ပါဘူး။ ကိုယ့်အနေနဲ့ အတွင်းပိုင်း နည်းပညာတွေကို ဘယ်လောက်ပဲ ပြန်လန်နေအောင် တည်ဆောက်ထားပါစေ၊ User Interface က မကောင်းရင် ဘယ်သူမှ သုံးမှာမဟုတ်ပါဘူး။ (User Interface မကောင်းဘူးဆိုတဲ့ နေရာမှာ User Interface မလှဘူးလို့ ဆိုလိုတာ မဟုတ်ပါဘူး၊ လှတာ မလှတာထက် သုံးတဲ့သူအတွက် ထိရောက်မှု ရှိတာ မရှိတာနဲ့ တိုင်းတာပါတယ်) ဒါကြောင့် User Interface ဆိုတာ Product လို့တောင် ဆိုလို့ရနိုင်ပါတယ်။ User Interface ကသာ မိမိရဲ့ Customer များကို စိတ်ကျေနပ်မှုတွေ ပေးနိုင်မှာဖြစ်ပြီး ဘယ်လောက် သုံးရအဆင်ပြေတယ်၊ ဘယ်လောက် သုံးရလွယ်တယ် စတာတွေက စကားပြောသွားမှာ ဖြစ်ပါတယ်။ ဒါကြောင့် Product တစ်ခု ဖန်တီးတော့မယ်ဆိုရင် User Interface Design အဆင့်ကို အရင်ပြုလုပ် ဖန်တီးပြီး နောက်မှ Back-end engine ဖြစ်တဲ့ Coding စတာတွေကို  လုပ်တာဖြစ်ပါတယ်။ တကယ်တန်း ပြောရမယ်ဆိုရင် Back-end Processes တွေအားလုံးဟာ Front-end ဖြစ်တဲ့ User Interface ကို ကောင်းကောင်းမွန်မွန် လည်ပတ်နိုင်အောင် ပံ့ပိုးပေးတဲ့ အပိုင်းပဲ ဖြစ်ပါတယ်။

ပြောင်မြောက်တဲ့ User Interface

Product တစ်ခုရဲ့ User Interface ကို မတည်ဆောက်ခင်မှာ အရင်ဆုံး ကောင်းမွန်တဲ့ User Interface တွေရဲ့ ဂုဏ်သတ္တိတွေကို အရင်နားလည်ထားဖို့ လိုပါတယ်။ ကိုယ် တည်ဆောက်မယ့် User Interface မှာ ဘယ်လို အရည်အသွေးတွေ ရှိအောင် တည်ဆောက်ရမလဲ ဆိုတဲ့ အပိုင်းကို လေ့လာကြည့်ရအောင်။ အင်မတန်ကောင်းမွန် ပြည့်စုံတဲ့ User Interface တိုင်းမှာ အောက်မှာ ဖော်ပြမယ့် အချက် (၈)ချက်နဲ့ ပြည့်စုံတာ တွေ့ရပါလိမ့်မယ်။

(၁) ရှင်းလင်းလွယ်ကူခြင်း

ဘာသာစကား၊ စီးဆင်းမှု၊ ချိတ်ဆက်ပုံ အဆင့်ဆင့်နဲ့ Visual Element (ရုပ်ပုံများ၊ အသံ၊ ဗီဒီယို စသည်) တို့ရဲ့ ဆိုလိုရင်နဲ့ ကိုက်ညီမှု အားလုံးကို ရှုပ်ထွေးမှု မရှိပဲ User Interface Design တစ်ခုကို အရှင်းလင်းဆုံး အလွယ်ကူဆုံး ဖြစ်အောင် တည်ဆောက် ထားပါတယ်။ ရှင်းလင်းတဲ့ User Interface ဟာ အသုံးပြုပုံစာအုပ် ဖတ်စရာမလိုဘူးလို့ အဆိုရှိပါတယ်။ အဲဒီလို ရှင်းလင်းတဲ့ User Interface တွေဟာ အသုံးပြုသူတွေကို အမှားအယွင်း နည်းအောင်လည်း အထောက်အပံ့ ပေးပါတယ်။

(၂) တိကျပြတ်သားခြင်း

Interface တစ်ခု ရှင်းလင်းလွယ်ကူစေဖို့ နေရာတိုင်းမှာ ရှင်းလင်းချက်တွေ၊ Label တွေ အများကြီး လျှောက်တတ်လို့ ရပါတယ်။ ဒါပေမယ့် အဲဒီလို လုပ်လိုက်မယ်ဆိုရင် Interface ကို အချက်အလက်တွေ ဖောင်းပွသွားစေပါတယ်။ အဲဒီအပြင် Screen မှာ အချက်အလက်တွေ အများကြီးနဲ့ ရှုပ်ထွေးသွားစေပါတယ်။ ရှာဖွေတဲ့နေရာမှာလည်း အခက်အခဲတွေ ဖြစ်ပေါ် စေပါတယ်။ အဲဒီလိုသာဆိုရင် အသုံးပြုသူတွေ စိတ်ပျက်သွားမှာ အသေအချာပါပဲ။ ဒါကြောင့် ရှင်းလင်း လွယ်ကူဖို့ တစ်ဖက်ကလည်း တည်ဆောက်ရမှာ ဖြစ်သလို တစ်ဖက်ကလည်း တိကျပြတ်သားအောင်၊ မလိုအပ်တာတွေ မပါအောင် တည်ဆောက်ရမှာ ဖြစ်ပါတယ်။

(၃) ရင်းနှီးခြင်း

User Interface Design တစ်ခုဟာ အသုံးပြုသူတွေကို ရင်းနှီးအောင် စွမ်းဆောင်နိုင်ဖို့လည်း လိုပါတယ်။ အဲဒီလို User Interface ကို ရင်းနှီးအောင် ဆောင်ရွက်တဲ့ နေရာမှာ နည်းလမ်းတွေ မျိုးစုံရှိပါတယ်။ အဓိက အားဖြင့် အသုံးပြုသူ အနေနဲ့ button လေးကို မြင်လိုက်ရင်ပဲ ဖြစ်ဖြစ်၊ Icon လေးကို မြင်လိုက်ရင်ပဲ ဖြစ်ဖြစ် ဘာကို ဆိုလိုတယ်၊ ဘယ်နေရာမှာ သုံးတယ်ဆိုတာကို အလွယ်တကူသိပြီး ရင်းနှီးပြီး ဖြစ်နေဖို့ လိုပါတယ်။ ဥပမာ အနေနဲ့ ပြောရမယ်ဆိုရင် အီးမေးလ Icon လေးကို အသုံးပြုခြင်းအားဖြင့် Email ပို့တဲ့ နေရာမှာ သုံးတယ်ဆိုပြီး အလွယ်တကူ သိနိုင်ပါတယ်။ အဲဒီလိုမှ မဟုတ်ပဲ လူအများ မရင်းနှီးတဲ့ Icon ပုံစံတစ်ခုကို သွားသုံးမယ်ဆိုရင် အဆင်ပြေမှာ မဟုတ်ပါဘူး။

(၄) လျှင်မြန်စွာ တုန့်ပြန်နိုင်ခြင်း

ဒီနေရာမှာ အချက်နှစ်ချက် လိုအပ်ပါတယ်။ ပထမ တစ်ချက်က Speed (မြန်နှုန်း)ပါ။ ကောင်းမွန်တဲ့ Interface တွေမှာ နှေးတယ်လို့ ခံစားရတာမျိုး မဖြစ်စေသင့်ပါဘူး။ (လိုသည်ထက် ပိုပြီး နှေးနေတာကို ဆိုလိုပါတယ်) ဒုတိယ အချက် အနေနဲ့ User Interface တစ်ခုမှာ အသုံးပြုသူ အနေနဲ့ ဘာလဲလုပ်လုပ်၊ ဘာပဲ သုံးသုံး သူတို့ အသုံးပြုမှု အပေါ်မူတည်ပြီး ဘာလုပ်လိုက်တယ်၊ ဘာတော့ ဖြစ်သွားပြီ စသည်ဖြင့် Feedback ပြန်ပေးနေဖို့ လိုပါတယ်။ အဲဒီလို Feedback System ကို ကောင်းမွန်စွာ စီစဉ်ထားမှသာ User အနေနဲ့ သူတို့ လုပ်ဆောင်ချက် ပြီးမြောက်မှု ရှိမရှိ သိနိုင်မှာ ဖြစ်ပါတယ်။

(၅) ညီညွှတ်မှု ရှိခြင်း

User Interface တစ်ခု တည်ဆောက်တဲ့ နေရာမှာ ညီညွှတ်မှုရှိဖို့က အင်မတန်အရေးကြီးပါတယ်။ ရှေ့စာမျက်နှာမှာ ပုံစံတစ်မျိုး နောက် စာမျက်နှာမှာ ပုံစံတစ်မျိုးဆိုရင် အသုံးပြုသူတွေအတွက် အသုံးပြုအညွှန်းကို ဖန်တီးပေးနိုင်မှာ မဟုတ်တော့ပါဘူး။ ညီညွှတ်မှုရှိတဲ့ User Interface တစ်ခု တည်ဆောက်ဖို့ ဆိုရင် အရာအားလုံးဟာ ညီညွှတ်မျှတ နေဖို့ လိုပါတယ်။ အသုံးပြုသူ အနေနဲ့ တစ်နေရာမှာ သင်ယူလိုက်တဲ့ အသုံးပြုပုံ စနစ်ဟာ နေရာတိုင်းမှာ ပြန်လည် အသုံးပြုနိုင်ဖို့ လိုပါတယ်။ စာမျက်နှာ တစ်မျက်နှာဖွင့်လိုက်တိုင် ဘာမှထူးထူးခြားခြားလည်း မရှိပဲနဲ့ ပုံစံမျိုးစုံ ပြောင်းနေမယ်ဆိုရင် အသုံးပြုသူ အနေနဲ့လည်း လိုက်သင်နေရမှာ ဖြစ်တဲ့အတွက် ငြီးငွေ့သွားပါလိမ့်မယ်။

(၆) အနုပညာမြောက်ဖန်တီးမှုရှိခြင်း

သူ့အလုပ် သူလုပ်ရင်ပြီးရော စွဲဆောင်မှု မရှိလည်း နေပါစေဆိုရင် User Interface အတွက် မပြည့်စုံပါဘူး။ အနုပညာမြောက် ဖန်တီးမှုရှိပြီး ကြည့်ကောင်းတဲ့ User Interface တွေဟာ အသုံးပြုသူတွေကို ကြာကြာသုံးချင်အောင် ဆွဲဆောင်နိုင်စွမ်း ရှိပါတယ်။ Interface Design ကို အနုပညာမြောက် ဖန်တီးနိုင်စွမ်းရှိတဲ့ Product တွေဟာ အသုံးပြုသူတွေ ပျော်ရွှင်မှု၊ စိတ်ချမ်းသာမှုတွေကို ပေးစွမ်းနိုင်စွမ်း ရှိပါတယ်။ Apple ရဲ့ Interface Design တွေဟာ အနုပညာမြောက် ဖန်တီးမှုတွေ ဖြစ်တဲ့အတွက်ကြောင့် လူတွေ ဘယ်လောက်အထိ အရူးအမူး ကြိုက်နှစ်သက်ကြတယ် ဆိုတာ တွေ့နိုင်မှာ ဖြစ်ပါတယ်။

(၇) အချိန်ကုန်သက်သာခြင်း

အချိန်သည် ငွေဖြစ်သည်လို့ အဆိုရှိပါတယ်။ ဒါကြောင့် ကောင်းမွန်တဲ့ Interface Desgn တွေဟာ အသုံးပြုသူတွေရဲ့ အချိန်ကို ဖြုန်းတီးလေ့ မရှိပါဘူး။ အချိန်နည်းနည်းနဲ့ အလုပ်မျုားများပြီးတဲ့ ပုံစံကို အဓိကထား ချဉ်းကပ်ရေးဆွဲ ကြပါတယ်။ အဲဒီလို အချိန်ကုန် သက်သာစေဖို့ နည်းပညာဖက်က ပံ့ပိုးမှုတွေ အများကြီး ပြုလုပ်ပေးဖို့ လိုအပ်ပါတယ်။

(၈) အမှားအယွင်းဒါဏ်ခံနိုင်ခြင်း

လူတိုင်း အမှားနဲ့ မကင်းကြပါဘူး။ အဲဒီလို အမှားအယွင်း ဖြစ်လာတဲ့အခါ ဘယ်လောက်အထိ ကိုင်တွယ် ဖြေရှင်းနိုင်လဲ ဆိုတဲ့ အချက်ဟာလည်း ကောင်းမွန်တဲ့ User Interface ကို တည်ဆောက်သူတိုင်း ထည့်သွင်းစဉ်းစားရမယ့် အချက် ဖြစ်ပါတယ်။ တစ်ခုခုမှားလုပ်မိရင် ပြန်ပြင်လို့ရလား၊ နဂိုနေရာ ပြန်သွားလို့ရလား၊ ဖိုင်တစ်ခုခု မှားဖျက်လိုက်ရင် ပြန်ယူလို့ ရလား စသည်ဖြင် အမှားအယွင်းနဲ့ ပတ်သက်တာတွေ အားလုံးကို အသေးစိတ် ကိုင်တွယ် ဖြေရှင်းနိုင်အောင် စီစဉ်ထားဖို့ လိုပါတယ်။ ကောင်းမွန်ပြည့်စုံတဲ့ User Interface တွေဟာ အသုံးပြုသူတွေကို မှားလုပ်မိတဲ့အတွက် ပြန်ပြင်ခွင့် မပေးတာ၊ ဒါဏ်ခတ်တာမျိုး လုပ်လေ့ မရှိပါဘူး။

User Interface Design တစ်ခုကို တည်ဆောက်တဲ့ နေရာမှာ အထက်မှာ ဖော်ပြခဲ့တဲ့ အချက်အားလုံးကို ညီညွှတ်မျှတ အောင် တည်ဆောက်ဖို့ တကယ်တန်း လက်တွေ့မှာ မလွယ်ကူပါဘူး။ အင်မတန် ဉာဏ်များပြီး ဉာဏ်ကစားရတဲ့ ကိစ္စ ဖြစ်ပါတယ်။ တစ်ခုကို အာရုံစိုက် ပြင်ဆင်နေတဲ့အချိန်မှာ နောက်တစ်ခုကို သက်ရောက်မှုတွေ ဖြစ်ပေါ် စေနိုင်ပါတယ်။ Interface Design တစ်ခုမှာ Interface Element တွေဖြစ်တဲ့ Button တွေ Icon တွေ စသည်ဖြင့် အများကြီး ထည့်မယ် ဆိုရင် များများထည့်လေ၊ များများကိုင်တွယ် ဖြေရှင်းရလေ ဖြစ်နေပါလိမ့်မယ်။ အဲဒီလိုပါပဲ အသုံးပြုသူ အနေနဲ့လည်း များရင်များသလောက် လိုက်လုပ်နေရမှာ ဖြစ်ပါတယ်။ တစ်ခြားတစ်ဖက်မှာလည်း ရှင်းလင်းချက်တွေ ပြည့်စုံအောင် မထည့်ထားဘူးဆိုရင် အသုံးပြုသူတွေအနေနဲ့ ရှုပ်ထွေးမှုတွေ ဖြစ်ပေါ် ခံစားရမှာ ဖြစ်ပါတယ်။ ရိုးရှင်းပြီး ဆွဲဆောင်မှု ရှိတဲ့ Interface Design တစ်ခုကို တည်ဆောက်မယ် ဆိုရင်လည်း တစ်ဖက်မှာ ရှင်းလင်းဖို့ ညီညွှတ်မျှတဖို့ဆိုတာ ချိန်ညှိဖို့ ခက်တဲ့ သဘော ဖြစ်နေတတ်ပါတယ်။

ဆက်ပါဦးမယ် …

Facebook comments:

One Response

  1. [...] Web Application များအတွက် User Interface Design (1) [...]

Leave a comment


*