iOS navigation pattern တွေအကြောင်း ရောက်တတ်ရာရာ
Intro
ကျွန်တော်ကိုယ်တိုင်က IT သမားတစ်ယောက်ဖြစ်တာကြောင့် design နဲ့ပတ်သက်တဲ့ ကိစ္စတွေကို သိပ်မသိပါဘူး။ သို့သော်လည်း iOS Developer တစ်ယောက်အနေနဲ့ Apple ရဲ့ human interface guideline လိုကောင်မျိုးတွေကို တီးမိခေါက်မိရှိထားသင့်တယ်လို့ ယူဆတာကတစ်ကြောင်း indie app လေးတွေလုပ်ဖို့ စိတ်ကူးရှိတာကတစ်ကြောင်းတို့ကြောင့် လေ့လာဖြစ်ပါတယ်။ ဒီ article မှာ iOS ရဲ့အသုံးများတဲ့ tab bar, push, pop navigation pattern တွေကို ပြောပြပေးသွားပါမယ်။ အောက်မှာဆက်လက်ဖော်ပြမယ့် အကြောင်းအရာတွေဟာ Sarah McClanahan ရဲ့ WWDC22: Explore navigation design for iOS ကို ကိုးကားထားပါတယ်။
Tab bar
ဒီနေရာမှာ ပြောစရာ နှစ်ခုရှိတယ်။ ပထမတစ်ခုက အခေါ်အဝေါ် ကွဲပြားတာပေါ့။ Apple design language မှာ tab bar လို့ပြောလိုက်ရင် android material design ရဲ့ bottom navigation bar ကို ပြောတာလို့ မှတ်ရပါမယ်။ Android ဘက်ကလာတဲ့သူတော်တော်များများ နားရှုပ်စေနိုင်ပါတယ်။ Android ရဲ့ tab bar နဲ့ ခပ်ဆင်ဆင်တူတဲ့ component ကိုတော့ iOS မှာ segmented control လို့ခေါ်ပါတယ်။ ဒါကတော့ အခေါ်အဝေါ်ကွဲပြားတာကို ပြောတာပါ။ ဒုတိယတစ်ခု ပြောစရာရှိတာက iOS မှာ side menu သုံးလေ့သုံးထ မရှိဘူးဆိုတာပါဘဲ။ Android မှာဆိုရင်တော့ side menu နဲ့ bottom nav bar နှစ်မျိုးတွဲသုံးလေ့ရှိကြတယ်။ ကျွန်တော်တို့ iOS မှာဆိုရင်တော့ များသောအားဖြင့် tab bar ပဲသုံးလေ့ရှိတယ်။ Side menu ကို သုံးတာလည်း ရှိတော့ရှိတာပေါ့လေ။ သို့သော်လည်း အရေအတွက်အားဖြင့် နည်းပါတယ်။ အဲ့တော့ ဒီနေရာမှာ မေးစရာရှိတာက tab bar တစ်ခုမှာ tab item အရေအတွက်သည် ငါးခုထက်မပိုသင့်ဘူးဆိုတဲ့ စည်းမျဉ်းတစ်ခုရှိတယ်။ ဆိုတော့ကာ ငါးခုထက်ပိုသွားရင်ရော side menu မထည့်သင့်ပေဘူးလားဆိုတာ မေးစရာဖြစ်လာတယ်။ iOS မှာ ဒီလိုမျိုး tab item ငါးခုထက်ပိုလာပြီဆိုရင် နောက်ဆုံး tab item ကို more လို့နာမည်တပ်လိုက်ပြီးတော့ navigation list ပုံစံနဲ့သွားပါတယ်။ နမူနာပြရရင် iPhone ရဲ့ Settings app အတိုင်းပါဘဲ။ တူရာ section တွေအလိုက် စုထားပြီး diclosure indicator လေးနဲ့ navigation list ဖြစ်သွားတာပါဘဲ။
Tab bar က ဘာလို့အရေးကြီးတာလည်းပေါ့။ What is so special about tab bar ပေါ့။ အဲ့တော့ Apple က tab bar ကို ရှယ်သုံး ရှယ် promote တဲ့အတွက်ကြောင့် tab bar က special ဖြစ်သွားတာပါ။ တစ်ကယ်တော့ ဘာမှမဟုတ်ပါဘူး xD. Apple ရဲ့ design philosophy အရ navigation သည် ကိုယ့် app ရဲ့ အလုပ်လုပ်ပုံကို user ကို တန်းပြီး သိစေနိုင်ရမယ်။ Navigation လုပ်တဲ့ပုံစံဟာ သဘာဝကျကျ စာအုပ်တစ်အုပ် စာမျက်နှာတစ်ခုကနောက်တစ်ခုကူးသလိုမျိုး လွယ်လွယ်ကူကူနဲ့ ခန့်မှန်းရလွယ်နေရမယ်။ အဲ့မှာ tab bar ဟာ official navigaiton component တစ်ခု ဖြစ်လာတော့တာပါပဲ။ HIG ရဲ့ အလိုအရ on boarding screen ကိုတောင် ဖြစ်နိုင်ရင် သူတို့က modal presentation နဲ့တက်စေချင်တာ။ သူတို့ကိုယ်တိုင်လည်း Notes တို့ Health တို့ သူတို့ရဲ့ app အကုန်မှာ on boarding screen ကို modal နဲ့တက်တဲ့ screen တစ်ခုပဲ ထားထားတယ်။ ဆိုတော့ app ကိုဖွင့်လိုက်တာနဲ့တစ်ပြိုင်နက် ဘာကိုတန်းတွေ့ရမလည်းဆိုတော့ tab bar ကို တန်းတွေ့ရမှာပဲ။ သူတို့စကားနဲ့ပြောရရင် app ကိုဖွင့် tab bar ကိုတွေ့ပြီဆိုတာနဲ့တစ်ပြိုင်နက် tab bar ရဲ့ tab တစ်ခုချင်းစီတိုင်းသည် ဒီ app ရဲ့ core functionality တွေကို ကိုယ်စားပြုနေရမယ်။ ဆိုလိုတာက tab bar ကိုမြင်တာနဲ့ ဒီ app က ဘာလဲ ဘာတွေလုပ်လို့ရလဲဆိုတဲ့ general idea ရကိုရသွားရမယ်။
Tab bar ဆိုတာ iOS app တစ်ခုလုံး global navigation system တစ်ခုဖြစ်တယ်။ ဆိုလိုတာက app တစ်ခုလုံးရဲ့ အရေးကြီးတဲ့ functionality တွေအကုန်လုံးကို tab bar ကနေ single tap လောက်နဲ့ navigate လုပ်သွားလို့ရရမယ်။ ကိုယ့် app ရဲ့ information hierarchy တစ်နည်းပြောရရင် content အထားအသိုကို tab bar က enclose လုပ်ထားတဲ့ သဘောပဲ။ App တစ်ခုစလုပ်တော့မယ် ဘယ် feature တွေပါမယ် အဲ့ feature တစ်ခုမှာ ဘယ် screen တွေပါမယ်ဆိုတာ အကြမ်းဖျင်းလောက်ရပြီဆိုရင် information hierarchy ကို mind map နဲ့ဖြစ်ဖြစ် တည်ဆောက်လို့ရပြီ။ အဲ့ information hiearchy ကိုအခြေခံပြီး ကိုယ့်ရဲ့ app user က ကိုယ့် app ကို ဘယ်လိုသုံးစေချင်သလဲဆိုတာအပေါ်မူတည်ပြီး tab bar ရဲ့ tab item တွေကို စပြီး နေရာချထားလို့ရပါပြီ။ အဲ့လိုနေရာချတဲ့အချိန်မှာ tab item တစ်ခုစီတိုင်းရဲ့နာမည်ကိုလည်း တိုတိုတုတ်တုတ်နဲ့ ဖတ်လိုက်တာနဲ့ တန်းနားလည်နိုင်လောက်မယ့် လူသုံးများတဲ့ အသုံးအနှုန်မျိုးတွေ သုံးပေးဖို့လိုပါတယ်။
ကျွန်တော်တို့တွေက ဘာလုပ်ကြလေ့ရှိသလဲဆိုတော့ ပထမဆုံး tab မှာ အကုန်ပြွတ်သိပ်ပြီး info တွေ ထည့်ကြတာပဲ။ Home ဆိုတဲ့ tab မှာ တစ်ခြား tab မှာပါတဲ့ဟာတွေလည်း ကောက်ထည့်ရင်ထည့်ထားတာပဲ။ ဘာကြောင့်လဲဆိုတော့ ပထမဆုံးမြင်ရမယ့် tab သည် အရေးအကြီးဆုံး user interaction အလုပ်ဆုံး screen ဖြစ်သင့်/ဖြစ်ရမှာဖြစ်တဲ့အတွက် user ကို သုံးစေချင်သမျှ မြင်စေချင်သမျှ feature တွေအကုန်လုံးကို ပထမဆုံး tab မှာ အကုန်ပစ်ထည့်ထားကြလေ့ရှိတယ်။ သူများမပြောနဲ့ ကျွန်တော်ကိုယ်တိုင်လည်း အဲ့လိုလုပ်ခဲ့တဲ့ အကြိမ်အရေအတွက် မနည်းတော့ဘူး။ လုပ်သင့်တာကတော့ tab item တွေနဲ့ functionality တွေကို သူ့ဘာနဲ့သူ အဆင်ပြအောင် ခွဲထုတ်ဖို့ပါဘဲ။ Feature တွေနဲ့ tab တွေ သူ့ဟာနဲ့သူ balance ဖြစ်အောင် ခွဲဖို့လိုပါတယ်။ မခွဲထုတ်ရင် ဘာဖြစ်လာသလဲဆိုတော့ ဒီ tab မှာလည်း ဒီ action ကိုလုပ်လို့ရ နောက် tab မှာလည်း ဒီ action ကိုလုပ်လို့ရ ဒီ tab မှာလည်း ဒီ content ပါတယ် နောက် tab မှာလည်း ဒီ content ပါတယ် အဲ့လိုဟာတွေများလာရင် ရှုပ်ထွေးမှုတွေ ဖြစ်လာစေနိုင်ပါတယ်။ ကံမကောင်းရင် app store review team ဆီက ရစ်တာလည်း ခံရနိုင်ပါတယ်။ ဒါပေမယ့် တစ်ခါတလေကျ content ချင်းတူပေမယ့် organised လုပ်ထားတဲ့ပုံချင်းမတူရင် interact လုပ်မယ့် action ချင်းမတူရင် အဲ့လို scenario မျိုးမှာတော့ tab တစ်ခုနဲ့တစ်ခုကြား content တွေ duplicate ဖြစ်တာကို အတိုင်းအတာတစ်ခုထိ justify လုပ်လို့ရပါတယ်။
ရှေ့မှာပြောခဲ့သလို duplicate action တွေကို tab item တစ်ခုနဲ့တစ်ခုကြားမှာ ထည့်ထားတဲ့အခါ tab-jump ဆိုတဲ့ကိစ္စ ဖြစ်လာနိုင်ပါတယ်။ Tab-jump ဟာ iOS design မှာ ဘယ်လိုမှလက်သင့်ခံလို့မရတဲ့ red flag တစ်ခုပါ။ ဆိုကြပါစို့ ကျွန်တော်က home tab ထဲက screen တစ်ခုခုကနေ button လေးတစ်ခုကိုနှိပ်လိုက်တာ library ဆိုတဲ့ tab ကို အလိုလိုခုန်ကူးသွားတယ်ဆိုရင် ဒီလိုဟာမျိုးကို tab-jump လို့ခေါ်ပါတယ်။ ဒီလိုကိစ္စမျိုးဖြစ်လာပြီဆိုရင်တော့ ဒါဟာ tab design စချတည်းက လွဲလာခဲ့တယ်ဆိုတာ သိသာစေပါတယ်။ User က tab item တစ်ခုကနေ နောက်တစ်ခုကို နှိပ်လိုက်တဲ့အချိန်ကလွဲလို့ ဘယ်တော့မှ tab bar ရဲ့ selection က အလိုအလျှောက်မပြောင်းသွားသင့်ပါဘူး။
Tab bar ကို တော်ရုံတန်ရုံအကြောင်းပြချက်လောက်နဲ့ မဖျောက်သင့်ပါဘူးတဲ့။ UINavigationController မှာ hidesBottomBarWhenPushed ဆိုတဲ့ flag တစ်ခုရှိပါတယ်။ နောက် screen တစ်ခုကို push လိုက်တဲ့အချိန်မှာ tab bar ကို ဖျောက်လိုက်တာပါ။ ဒီလိုကိစ္စမျိုးက very genuine situation တွေမှာဘဲ လုပ်သင့်ပါတယ်တဲ့။ Tab bar item တစ်ခုစီတိုင်းက app ရဲ့ core functionality တစ်ခုစီကို ကိုယ်စားပြုပါတယ် ခုနတုန်းကပြောခဲ့သလို tab bar သည် global navigation point ဖြစ်တဲ့အတွက် tab item တစ်ခုရဲ့ deep navigation hierarchy ကနေ နောက် tab item ကိုသွားချင်တဲ့အခါ back ပြန်ထွက်စရာမလိုဘဲ လွယ်လွယ်ကူကူနောက်ထပ် feature တစ်ခုကိုဆက်သုံးနိုင်တဲ့အတွက် tab bar ကို မဖြစ်မနေအခြေအနေမျိုးမဟုတ်ရင် မဖျောက်သင့်ပါဘူးတဲ့။ ဒါကတော့ သူတို့ရဲ့ design philosophy ပါ။
Hierarchical navigation
iOS မှာ မူလ navigation လုပ်တဲ့ transiton နှစ်မျိုးရှိပါတယ်။ Push navigation နဲ့ modal navigation နှစ်ခုအနက် push navigation က information hierarchy တွေကို ပိုပြီး deep ဖြစ်ဖြစ် consume လုပ်တဲ့နေရာမှာ သုံးလေ့ရှိပါတယ်။ pushViewController(:animated:) ဆိုပြီးတော့ push လုပ်တဲ့အတွက်ကြောင့် push navigation လို့လည်း ခေါ်လေ့ရှိပါတယ်။ လက်ရှိ navigation level ကနေ ပိုပြီး deeper ဖြစ်တဲ့ ပိုပြီး specific ဖြစ်တဲ့ content တွေကို ကြည့်တဲ့အခါမှာ ဒီလို push navigation transition ကိုသုံးကြပါတယ်။ မြန်မာစကားအပါအဝင် left to right သွားတဲ့ language ပြောသူတွေအတွက် ဒီလို ညာဘက်ကနေ ဘယ်ဘက်ကို slide in ဝင်လာပြီး ပြန်ထွက်ရင်လည်း ဘယ်ဘက်ကနေ ညာဘက်ကို slide out လုပ်တဲ့ transition ဟာ natural ဖြစ်ပါတယ်။ Transition လုပ်သွားတဲ့အပေါ်မူတည်ပြီးတော့လည်း ကိုယ်လုပ်လိုက်တဲ့ navigation ကို predict လုပ်လို့ရပါတယ်။ တစ်ကယ်လို့ right to left ရေးတဲ့ arabic လိုကောင်မျိုးတွေအတွက်ဆိုရင်တော့ ပြောင်းပြန်ဖြစ်သွားပါမယ်။ Apple မှာ design for arabic ဆိုတဲ့ session တွေလည်း သပ်သပ်ရှိပါသေးတယ်။
အပေါ်ကပုံမှာပြထားသလို Places ဆိုတဲ့ tab မှာ သွားနိုင်တဲ့ screen သုံးခုရှိပါတယ်။ SanFrancisco ကိုရွေးလိုက်တဲ့အခါ ထပ်ပြီး ဖွင့်နိုင်တဲ့ screen နှစ်ခုပဲရှိပါတော့တယ်။ Butterlap ကို ထပ်ရွေးလိုက်တဲ့အခါ ထပ်ဖွင့်နိုင်တဲ့ screen က သူ့အောက်မှာ တစ်ခုပဲကျန်ပါတော့တယ်။ ဆိုလိုတာကတော့ hierarchical navigation ဆိုတဲ့အတိုင်း navigation flow က ပိုပြီး deep ဖြစ်လာလေ content တွေက ပို specific ဖြစ်လာလေဖြစ်ပြီး distraction ပိုနည်းလာစေပါတယ်။
Navigation bar ဟာ push နဲ့ modal navigation style နှစ်ခုစလုံးအတွက် အရေးပါပါတယ်။ Tab bar item တစ်ခုရဲ့ ပထမဉီးဆုံး screen ဟာ navigation large title ကိုသုံးလေ့ရှိပါတယ်။ အဲ့ကနေမှ push navigation သုံးလိုက်ပြီဆိုရင် ဒုတိယ screen ဟာ compact navigation title ဖြစ်သွားပါတယ်။ Navigation title ဟာ ကျွန်တော်တို့ရဲ့ app user ကို သူလက်ရှိရောက်နေတဲ့ screen အကြောင်းကို ပြောပြပေးသလို back button ဟာလည်း ဘယ်ကနေ ဒီ screen ကို ရောက်လာသလဲဆိုတာကို ပြောပြပေးပါတယ်။ အပေါ်ကပုံကိုကြည့်မယ်ဆိုရင် San Francisco ဆိုတဲ့ screen ကနေ လက်ရှိ screen ကို ရောက်လာတယ်ဆိုတာကို မြင်နိုင်ပါတယ်။ ဒါကတော့ HIG ကို follow လုပ်မယ်ဆိုရင် back button ကို description မဖျောက်သင့်ဘူးလို့ ပြောချင်တာဖြစ်ပါတယ်။ ဒါပေမယ့် app တွေတော်တော်များများမှာ သူတို့ရဲ့ custom design တွေရှိတာကြောင့် များသောအားဖြင့်တော့ back button ကို customize လုပ်ကြတာ များပါတယ်။ ဒါပေမယ့် back button က ပိုပြီး descriptive ဖြစ်မယ်ဆိုရင်တော့ HIG ကို လိုက်နာပြီးသား ဖြစ်နေပါလိမ့်မယ်။
Hierarchical navigation ဟာ iOS app တစ်ခုရဲ့ navigation transition တော်တော်များများမှာ အသုံးပြုရတာကို တွေ့ရပါမယ်။ App တစ်ခုရဲ့တာဝန်က အသုံးပြုသူ user လုပ်လိုတဲ့အရာတွေကို လွယ်လွယ်ကူကူ မှန်မှန်ကန်ကန် လုပ်နိုင်အောင် ထိန်းကျောင်းပေးရတာဖြစ်ပါတယ်။ ဒီလို user ကို navigate လုပ်တဲ့အခါမှာ app ရဲ့ functionality တွေဟာ hierarchy အနေနဲ့ သွားနေတာဖြစ်ပါတယ်။ ဒီလို တစ်ခုနဲ့တစ်ခု ချိတ်ဆက်နေမှလည်း user အတွက် အသုံးပြုရတာ ပိုပြီးလွယ်ကူမှာပါ။
Modal presentation
Modal presentation က ပိုပြီး light weight ဖြစ်တယ်လို့ ခံစားရစေနိုင်ပါတယ်။ ဉပမာပြောရရင် Contacts app ထဲကနေ + button လေးကိုနှိပ်လိုက်တဲ့အခါ screen အောက်ခြေကနေ contact အသစ်ထည့်နိုင်ဖို့ form လေးတစ်ခုတက်လာတာသည် modal presentation ဖြစ်ပါတယ်။ Modal presentation ကို ဘယ်အချိန်မှ အသုံးပြုရမလဲဆိုတော့ button တစ်ခုရဲ့ action သည် လက်ရှိ screen ကနေ ပိုပြီး deep ဖြစ်တဲ့ content ကို သွားဖို့မဟုတ်ဘဲ သီးခြား functionality တစ်ခု တစ်နည်းပြောရရင် separate functionality တစ်ခုကို လုပ်ဖို့အတွက်ဆိုရင် modal presentation ကိုသုံးသင့်ပါတယ်။ ဉပမာ ခုနက Contacts app ရဲ့ လက်ရှိ selection သည် ဖုန်းထဲက contact list ကို ပြဖို့သာဖြစ်တယ်။ တစ်ကယ်လို့ user က contact item တစ်ခုခုကို detail ကြည့်လိုတဲ့အခါ deeper content ကို ကြည့်တာဖြစ်သွားတဲ့အတွက် hierarchical navigation နဲ့သွားသင့်တယ်။ သို့မဟုတ် contact အသစ်တစ်ခုထည့်ချင်တာဆိုရင်တော့ လက်ရှိ screen ကနေ သီးခြား functionality တစ်ခုကို သွားချင်တာဖြစ်တဲ့အတွက် modal presentation ကိုသုံးရတာဖြစ်တယ်။ တစ်နည်းပြောရရင် လက်ရှိ screen ရဲ့ context ကနေ နောက်ထပ် context တစ်ခုကို switch လုပ်သွားတာလို့ ပြောနိုင်ပါတယ်။ Self-contained ဖြစ်တဲ့ task တစ်ခုကို လုပ်လိုတဲ့အခါ modal presentation ကိုသုံးပြီး အဲ့ modal presentation ပြထားတဲ့ screen ထဲမှာလည်း deeper content ကို consume လုပ်ဖို့ရာ hierarchical navigation ကို သုံးနိုင်ပါတယ်။
အပေါ်က video မှာဆိုရင် ပထမဆုံး reminder အသစ်တစ်ခုကိုထပ်ထည့်ဖို့အတွက် New Reminder ဆိုတဲ့ button ကိုနှိပ်လိုက်တဲ့အခါ ဒီ flow သည် self-contained task ဖြစ်တဲ့အတွက် modal အနေနဲ့ navigate လိုက်တယ်။ ဒါပေမယ့် အဲ့ form ကနေမှ detail ကိုကြည့်ချင်တဲ့အခါကျတော့ ဒါသည် deeper content ဖြစ်သွားတဲ့အတွက် hierarchical navigation ကို သုံးသွားတယ်။ အဲ့ကနေမှ ထပ်ပြီး priority တွေကိုထပ်ကြည့်ချင်တော့ ဒါသည်လား ဒီထက်ပိုပြီး specific ဖြစ်တဲ့ content ကို ပြတာဖြစ်တဲ့အတွက် hierarchical navigation ကိုပဲ ထပ်သုံးသွားပါတယ်။ ဒီလောက်ဆို ကျွန်တော်ပြောချင်တာကို မြင်မယ်ထင်ပါတယ်။
Modal presentation ကိုသုံးလိုက်တဲ့အခါ tab bar ကို ဖုံးလိုက်တာကို မြင်ရမှာပါ။ ရှေ့မှာပြောခဲ့သလို ဘယ်တော့မှ tab bar ကို မဖျောက်ထားသင့်ဘူးဆိုပေမယ့် modal presentation မှာ tab bar ကို access လုပ်လို့မရအောင်လုပ်လိုက်တာဟာ Apple က ရည်ရွယ်ချက်ရှိရှိ လုပ်ခဲ့တာဖြစ်ပါတယ်။ ခုနကပြောခဲ့သလိုပဲ modal presentation သုံးပြီးပြတဲ့ screen သည် self-contained ဖြစ်တဲ့ separate task တစ်ခုဖြစ်တဲ့အတွက်ကြောင့် user အနေနဲ့ ဒီ task ကို finish/dismiss မဖြစ်မချင်း အခြား top level feature တွေကို ခုန်ကူးလို့မရအောင် ဒီ task ရဲ့ focus ကို ပိုပြီး reinforce လုပ်လိုက်တဲ့သဘောပါ။ နောက်တစ်ခါ modal presentation တွေကိုသုံးရင် လက်ရှိ screen ကနေ ဘယ်လောက် deep ဖြစ်တဲ့ hierarchy မှာရှိနေပါစေ interactive gesture နဲ့ modal တစ်ခုလုံးကို dismiss လုပ်လို့ရတယ်ဆိုတာ သတိထားမိမှာပါ။ ဒါကလည်း အဓိပ္ပာယ်ရှိရှိ ခွင့်ပြုပေးထားတာဖြစ်ပါတယ်။
Apple မှာ uninterrupted user experience ဆိုတာကို အင်မတန် အလေးထားပါတယ်။ ယုတ်စွအဆုံး on-board လုပ်တဲ့ screen တွေကိုတောင် ဖြစ်နိုင်ရင် modal presentation နဲ့ပြဖို့ recommend လုပ်ပါတယ်။ ဘာကြောင့်လဲဆိုတော့ app ရဲ့ main content ကို မြန်နိုင်သမျှမြန်မြန် access လုပ်နိုင်တာဟာ သူတို့ရဲ့ uninterrupted ux philosophy နဲ့ ကိုက်ညီတဲ့အတွက်ဖြစ်ပါတယ်။ Modal screen တစ်ခုဟာ လက်ရှိ main screen ရဲ့ feature ကိုပိုပြီး compliment လုပ်ပေးနိုင်တဲ့ isolated flow တစ်ခုကို ခေတ္တခဏ လုပ်ခွင့်ပေးတာသာဖြစ်တာကြောင့် တစ်ကယ်လို့ ဆက်မလုပ်ချင်တော့ဘူးဆိုရင် user အနေနဲ့ action တစ်ခုတည်းနဲ့ flow တစ်ခုလုံးကို dismiss လုပ်ခွင့်ရစေပါတယ်။ ဒီနည်းနဲ့ main screen ရဲ့ experience ကို အနှောင့်အယှက်တစ်စုံတစ်ရာမဖြစ်စေဘဲ ရောက်လက်စနေရာကနေ ဆက်ပြီး အသုံးပြုနိုင်မှာဖြစ်ပါတယ်။
Modal presentation ကိုသုံးတဲ့နေရာမှာ ဆောင်ရန် ရှောင်ရန်လေးတွေရှိပါတယ်။ ပထမရှောင်ရမယ့်အချက်ကတော့ navigation step တွေအများကြီးထည့်တာကို ရှောင်ရပါမယ်။ တစ်ကယ်လို့ ကိုယ့်ရဲ့ modal မှာ hierarchical navigation step တွေအများကြီးရှိနေပြီဆိုရင် separate tab item တစ်ခုအနေနဲ့ ခွဲထုတ်သင့် ခွဲထုတ်ဖို့ စစဉ်းစားရပါတော့မယ်။ ဒုတိယရှောင်သင့်တာကတော့ modal presentation ကနေ နောက်ထပ် modal presentation တစ်ခုထပ်သွားတာပါ။ ဒါကလည်း မတတ်သာတဲ့ မဖြစ်မနေအခြေအနေမျိုးမှမဟုတ်ရင် အဲ့လို modal over modal ပြတာမျိုး မလုပ်သင့်ပါဘူး။ ဆောင်ရမယ့်အချက်ကတော့ navigation title ထားထားဖို့ပါ။ Navigation bar ရဲ့ right action label ဟာ modal တစ်ခုလုံးမှာအရေးပါတဲ့ action ကို လုပ်ဆောင်ဖို့ဖြစ်တဲ့အတွက် bold font နဲ့သုံးရပါတယ်။ Left action label ကတော့ modal presentation flow တစ်ခုလုံးကို dismiss လုပ်နိုင်တာဖြစ်တဲ့အတွက် “Cancel” ဆိုတာကို ထားထားလေ့ရှိပါတယ်။ Modal presentation ရဲ့ action label တွေဟာ affirmative verb တွေဖြစ်သင့်တယ်လို့ ဆိုပါတယ်။
တစ်ခါတလေ designer တွေက dismiss လုပ်တဲ့ button ကို description အစာ close icon လေးတွေသုံးတတ်ကြပါတယ်။ ဒါကလည်း user ကို confuse ဖြစ်သွားစေနိုင်ပါတယ်။ အပေါ်ကပုံကိုကြည့်လိုက်မယ်ဆိုရင် ညာဘက်အခြမ်းက close button သည် select လုပ်ထားတာတွေကို clear out လုပ်ဖို့လား modal ကို dismiss ဖို့လားဆိုတာ မသဲကွဲတော့ပါဘူး။ ဘယ်လိုအချိန်မှာ ခုနကလို close icon သုံးသင့်သလဲဆိုတော့ ကိုယ့်ရဲ့ modal က fullscreen content ဖြစ်တဲ့အခါ (ဉပမာ video player လိုမျိုး, pdf view လိုမျိုး) ဒါမှမဟုတ် ကိုယ့် screen မှာ input field တွေမရှိတဲ့အခါ minimal navigation ဖြစ်တဲ့အခါ အဲ့လိုအခါမျိုးမှာဆိုရင်တော့ သုံးတာပြသနာမရှိပါဘူး။ Fullscreen ဆိုရင်တော့ user ကို ကိုယ့်ရဲ့ content ကို ပိုပြီး ပြည့်ပြည့်ဝဝ consume လုပ်နိုင်ဖို့အတွက် text action တွေအစား concise ဖြစ်တဲ့ icon တွေသုံးတာ ပိုသင့်တော်ပါလိမ့်မယ်။
Conclusion
Apple မှာ app တစ်ခုက သူတို့ရဲ့ platform အပေါ်မှာ ဘယ်လို behave လုပ်ရမယ်ဆိုတဲ့ philosophy တိတိကျကျခိုင်ခိုင်မာမာရှိပါတယ်။ Apple user တွေကလည်း apple ရဲ့ design philosophy နဲ့ အသားကျနေကြပြီးဖြစ်သလို apple က component အသစ် gesture အသစ် interaction အသစ် ထွင်လိုက်တိုင်းလည်း သူတို့ရဲ့ promo video တွေမှာ user တွေကို အမှတ်မထင်သုံးပြရင်းကနေ ဘယ်လိုသုံးရတယ်ဆိုတာကို မသိမသာ educate လုပ်သွားစမြဲပါ။ ကျွန်တော့်လို iOS app တွေရေးပြီး ထမင်းစားနေတဲ့သူတစ်ယောက်အတွက်တော့ ui interaction အသစ်တွေ gesture pattern အသစ်တွေတီထွင်ရတာ ကျွန်တော့်အလုပ်မဟုတ်ပေမယ့် ရှိပြီးသား apple ရဲ့ HIG ကို သေသေချာချာနားလည်ထားရင် ပိုပြီးကောင်းမွန်တဲ့ Apple device တွေအတွက် ပိုပြီးကောင်းမွန်တဲ့ app တွေ ဖန်တီးနိုင်မယ်လို့ ယုံကြည်မိပါတယ်ခင်ဗျာ။
