អ្នកប្រហែលជាធ្លាប់នៅទីនោះពីមុនមក។ តើយើងជ្រើសរើសរវាងការបង្ហាញគំរូដល់អ្នកប្រើដោយរបៀបណា ហើយតើយើងនាំពួកគេទៅទំព័រថ្មីដាច់ដោយឡែកនៅពេលណា? ហើយតើវាសំខាន់ទេ? តាមពិតទៅ។ ការសម្រេចចិត្តមានឥទ្ធិពលលើលំហូររបស់អ្នកប្រើប្រាស់ បរិបទរបស់ពួកគេ សមត្ថភាពរបស់ពួកគេក្នុងការស្វែងរកព័ត៌មានលម្អិត និងជាមួយនឹងភាពញឹកញាប់នៃកំហុស និងការបញ្ចប់កិច្ចការ។ ជម្រើសទាំងពីរអាចរំខាន និងខកចិត្ត — នៅពេលខុស និងនៅកន្លែងខុស។ ដូច្នេះយើងនឹងយល់បានត្រឹមត្រូវ។ អញ្ចឹងតោះមើលពីរបៀបធ្វើវា។ Modals vs. Dialogs vs. Overlays vs. Lightboxes ខណៈពេលដែលយើងជារឿយៗនិយាយអំពីសមាសភាគ UI ម៉ូឌុលតែមួយ យើងតែងតែមិនអើពើនឹងភាពមិនច្បាស់លាស់ និងស្មុគស្មាញរវាងប្រភេទផ្សេងគ្នានៃម៉ូឌុលទាំងអស់។ តាមពិតមិនមែនគ្រប់ម៉ូដទាំងអស់សុទ្ធតែដូចគ្នានោះទេ។ ម៉ូឌុល ប្រអប់ ការត្រួតលើគ្នា និងប្រអប់ពន្លឺ — ទាំងអស់ស្តាប់ទៅស្រដៀងគ្នា ប៉ុន្តែពួកគេពិតជាខុសគ្នាខ្លាំង៖
ពាក្យទូទៅ DialogA សម្រាប់ "ការសន្ទនា" (ប្រព័ន្ធអ្នកប្រើប្រាស់ ↔) ។ ត្រួតលើបន្ទះមាតិកាតូចមួយដែលបង្ហាញនៅផ្នែកខាងលើនៃទំព័រ។ ModalUser ត្រូវតែធ្វើអន្តរកម្មជាមួយការត្រួតលើគ្នា + ផ្ទៃខាងក្រោយត្រូវបានបិទ។ NonmodalUser ត្រូវតែធ្វើអន្តរកម្មជាមួយការត្រួតលើគ្នា + ផ្ទៃខាងក្រោយត្រូវបានបើក។ LightboxDimmed ផ្ទៃខាងក្រោយដើម្បីផ្តោតការយកចិត្តទុកដាក់លើម៉ូឌុល។
ដូចដែល Anna Kaley គូសបញ្ជាក់ ការត្រួតគ្នាភាគច្រើនលេចឡើងនៅពេលខុស រំខានអ្នកប្រើប្រាស់ក្នុងអំឡុងពេលកិច្ចការសំខាន់ ប្រើភាសាមិនល្អ និងបំបែកលំហូររបស់អ្នកប្រើប្រាស់។ ពួកវាមានការរំខានដោយធម្មជាតិ ហើយជាធម្មតាជាមួយនឹងកម្រិតខ្ពស់នៃភាពធ្ងន់ធ្ងរដោយមិនចាំបាច់មានតម្រូវការខ្លាំងនោះទេ។
ប្រាកដណាស់ អ្នកប្រើប្រាស់ត្រូវតែមានការយឺតយ៉ាវ និងរំខាន ប្រសិនបើផលវិបាកនៃសកម្មភាពរបស់ពួកគេមានផលប៉ះពាល់ខ្ពស់ ប៉ុន្តែសម្រាប់សេណារីយ៉ូភាគច្រើនដែលមិនមែនជាម៉ូឌុលគឺមានភាពស្រពិចស្រពិល និងជាជម្រើសដែលងាយស្រួលជាងក្នុងការនាំយកអ្វីមួយមកឱ្យអ្នកប្រើប្រាស់។ ប្រសិនបើមានអ្វី ខ្ញុំតែងតែស្នើឱ្យវាជាលំនាំដើម។ Modals → សម្រាប់ Single, Self-Contained Tasks ក្នុងនាមជាអ្នករចនា យើងតែងតែច្រានចោលម៉ូឌុលថាមិនពាក់ព័ន្ធ និងគួរឱ្យរំខាន ហើយជារឿយៗវាជា! - ប៉ុន្តែពួកគេមានតម្លៃរបស់ពួកគេផងដែរ។ ពួកគេអាចមានប្រយោជន៍ខ្លាំងណាស់ក្នុងការព្រមានអ្នកប្រើប្រាស់អំពីកំហុសដែលអាចកើតមាន ឬជួយពួកគេឱ្យជៀសវាងការបាត់បង់ទិន្នន័យ។ ពួកគេក៏អាចជួយអនុវត្តសកម្មភាពដែលពាក់ព័ន្ធ ឬស្វែងយល់ពីព័ត៌មានលម្អិតដោយមិនរំខានដល់ស្ថានភាពបច្ចុប្បន្ននៃទំព័រ។ ប៉ុន្តែអត្ថប្រយោជន៍ដ៏ធំបំផុតនៃម៉ូឌុលគឺថាពួកគេជួយអ្នកប្រើប្រាស់រក្សាបរិបទនៃអេក្រង់បច្ចុប្បន្ន។ វាមិនមានន័យថាគ្រាន់តែជា UI ប៉ុណ្ណោះទេ ប៉ុន្តែក៏មានការបញ្ចូលដែលបានកែសម្រួល ទីតាំងរមូរ ស្ថានភាពនៃ accordions ការជ្រើសរើសតម្រង ការតម្រៀបជាដើម។
ពេលខ្លះ អ្នកប្រើប្រាស់ត្រូវបញ្ជាក់ការជ្រើសរើសយ៉ាងរហ័ស (ឧ. តម្រងដូចបានបង្ហាញខាងលើ) ហើយបន្ទាប់មកបន្តភ្លាមៗពីទីនោះ។ ការរក្សាទុកដោយស្វ័យប្រវត្តិអាចសម្រេចបានដូចគ្នា ប៉ុន្តែវាមិនមែនតែងតែត្រូវការ ឬចង់បាននោះទេ។ ហើយការទប់ស្កាត់ UI ជារឿយៗមិនមែនជាគំនិតល្អទេ។ ទោះយ៉ាងណាក៏ដោយ ម៉ូឌុលមិនត្រូវបានប្រើសម្រាប់កិច្ចការណាមួយឡើយ។ ជាធម្មតា យើងប្រើវាសម្រាប់កិច្ចការតែមួយ ដែលដាក់ដោយខ្លួនឯង ដែលអ្នកប្រើប្រាស់គួរតែលោតចូល បំពេញកិច្ចការ ហើយបន្ទាប់មកត្រឡប់ទៅកន្លែងដែលពួកគេនៅ។ មិនគួរឱ្យភ្ញាក់ផ្អើលទេ ពួកវាដំណើរការបានល្អសម្រាប់អន្តរកម្មខ្លីៗដែលមានអាទិភាពខ្ពស់ (ឧ. ការជូនដំណឹង សកម្មភាពបំផ្លិចបំផ្លាញ ការបញ្ជាក់រហ័ស)។ នៅពេលដែលម៉ូឌុលជួយ: 🚫 Modals ច្រើនតែរំខាន ឈ្លានពាន និងច្របូកច្របល់។ 🚫 វាធ្វើឱ្យពិបាកក្នុងការប្រៀបធៀប និងចម្លងបិទភ្ជាប់។✅ ប៉ុន្តែម៉ូឌុលអនុញ្ញាតឱ្យអ្នកប្រើប្រាស់រក្សាបរិបទច្រើន។✅ មានប្រយោជន៍ក្នុងការទប់ស្កាត់កំហុសដែលមិនអាចត្រឡប់វិញបាន និងការបាត់បង់ទិន្នន័យ។ ✅ មានប្រយោជន៍ប្រសិនបើការបញ្ជូនអ្នកប្រើប្រាស់ទៅកាន់ទំព័រថ្មីនឹងមានការរំខាន។ ✅ បង្ហាញម៉ូឌុល លុះត្រាតែអ្នកប្រើប្រាស់នឹងផ្តល់តម្លៃដល់ការរំខាន។✅ តាមលំនាំដើម ចូលចិត្តប្រអប់ដែលមិនរារាំង (“nonmodals”)។✅ អនុញ្ញាតឱ្យអ្នកប្រើប្រាស់បង្រួម លាក់ ឬស្ដារប្រអប់នៅពេលក្រោយ។ ទំព័រ → សម្រាប់ភាពស្មុគស្មាញ លំហូរការងារច្រើនជំហាន អ្នកជំនួយការ ឬការរុករកតាមផ្ទាំងនៅក្នុងម៉ូឌុលមិនដំណើរការល្អពេកទេ សូម្បីតែនៅក្នុងផលិតផលសហគ្រាសស្មុគស្មាញ — នៅទីនោះ បន្ទះចំហៀង ឬថតឯកសារជាធម្មតាដំណើរការប្រសើរជាងមុន។ បញ្ហាចាប់ផ្តើមនៅពេលដែលអ្នកប្រើប្រាស់ត្រូវការប្រៀបធៀប ឬយោងចំណុចទិន្នន័យ — ប៉ុន្តែម៉ូឌុលរារាំងឥរិយាបថនេះ ដូច្នេះពួកគេបើកទំព័រដដែលក្នុងផ្ទាំងច្រើនជំនួសវិញ។
សម្រាប់ដំណើរការស្មុគ្រស្មាញ និងដំណើរការច្រើនជំហាន ទំព័រឯករាជ្យដំណើរការល្អបំផុត។ ទំព័រក៏ដំណើរការបានប្រសើរជាងមុនផងដែរ នៅពេលដែលពួកគេទាមទារការយកចិត្តទុកដាក់ពេញទំហឹងរបស់អ្នកប្រើប្រាស់ ហើយការយោងទៅលើអេក្រង់មុនគឺមិនមានប្រយោជន៍ខ្លាំងនោះទេ។ ហើយថតឯកសារដំណើរការសម្រាប់កិច្ចការរងដែលស្មុគស្មាញពេកសម្រាប់ម៉ូឌុលសាមញ្ញ ប៉ុន្តែមិនត្រូវការការរុករកទំព័រពេញលេញទេ។ ពេលណាត្រូវជៀសវាងគំរូ៖ 🚫 ជៀសវាងម៉ូឌុលសម្រាប់សារកំហុស។ 🚫 ជៀសវាងម៉ូឌុលសម្រាប់ការជូនដំណឹងអំពីមុខងារ។ 🚫 ជៀសវាងម៉ូឌុលសម្រាប់បទពិសោធន៍នៃការចាប់ផ្តើមដំណើរការ។ 🚫 ជៀសវាងម៉ូឌុលសម្រាប់កិច្ចការច្រើនជំហានដ៏ស្មុគស្មាញ និងវែង។ 🚫 ជៀសវាងម៉ូឌុលដែលបានដាក់ជាប់គ្នាច្រើន ហើយប្រើជម្រើសមុន/បន្ទាប់ជំនួសវិញ។ ជៀសវាងម៉ូឌុលដែលកេះដោយស្វ័យប្រវត្តិ លើកលែងតែចាំបាច់។ ជៀសវាងទាំងពីរសម្រាប់កិច្ចការដដែលៗ នៅក្នុងផលិតផលដែលស្មុគស្មាញ និងធ្ងន់ អ្នកប្រើប្រាស់នឹងឃើញខ្លួនឯងបំពេញកិច្ចការដដែលៗ ម្តងហើយម្តងទៀត។ នៅទីនោះ ទាំងម៉ូឌុល និងការរុករកទំព័រថ្មីបន្ថែមការកកិត ព្រោះវារំខានដល់លំហូរ ឬបង្ខំអ្នកប្រើប្រាស់ឱ្យប្រមូលទិន្នន័យដែលបាត់រវាងផ្ទាំង ឬទិដ្ឋភាពផ្សេងៗទាំងអស់។ ជាញឹកញាប់ពេក អ្នកប្រើប្រាស់បញ្ចប់ជាមួយនឹងបទពិសោធន៍ដែលខូច ពោរពេញទៅដោយការបញ្ជាក់មិនចេះចប់ ការព្រមានដែលបំផ្លើស ការណែនាំជាពាក្យសំដី ឬគ្រាន់តែបាត់ចំណុចយោងប៉ុណ្ណោះ។ ដូចដែលលោក Saulius Stebulis បានលើកឡើងនៅក្នុងសេណារីយ៉ូទាំងនេះ ផ្នែកដែលអាចពង្រីកបាន ឬការកែសម្រួលនៅនឹងកន្លែង ជារឿយៗដំណើរការបានប្រសើរជាង — ពួកគេរក្សាកិច្ចការឱ្យជាប់នឹងអេក្រង់បច្ចុប្បន្ន។ នៅក្នុងការអនុវត្តជាក់ស្តែង នៅក្នុងសេណារីយ៉ូជាច្រើន អ្នកប្រើប្រាស់មិនបំពេញកិច្ចការរបស់ពួកគេដោយឯកោទេ។ ពួកគេត្រូវស្វែងរកទិន្នន័យ តម្លៃចម្លងបិទភ្ជាប់ កែលម្អធាតុនៅកន្លែងផ្សេងៗគ្នា ឬគ្រាន់តែពិនិត្យមើលកំណត់ត្រាស្រដៀងគ្នា នៅពេលពួកគេធ្វើការតាមភារកិច្ចរបស់ពួកគេ។ ការត្រួតលើគ្នា និងថតមានសារៈប្រយោជន៍ជាងក្នុងការរក្សាការចូលប្រើទិន្នន័យផ្ទៃខាងក្រោយក្នុងអំឡុងពេលកិច្ចការ។ ជាលទ្ធផល បរិបទតែងតែស្ថិតនៅក្នុងកន្លែងរបស់វា ដែលអាចប្រើបានសម្រាប់ជាឯកសារយោង ឬចម្លងបិទភ្ជាប់។ រក្សាទុកម៉ូឌុល និងការរុករកទំព័រសម្រាប់គ្រាដែលការរំខានបន្ថែមតម្លៃយ៉ាងពិតប្រាកដ — ជាពិសេសដើម្បីការពារកំហុសឆ្គងសំខាន់ៗ។ Modals vs. Pages: មែកធាងការសម្រេចចិត្ត ត្រលប់មកវិញ Ryan Neufeld បានដាក់បញ្ចូលគ្នានូវការណែនាំដ៏មានប្រយោជន៍ដើម្បីជួយអ្នករចនាជ្រើសរើសរវាងគំរូ និងទំព័រ។ វាភ្ជាប់មកជាមួយសន្លឹកបន្លំ PNG ដ៏ងាយស្រួល និងគំរូ Google Doc ជាមួយនឹងសំណួរដែលបែងចែកជា 7 ផ្នែក។ វាវែង ហ្មត់ចត់បំផុត ប៉ុន្តែងាយស្រួលធ្វើតាម៖
វាអាចមើលទៅគួរឱ្យខ្លាច ប៉ុន្តែវាជាដំណើរការសាមញ្ញ 4 ជំហាន៖
បរិបទនៃអេក្រង់។ ជាដំបូង យើងពិនិត្យមើលថាតើអ្នកប្រើប្រាស់ត្រូវរក្សាបរិបទនៃអេក្រង់ក្រោមឬអត់។ ភាពស្មុគ្រស្មាញ និងរយៈពេលនៃកិច្ចការ។ កិច្ចការដែលសាមញ្ញជាង ការផ្តោតអារម្មណ៍ និងមិនមានការរំខានអាចប្រើម៉ូឌុល ប៉ុន្តែលំហូរស្មុគស្មាញវែងត្រូវការទំព័រ។ យោងទៅទំព័រដែលនៅពីក្រោម។បន្ទាប់មក យើងពិនិត្យមើលថាតើអ្នកប្រើជាញឹកញាប់ត្រូវការយោងទៅលើទិន្នន័យក្នុងផ្ទៃខាងក្រោយឬប្រសិនបើភារកិច្ចគឺជាការបញ្ជាក់ឬការជ្រើសរើសសាមញ្ញ។ ការជ្រើសរើសការត្រួតលើគ្នាឱ្យបានត្រឹមត្រូវ។ ជាចុងក្រោយ ប្រសិនបើការត្រួតលើគ្នាពិតជាជម្រើសដ៏ល្អ វាណែនាំយើងឱ្យជ្រើសរើសរវាងម៉ូឌុល ឬមិនមែនម៉ូដ (ទំនោរទៅរកភាពមិនទាន់សម័យ)។
រុំឡើង នៅពេលណាដែលអាចធ្វើទៅបាន ជៀសវាងការទប់ស្កាត់ UI ទាំងមូល។ មានប្រអប់អណ្តែត ដែលគ្របដណ្ដប់ផ្នែកខ្លះនៃ UI ប៉ុន្តែអនុញ្ញាតឱ្យមានការរុករក រមូរ និងចម្លងបិទភ្ជាប់។ ឬបង្ហាញខ្លឹមសារនៃម៉ូឌុលជាថតចំហៀង។ ឬប្រើ accordion បញ្ឈរជំនួសវិញ។ ឬនាំអ្នកប្រើប្រាស់ទៅកាន់ទំព័រដាច់ដោយឡែក ប្រសិនបើអ្នកត្រូវការបង្ហាញព័ត៌មានលម្អិតច្រើន។ ប៉ុន្តែប្រសិនបើអ្នកចង់បង្កើនប្រសិទ្ធភាព និងល្បឿនរបស់អ្នកប្រើប្រាស់ ជៀសវាងការកែប្រែនៅគ្រប់ការចំណាយទាំងអស់។ ប្រើពួកវាដើម្បីបន្ថយល្បឿនអ្នកប្រើប្រាស់ ប្រមូលផ្តុំការយកចិត្តទុកដាក់របស់ពួកគេ ដើម្បីការពារកំហុស។ ដូចដែល Therese Fessenden បានកត់សម្គាល់ គ្មាននរណាម្នាក់ចូលចិត្តរំខានទេ ប៉ុន្តែប្រសិនបើអ្នកត្រូវតែ ត្រូវប្រាកដថាវាពិតជាមានតម្លៃ។ ជួបជាមួយ "លំនាំរចនាចំណុចប្រទាក់ឆ្លាតវៃ" អ្នកអាចស្វែងរកផ្នែកទាំងមូលអំពីម៉ូឌុល និងជម្រើសនៅក្នុងគំរូរចនាចំណុចប្រទាក់ឆ្លាតវៃ ដែលជាវគ្គសិក្សាវីដេអូរយៈពេល 15 ម៉ោងរបស់យើងជាមួយនឹងឧទាហរណ៍ជាក់ស្តែងចំនួន 100 ពីគម្រោងជីវិតពិត — ជាមួយនឹងការបណ្តុះបណ្តាល UX ផ្ទាល់នៅចុងឆ្នាំនេះ។ អ្វីគ្រប់យ៉ាងចាប់ពីការទម្លាក់ចុះធំរហូតដល់តារាងសហគ្រាសស្មុគ្រស្មាញ — ជាមួយនឹងការបន្ថែមផ្នែកថ្មីចំនួន 5 ជារៀងរាល់ឆ្នាំ។ ចូលទៅកាន់ការមើលជាមុនដោយឥតគិតថ្លៃ។ ប្រើលេខកូដ BIRDIE ដើម្បីសន្សំ 15% បិទ។ ជួបជាមួយ Smart Interface Design Patterns ដែលជាវគ្គវីដេអូរបស់យើងស្តីពីការរចនាចំណុចប្រទាក់ និង UX។
វីដេអូ + ការបណ្តុះបណ្តាល UX វីដេអូតែមួយគត់វីដេអូ + ការបណ្តុះបណ្តាល UX $ 495.00 $ 699.00
ទទួលបានវីដេអូ + មេរៀនវីដេអូ UX Training25 (15 ម៉ោង) + វគ្គបណ្តុះបណ្តាល UX ផ្ទាល់។ ធានាសងប្រាក់វិញ 100 ថ្ងៃ។ វីដេអូត្រឹមតែ $ 300.00$ 395.00
ទទួលបានវគ្គសិក្សាវីដេអូ 40 មេរៀនវីដេអូ (15 ម៉ោង) ។ បានធ្វើបច្ចុប្បន្នភាពប្រចាំឆ្នាំ។ ក៏មានជាកញ្ចប់ UX ជាមួយនឹងវគ្គសិក្សាវីដេអូចំនួន 2 ។
ធនធានមានប្រយោជន៍
ប្រភេទផ្សេងគ្នានៃការលេចឡើង, ដោយ Anna Kaley ការអនុវត្តល្អបំផុតសម្រាប់ការរចនាម៉ូដ UI ដោយ Uxcel យើងប្រើម៉ូឌុល Damn ច្រើនពេក៖ គោលការណ៍ណែនាំ UX ដោយ Adrian Egger Modal & Nonmodal Dialogs ដោយ Therese Fessenden ការរចនា UI សហគ្រាសទំនើប៖ ប្រអប់ Modal Dialogs ដោយ James Jacobs ម៉ូឌុលនៅក្នុងប្រព័ន្ធរចនា
