நீங்கள் ஏற்கனவே அங்கு சென்றிருக்கலாம். நாம் எப்படி தேர்வு செய்வது ஒரு மாதிரியைக் காட்டுகிறது பயனர்கள் மற்றும் ஒரு புதிய, தனி பக்கத்திற்கு அவர்களை நாம் செல்லும்போது? மேலும் இது முக்கியமா?
உண்மையில், ஆம். முடிவு பயனர்களின் ஓட்டம், அவர்களின் சூழல், விவரங்களைத் தேடும் திறன் மற்றும் அதனுடன் தாக்கத்தை ஏற்படுத்துகிறது பிழை விகிதம் மற்றும் பணி நிறைவு. இரண்டு விருப்பங்களும் சீர்குலைக்கும் மற்றும் வெறுப்பாக இருக்கலாம் – தவறான நேரத்தில் மற்றும் தவறான இடத்தில்.
எனவே நாம் அதை சரியாகப் பெறுவது நல்லது. சரி, அதை எப்படி செய்வது என்று பார்ப்போம்.
மாதிரிகள் வெர்சஸ் டயலாக்ஸ் வெர்சஸ் ஓவர்லேஸ் வெர்சஸ் லைட்பாக்ஸ்
ஒற்றை மாதிரி UI கூறுகளைப் பற்றி நாம் அடிக்கடி பேசும்போது, பல்வேறு வகையான மாடல்களுக்கு இடையே உள்ள நுணுக்கமான மற்றும் சிக்கலான நுணுக்கங்களை நாங்கள் அடிக்கடி புறக்கணிப்போம். உண்மையில், எல்லா மாதிரிகளும் ஒரே மாதிரி இல்லை. மாதிரிகள், உரையாடல்கள், மேலடுக்குகள் மற்றும் லைட்பாக்ஸ்கள் – அவை அனைத்தும் ஒரே மாதிரியானவை, ஆனால் அவை உண்மையில் வேறுபட்டவை:
- உரையாடல்
“உரையாடல்” என்பதற்கான பொதுவான சொல் (பயனர் ↔ அமைப்பு). - மேல்நிலை
ஒரு பக்கத்தின் மேலே காட்டப்படும் சிறிய உள்ளடக்க குழு. - மாதிரி
மேலடுக்கு + பின்புலத்துடன் பயனர் தொடர்பு கொள்ள வேண்டும் ஊனமுற்றவர். - முறையற்ற
மேலடுக்கு + பின்புலத்துடன் பயனர் தொடர்பு கொள்ள வேண்டும் செயல்படுத்தப்பட்டது. - ஒளி பெட்டி
மாதிரியில் கவனம் செலுத்த மங்கலான பின்னணி.
அன்னா கேலி சுட்டிக்காட்டியுள்ளபடி, பெரும்பாலான மேலடுக்குகள் தவறான நேரத்தில் வருகின்றன, முக்கியமான பணிகளின் போது பயனர்களுக்கு இடையூறு விளைவிக்கின்றன, மோசமான மொழியைப் பயன்படுத்துகின்றன மற்றும் பயனர் ஓட்டத்திற்கு இடையூறு செய்கின்றன. நான் இயற்கையால் சர்க்யூட் பிரேக்கர்மற்றும் பொதுவாக ஒரு வலுவான தேவை இல்லாமல் அதிக அளவு தீவிரத்துடன்.
நிச்சயமாக பயனர்கள் அவசியம் அவர்களின் செயலின் விளைவுகள் அதிக தாக்கத்தை ஏற்படுத்தினால் மெதுவாக மற்றும் குறுக்கிடப்படும், ஆனால் பெரும்பாலான காட்சிகளுக்கு அல்லாத மாதிரிகள் மிகவும் நுட்பமானவை மற்றும் பயனரின் கவனத்திற்கு எதையாவது கொண்டு வர ஒரு நட்பு விருப்பம். எவ்வாறாயினும், நான் அதை எப்போதும் பரிந்துரைக்கிறேன் மறைமுகமாக.
மாதிரிகள் → ஒற்றை, தன்னாட்சி பணிகளுக்கு
வடிவமைப்பாளர்களாக, நாங்கள் அடிக்கடி மாடல்களை பொருத்தமற்ற மற்றும் எரிச்சலூட்டும் என்று நிராகரிக்கிறோம் – மற்றும் பெரும்பாலும் அவர்கள்! – இருப்பினும், அவற்றின் மதிப்பும் உள்ளது. அவர்கள் மிகவும் உதவியாக இருக்க முடியும் சாத்தியமான தவறுகள் பற்றி பயனர்களை எச்சரிக்கவும் அல்லது தரவு இழப்பைத் தவிர்க்க அவர்களுக்கு உதவுங்கள். பக்கத்தின் தற்போதைய நிலைக்கு இடையூறு விளைவிக்காமல், தொடர்புடைய செயல்களைச் செய்யவும் அல்லது விவரங்களைத் தெரிந்துகொள்ளவும் அவர்கள் உதவலாம்.
ஆனால் மாதிரிகளின் மிகப்பெரிய நன்மை என்னவென்றால், அவை பயனர்களுக்கு உதவுகின்றன சூழலை வைத்து தற்போதைய திரையின். இது UI ஐ மட்டும் குறிக்கவில்லை, ஆனால் திருத்தப்பட்ட உள்ளீடு, உருள் நிலை, துருத்தி நிலை, வடிகட்டி தேர்வு, வரிசையாக்கம் மற்றும் பல.
சில நேரங்களில் பயனர்கள் செய்ய வேண்டும் ஒரு தேர்வை விரைவாக உறுதிப்படுத்தவும் (எ.கா. மேலே காட்டப்பட்டுள்ளபடி வடிகட்டி) பின்னர் அங்கிருந்து உடனடியாக தொடரவும். ஆட்டோசேவ் நிச்சயமாக அதையே சாதிக்க முடியும், ஆனால் அது எப்போதும் அவசியமில்லை அல்லது விரும்புவதில்லை. UI ஐத் தடுப்பது பெரும்பாலும் நல்ல யோசனையல்ல.
இருப்பினும், எந்தவொரு பணிக்கும் மாதிரிகள் பயன்படுத்தப்படுவதில்லை. நாங்கள் பொதுவாக அவற்றைப் பயன்படுத்துகிறோம் தனிப்பட்ட, தன்னாட்சி பணிகள் பயனர்கள் எங்கு நுழைய வேண்டும், ஒரு பணியை முடிக்க வேண்டும், பின்னர் அவர்கள் இருந்த இடத்திற்குத் திரும்ப வேண்டும். ஆச்சரியப்படத்தக்க வகையில், இது குறுகிய, அதிக முன்னுரிமை இடைவினைகளுக்கு (எ.கா. விழிப்பூட்டல்கள், அழிவுச் செயல்கள், விரைவான உறுதிப்படுத்தல்கள்) நன்றாக வேலை செய்கிறது.
நடத்தை உதவும் போது:
🚫 மாதிரிகள் பெரும்பாலும் இடையூறு விளைவிக்கும், ஊடுருவும் மற்றும் குழப்பமானவை.
🚫 ஒப்பீடு மற்றும் நகல்-பேஸ்ட் கடினமாக்குகிறது.
✅ இருப்பினும், மாடல்கள் பயனர்கள் பல சூழல்களை பராமரிக்க அனுமதிக்கின்றன.
✅ மீளமுடியாத பிழைகள் மற்றும் தரவு இழப்பைத் தடுக்க பயனுள்ளதாக இருக்கும்.
✅ புதிய பக்கத்திற்கு பயனர்களை அனுப்புவது இடையூறாக இருந்தால் பயனுள்ளதாக இருக்கும்.
✅ குறுக்கீட்டைப் பயனர்கள் பாராட்டினால் மட்டுமே பயன்முறையைக் காட்டுங்கள்.
✅ இயல்பாக, தடுக்காத (“மாடல் அல்லாத”) உரையாடல்களை விரும்பவும்.
✅ உரையாடலைப் பின்னர் குறைக்க, மறைக்க அல்லது மீட்டமைக்க பயனர்களை அனுமதிக்கவும்.
✅ பயனர்களின் வேகத்தைக் குறைக்க ஒரு மாதிரியைப் பயன்படுத்தவும், உதாரணமாக சிக்கலான உள்ளீட்டைச் சரிபார்க்கவும்.
✅ “மூடு”, ESC விசையுடன் வெளியேறவும் அல்லது பெட்டிக்கு வெளியே கிளிக் செய்யவும்.
பக்கங்கள் → சிக்கலான, பல-படி பணிப்பாய்வுகளுக்கு
மந்திரவாதிகள் அல்லது மாதிரிகளுக்குள் தாவலாக்கப்பட்ட வழிசெலுத்தல் சிக்கலான நிறுவன தயாரிப்புகளில் கூட இது நன்றாக வேலை செய்யாது – பக்க பேனல்கள் அல்லது இழுப்பறைகள் பொதுவாக அங்கு சிறப்பாக செயல்படும். பயனர்கள் தரவுப் புள்ளிகளை ஒப்பிடும்போது அல்லது குறிப்பிடும்போது சிக்கல்கள் தொடங்குகின்றன – இருப்பினும் மாதிரிகள் இந்த நடத்தையைத் தடுக்கின்றன, அதனால் அவர்கள் ஒரே பக்கத்தை பல தாவல்களில் மீண்டும் திறக்கிறார்கள்.
மிகவும் சிக்கலான ஓட்டங்கள் மற்றும் பல-படி செயல்முறைகளுக்கு, தனித்த பக்கங்கள் சிறப்பாக செயல்படும். மேலும், பயனரின் முழுக் கவனம் தேவைப்படும்போது பக்கங்கள் சிறப்பாகச் செயல்படும், மேலும் முந்தைய திரையைக் குறிப்பிடுவது மிகவும் பயனுள்ளதாக இருக்காது. ஒரு எளிய மாதிரிக்கு மிகவும் சிக்கலான ஆனால் முழுப் பக்க வழிசெலுத்தல் தேவையில்லாத துணைப் பணிகளுக்கு இழுப்பறைகள் வேலை செய்கின்றன.
மாடல்களை எப்போது தவிர்க்க வேண்டும்:
🚫 அதற்கான மாதிரிகளைத் தவிர்க்கவும் பிழை செய்திகள்.
🚫 அதற்கான மாதிரிகளைத் தவிர்க்கவும் அம்ச அறிவிப்புகள்.
🚫 அதற்கான மாதிரிகளைத் தவிர்க்கவும் போர்டிங் அனுபவம்.
🚫 சிக்கலான மாதிரிகளைத் தவிர்க்கவும், நீண்ட பலநிலை பணிகள்.
🚫 தவிர்க்கவும் பல உள்ளமை மாதிரிகள் அதற்குப் பதிலாக முந்தைய/அடுத்ததைப் பயன்படுத்தவும்.
🚫 தவிர்க்கவும் சுய-தூண்டப்பட்ட முறைகள் முற்றிலும் தேவைப்படாவிட்டால்.
மீண்டும் மீண்டும் செய்யும் பணிகளுக்கு இரண்டையும் தவிர்க்கவும்
பல சிக்கலான, பணி-கடுமையான தயாரிப்புகளில், பயனர்கள் மீண்டும் மீண்டும் அதே பணிகளைச் செய்வதைக் காணலாம். அங்கு, இரண்டு மாதிரிகள் மற்றும் புதிய பக்கங்களுக்குச் செல்வது உராய்வைச் சேர்க்கிறது ஏனெனில் அவை ஓட்டத்தை உடைக்கிறது அல்லது அனைத்து வெவ்வேறு தாவல்கள் அல்லது பார்வைகளுக்கு இடையில் விடுபட்ட தரவைச் சேகரிக்க பயனர்களை கட்டாயப்படுத்துகிறது.
அடிக்கடி, பயனர்கள் முடிவில்லாத உறுதிப்படுத்தல்கள், மிகைப்படுத்தப்பட்ட எச்சரிக்கைகள், விரிவான வழிமுறைகள் அல்லது விடுபட்ட குறிப்புப் புள்ளிகள் போன்ற ஒரு முரண்பாடான அனுபவத்துடன் முடிவடையும். சாலியஸ் ஸ்டெபுலிஸ் குறிப்பிட்டது போல், இந்த சூழ்நிலைகளில், விரிவாக்கக்கூடிய பிரிவுகள் அல்லது இடத்தில் எடிட்டிங் பெரும்பாலும் சிறப்பாகச் செயல்படும் – தற்போதைய திரையில் பணியை நறுக்கி வைத்திருக்கிறேன்.
நடைமுறையில், பல சூழ்நிலைகளில், பயனர்கள் தங்கள் பணிகளை தனிமையில் செய்வதில்லை. அவர்கள் தரவைத் தேட வேண்டும், மதிப்புகளை நகலெடுத்து ஒட்ட வேண்டும், வெவ்வேறு இடங்களில் உள்ளீடுகளைச் செம்மைப்படுத்த வேண்டும் அல்லது தங்கள் பணிகளைச் செய்யும்போது ஒரே மாதிரியான பதிவுகளை மதிப்பாய்வு செய்ய வேண்டும்.
கர்ப்ப காலத்தில் பின்னணி தரவுகளுக்கான அணுகலைப் பராமரிக்க மேலடுக்குகள் மற்றும் இழுப்பறைகள் மிகவும் பயனுள்ளதாக இருக்கும். இதன் விளைவாக, சூழல் எப்போதும் இடத்தில் இருக்கும், குறிப்பு அல்லது நகல்-பேஸ்ட் செய்ய கிடைக்கிறது. குறுக்கீடு உண்மையில் மதிப்பு சேர்க்கும் நேரங்களுக்குச் சேமிக்கும் முறைகள் மற்றும் பக்க வழிசெலுத்தல் – குறிப்பாக முக்கியமான தவறுகளைத் தடுக்க.
மாதிரிகள் மற்றும் பக்கங்கள்: ஒரு முடிவு மரம்
சில காலத்திற்கு முன்பு, ரியான் நியூஃபெல்ட் வடிவமைப்பாளர்களுக்கு உதவ மிகவும் பயனுள்ள வழிகாட்டியை உருவாக்கினார் மாதிரிகள் மற்றும் பக்கங்களுக்கு இடையே தேர்வு செய்யவும். இது எளிமையான PNG தாள் மற்றும் 7 பிரிவுகளாகப் பிரிக்கப்பட்ட கேள்விகளைக் கொண்ட Google டாக் டெம்ப்ளேட்டுடன் வருகிறது.
இது நீண்டது, மிகவும் விரிவானது, ஆனால் பின்பற்றுவது மிகவும் எளிதானது:
இது அச்சுறுத்தலாகத் தோன்றலாம், ஆனால் இது மிகவும் எளிமையானது 4 படி செயல்முறை:
- திரை பின்னணி.
முதலில், முகப்புத் திரையின் சூழலை பயனர்கள் பராமரிக்க வேண்டுமா என்பதைச் சரிபார்க்கிறோம். - கர்ப்பத்தின் சிக்கலான தன்மை மற்றும் காலம்.
எளிமையான, கவனம் செலுத்தும், கவனத்தை சிதறடிக்காத பணிகளுக்கு ஒரு மாதிரியைப் பயன்படுத்தலாம், ஆனால் நீண்ட, சிக்கலான ஓட்டங்களுக்கு ஒரு பக்கம் தேவை. - பிரதான பக்கத்திற்கான குறிப்பு.
அடுத்து, பயனர்கள் பெரும்பாலும் பின்னணியில் உள்ள தரவைக் குறிப்பிட வேண்டுமா அல்லது பணி ஒரு எளிய உறுதிப்படுத்தல் அல்லது தேர்வா என்பதை நாங்கள் சரிபார்க்கிறோம். - சரியான மேலோட்டத்தைத் தேர்ந்தெடுப்பது.
இறுதியாக, ஒரு மேலடுக்கு உண்மையில் ஒரு நல்ல விருப்பமாக இருந்தால், அது மாதிரி அல்லது மாடல் அல்லாத (மாடலை நோக்கி சாய்ந்து) ஒன்றைத் தேர்வுசெய்ய நமக்கு வழிகாட்டுகிறது.
முடிவு
முடிந்தவரை, முழு பயனர் இடைமுகத்தையும் தடுப்பதைத் தவிர்க்கவும். அவற்றில் மிதக்கும் உரையாடல் பெட்டி உள்ளது, இது UI ஐ ஓரளவு உள்ளடக்கியது, ஆனால் வழிசெலுத்தல், ஸ்க்ரோலிங் மற்றும் நகல்-பேஸ்டிங் ஆகியவற்றை அனுமதிக்கிறது. அல்லது மாதிரி உள்ளடக்கத்தை பக்க அலமாரியாகக் காட்டவும். அல்லது அதற்கு பதிலாக செங்குத்து துருத்தி பயன்படுத்தவும். அல்லது நிறைய விவரங்களைக் காட்ட வேண்டும் என்றால் பயனர்களை தனிப் பக்கத்திற்குக் கொண்டு வாருங்கள்.
ஆனால் நீங்கள் பயனர் செயல்திறனையும் வேகத்தையும் அதிகரிக்க விரும்பினால், எல்லா விலையிலும் மாதிரிகளைத் தவிர்க்கவும். பயனர்களை மெதுவாக்கவும், அவர்களின் கவனத்தை ஒருமுகப்படுத்தவும், தவறுகளைத் தடுக்கவும் அவற்றைப் பயன்படுத்தவும். தெரேஸ் ஃபெசென்டன் குறிப்பிட்டுள்ளபடி, யாரும் குறுக்கிட விரும்புவதில்லை, ஆனால் நீங்கள் செய்ய வேண்டியிருந்தால், அது முற்றிலும் செலவாகும் என்பதை உறுதிப்படுத்திக் கொள்ளுங்கள்.
“ஸ்மார்ட் இடைமுகங்களுக்கான வடிவமைப்பு வடிவங்களை” சந்திக்கவும்
நீங்கள் ஒரு கண்டுபிடிக்க முடியும் மாதிரிகள் முழு பகுதி மற்றும் மாற்றுகள் ஸ்மார்ட் UI வடிவமைப்பு வடிவங்கள்நம்முடையது 15 மணிநேர வீடியோ பாடநெறி நிஜ வாழ்க்கை திட்டங்களில் இருந்து 100 நடைமுறை எடுத்துக்காட்டுகளுடன் – இந்த ஆண்டின் இறுதியில் நேரடி UX பயிற்சியுடன். மெகா கீழ்தோன்றும் மெனுக்கள் முதல் சிக்கலான நிறுவன அட்டவணைகள் வரை அனைத்தும் – ஒவ்வொரு ஆண்டும் 5 புதிய பிரிவுகள் சேர்க்கப்படும். இலவச மாதிரிக்காட்சிக்கு செல்லவும். குறியீட்டைப் பயன்படுத்தவும் புஸ்ஸி TO 15% சேமிக்கவும் ஆஃப்
பயனுள்ள ஆதாரங்கள்
(ஆம்)
Leave a Reply