অফলাইন UX ডিজাইন নির্দেশিকা

এই পৃষ্ঠাটি কীভাবে ধীর নেটওয়ার্ক এবং অফলাইনে একটি দুর্দান্ত ব্যবহারকারীর অভিজ্ঞতা তৈরি করতে হয় তার ডিজাইন নির্দেশিকা প্রদান করে৷

একটি নেটওয়ার্ক সংযোগের গুণমান বিভিন্ন কারণের দ্বারা প্রভাবিত হতে পারে, যেমন নিম্নলিখিত:

  • দুর্বল নেটওয়ার্ক প্রদানকারী কভারেজ।
  • চরম আবহাওয়া পরিস্থিতি।
  • বিদ্যুৎ বিভ্রাটের.
  • স্থায়ী "মৃত অঞ্চল" প্রবেশ করানো, যেমন দেয়াল সহ বিল্ডিংগুলিতে যা নেটওয়ার্ক সংযোগগুলিকে ব্লক করে।
  • অস্থায়ী "মৃত অঞ্চলে" প্রবেশ করা, যেমন ট্রেনে ভ্রমণ করার সময় এবং একটি টানেলের মধ্য দিয়ে যাওয়ার সময়।
  • টাইম-বক্সযুক্ত ইন্টারনেট সংযোগ, যেমন বিমানবন্দর বা হোটেলে।
  • সাংস্কৃতিক অনুশীলনের জন্য নির্দিষ্ট সময়ে বা নির্দিষ্ট দিনে সীমিত বা কোনো ইন্টারনেট অ্যাক্সেস প্রয়োজন।

একজন বিকাশকারী হিসাবে আপনার লক্ষ্য হল একটি ভাল অভিজ্ঞতা প্রদান করা যা সংযোগে পরিবর্তনের প্রভাবকে কম করে।

আপনার ব্যবহারকারীদের নেটওয়ার্ক সংযোগ খারাপ থাকলে তাদের কী দেখাবেন তা স্থির করুন৷

আপনার অ্যাপের জন্য নেটওয়ার্ক সংযোগের সাফল্য এবং ব্যর্থতা কেমন তা জিজ্ঞাসা করার প্রথম প্রশ্ন। একটি সফল সংযোগ হল আপনার অ্যাপের স্বাভাবিক অনলাইন অভিজ্ঞতা। সংযোগ ব্যর্থতার মধ্যে আপনার অ্যাপ অফলাইনে এবং ল্যাজি নেটওয়ার্কে কীভাবে আচরণ করে উভয়ই অন্তর্ভুক্ত।

সংযোগ ব্যর্থতা কীভাবে পরিচালনা করবেন তা নির্ধারণ করতে, নিজেকে এই গুরুত্বপূর্ণ UX প্রশ্নগুলি জিজ্ঞাসা করুন:

  • একটি সংযোগের সাফল্য বা ব্যর্থতা নির্ধারণ করতে আপনি কতক্ষণ অপেক্ষা করেন?
  • সাফল্য বা ব্যর্থতা নির্ধারণ করা হচ্ছে যখন আপনি কি করতে পারেন?
  • সংযোগ ব্যর্থ হলে আপনার কি করা উচিত?
  • আপনি কিভাবে ব্যবহারকারীকে বলবেন কি হচ্ছে?

ব্যবহারকারীদের তাদের বর্তমান অবস্থা এবং অবস্থার পরিবর্তন সম্পর্কে অবহিত করুন

ব্যবহারকারীকে অ্যাপ্লিকেশানের অবস্থা এবং নেটওয়ার্ক ব্যর্থতার সময় তারা যে পদক্ষেপ নিতে পারে তা উভয়ই বলুন৷ উদাহরণস্বরূপ, একটি বিজ্ঞপ্তি নিম্নলিখিত বলতে পারে:

আপনার একটি খারাপ নেটওয়ার্ক সংযোগ আছে বলে মনে হচ্ছে. চিন্তার কিছু নেই! নেটওয়ার্ক পুনরুদ্ধার করা হলে বার্তা পাঠানো হবে।

ইমোজয় ইমোজি মেসেজিং অ্যাপ ব্যবহারকারীকে অবহিত করে যখন অবস্থার পরিবর্তন ঘটে।
যত তাড়াতাড়ি সম্ভব অবস্থার পরিবর্তন ঘটলে ব্যবহারকারীকে স্পষ্টভাবে জানান।
I/O 2016 অ্যাপ্লিকেশানটি ব্যবহারকারীকে অবহিত করে যখন অবস্থার পরিবর্তন ঘটে।
Google I/O অ্যাপ একটি "টোস্ট" ব্যবহার করে ব্যবহারকারীকে জানাতে যে তারা অফলাইনে ছিল।

নেটওয়ার্ক সংযোগের উন্নতি হলে বা পুনরুদ্ধার করা হলে ব্যবহারকারীদের জানান

আপনি কীভাবে ব্যবহারকারীকে বলবেন তাদের নেটওয়ার্ক সংযোগ উন্নত হয়েছে তা আপনার অ্যাপ্লিকেশনের উপর নির্ভর করে। যে অ্যাপগুলি বর্তমান তথ্যকে অগ্রাধিকার দেয়, যেমন আবহাওয়া বা স্টক মার্কেট ট্র্যাকার, স্বয়ংক্রিয়ভাবে আপডেট হওয়া উচিত এবং যত তাড়াতাড়ি সম্ভব ব্যবহারকারীকে জানানো উচিত।

আমরা সুপারিশ করছি যে আপনি একটি ম্যাটেরিয়াল ডিজাইন টোস্ট উপাদানের মতো একটি ভিজ্যুয়াল কিউ ব্যবহার করে আপনার ওয়েব অ্যাপ "পটভূমিতে" আপডেট হয়েছে তা ব্যবহারকারীকে জানান। এটি একটি পরিষেবা কর্মীর উপস্থিতি এবং তার পরিচালিত সামগ্রীর আপডেট উভয়ই সনাক্ত করে। আপনি এখানে কর্মক্ষেত্রে এই ফাংশনের একটি কোড উদাহরণ দেখতে পারেন।

এর একটি উদাহরণ হল ক্রোম প্ল্যাটফর্ম স্ট্যাটাস , যা অ্যাপটি আপডেট করা হলে ব্যবহারকারীর কাছে একটি নোট পোস্ট করে।

একটি উদাহরণ আবহাওয়া অ্যাপ।
কিছু অ্যাপ, যেমন ওয়েদার অ্যাপ, অটো-আপডেট করতে হবে কারণ পুরানো ডেটা কাজে লাগে না।
ক্রোম স্ট্যাটাস একটি টোস্ট ব্যবহার করে।
ক্রোম স্ট্যাটাসের মতো অ্যাপগুলি কন্টেন্ট আপডেট করা হলে ব্যবহারকারীকে জানাতে টোস্ট ব্যবহার করে।

কিছু অ্যাপ্লিকেশান সর্বদা দেখাতে পারে যে সেগুলি শেষ কখন আপডেট হয়েছিল৷ উদাহরণস্বরূপ, এটি মুদ্রা রূপান্তরকারী অ্যাপগুলির জন্য বিশেষভাবে উপযোগী।

ম্যাটেরিয়াল মানি অ্যাপটি পুরানো।
ম্যাটেরিয়াল মানি ক্যাশে রেট...
উপাদান অর্থ আপডেট করা হয়েছে.
…এবং অ্যাপ আপডেট করা হলে ব্যবহারকারীকে অবহিত করে।

নিউজ অ্যাপ্লিকেশানগুলি ব্যবহারকারীকে নতুন সামগ্রী সম্পর্কে অবহিত করে একটি সহজ ট্যাপ-টু-আপডেট বিজ্ঞপ্তি দেখাতে পারে। একটি নিবন্ধ স্বতঃ-আপডেট করার ফলে ব্যবহারকারীরা তাদের স্থান হারাতে পারে।

একটি উদাহরণ সংবাদ অ্যাপ, টেলপিস, তার স্বাভাবিক অবস্থায়
টেলপিস, একটি অনলাইন সংবাদপত্র, সর্বশেষ সংবাদ স্বয়ংক্রিয়ভাবে ডাউনলোড করে...
উদাহরণ সংবাদ অ্যাপ টেলপিস যখন এটি আপডেট করার জন্য প্রস্তুত
…কিন্তু ব্যবহারকারীদের ম্যানুয়ালি রিফ্রেশ করতে দেয় যাতে তারা কোনো নিবন্ধে তাদের স্থান না হারায়।

বর্তমান প্রাসঙ্গিক অবস্থা প্রতিফলিত করতে UI আপডেট করুন

প্রতিটি UI উপাদানের নিজস্ব প্রসঙ্গ এবং আচরণ থাকতে পারে যা সফল সংযোগের প্রয়োজন কিনা তার উপর নির্ভর করে পরিবর্তিত হয়। একটি উদাহরণ হল একটি ইকমার্স সাইট যা অফলাইনে ব্রাউজ করা যেতে পারে, কিন্তু সংযোগ পুনঃস্থাপিত না হওয়া পর্যন্ত মূল্য নির্ধারণ এবং কিনুন বোতামটি অক্ষম করে।

প্রাসঙ্গিক অবস্থার অন্যান্য ফর্ম ডেটা অন্তর্ভুক্ত করতে পারে। উদাহরণস্বরূপ, আর্থিক অ্যাপ রবিনহুড রঙ এবং গ্রাফিক্স ব্যবহার করে ব্যবহারকারীকে জানাতে যখন স্টক মার্কেট খোলা থাকে। বাজার বন্ধ হয়ে গেলে পুরো ইন্টারফেস সাদা হয়ে যায় এবং তারপর ধূসর হয়ে যায়। যখন একটি স্টকের মূল্য বৃদ্ধি বা হ্রাস পায়, প্রতিটি পৃথক স্টক উইজেট তার অবস্থার উপর নির্ভর করে সবুজ বা লাল হয়ে যায়।

ব্যবহারকারীকে শিক্ষিত করুন যাতে তারা বুঝতে পারে অফলাইন মডেল কী৷

বেশিরভাগ ব্যবহারকারী সবসময় একটি নেটওয়ার্ক সংযোগ থাকার জন্য অভ্যস্ত। যখন তাদের সংযোগ না থাকে তখন আপনার অ্যাপে কী পরিবর্তন হয় সে সম্পর্কে আপনাকে তাদের শিক্ষিত করতে হবে। তাদের বলুন কোথায় বড় ডেটা সংরক্ষণ করা হয়েছে এবং ডিফল্ট আচরণ পরিবর্তন করতে তাদের সেটিংস দিন। পুরো গল্পটি বলার জন্য একটি একক ডিজাইন পছন্দ, যেমন একটি আইকনের উপর নির্ভর না করে, এই ধারণাগুলি প্রকাশ করার জন্য একাধিক UI ডিজাইন উপাদান (যেমন তথ্যমূলক ভাষা, আইকন, বিজ্ঞপ্তি, রঙ এবং চিত্র) একসাথে ব্যবহার করুন।

ডিফল্টরূপে একটি অফলাইন অভিজ্ঞতা প্রদান করুন

যদি আপনার অ্যাপে বেশি ডেটার প্রয়োজন না হয়, তাহলে সেই ডেটা ডিফল্টরূপে ক্যাশে করুন। ব্যবহারকারীরা ক্রমবর্ধমান হতাশ হতে পারে যদি তারা শুধুমাত্র একটি নেটওয়ার্ক সংযোগের মাধ্যমে তাদের ডেটা অ্যাক্সেস করতে পারে।

অভিজ্ঞতা যতটা সম্ভব স্থিতিশীল করার চেষ্টা করুন। একটি অস্থির সংযোগ আপনার অ্যাপকে অবিশ্বস্ত বোধ করে। একটি অ্যাপ যা নেটওয়ার্ক ব্যর্থতার প্রভাবকে কম করে তার ব্যবহারকারীদের আনন্দিত করে

সংবাদ সাইটগুলি স্বয়ংক্রিয়-ডাউনলোডিং এবং সর্বশেষ সংবাদ স্বয়ংক্রিয়-সংরক্ষণের মাধ্যমে উপকৃত হতে পারে, হয়তো শুধুমাত্র পাঠ্য ডাউনলোড করে ডেটা সংরক্ষণ করে, তাই একজন ব্যবহারকারী সংযোগ ছাড়াই আজকের সংবাদ পড়তে পারেন। ব্যবহারকারীর সবচেয়ে বেশি দেখা সংবাদ বিভাগগুলি ডাউনলোড করার অগ্রাধিকার দিয়ে আপনি এই আচরণটিকে ব্যবহারকারীর আচরণের সাথে মানিয়ে নিতে পারেন৷

টেলপিস বিভিন্ন ডিজাইনের উইজেট ব্যবহার করে ব্যবহারকারীকে জানাতে যে তারা অফলাইন।
ডিভাইসটি অফলাইনে থাকলে, টেলপিস ব্যবহারকারীকে একটি স্ট্যাটাস মেসেজ দিয়ে অবহিত করে...
টেলপিসে একটি ভিজ্যুয়াল সূচক রয়েছে যা দেখায় যে কোন বিভাগগুলি অফলাইন ব্যবহারের জন্য প্রস্তুত।
…তাদের জানিয়ে দেওয়া যে তারা অন্তত আংশিকভাবে এখনও অ্যাপ ব্যবহার করতে পারে।

অ্যাপটি অফলাইন ব্যবহারের জন্য প্রস্তুত হলে ব্যবহারকারীকে জানান

যখন একটি ওয়েব অ্যাপ প্রথম লোড হয়, এটি অবশ্যই ব্যবহারকারীকে নির্দেশ করবে যে এটি অফলাইন ব্যবহারের জন্য প্রস্তুত কিনা। একটি উইজেট দিয়ে এটি করুন যা স্ক্রিনের নীচে একটি বার্তার মাধ্যমে একটি অপারেশন সম্পর্কে সংক্ষিপ্ত প্রতিক্রিয়া প্রদান করে যেমন, উদাহরণস্বরূপ, যখন একটি বিভাগ সিঙ্ক করা হয়েছে বা একটি ফাইল ডাউনলোড করা হয়েছে৷

নিশ্চিত করুন যে আপনি যে ভাষাটি ব্যবহার করছেন তা আপনার শ্রোতাদের সাথে খাপ খায় এবং এটি প্রযোজ্য সমস্ত ক্ষেত্রে একই বাক্যাংশ ব্যবহার করুন৷ অ-প্রযুক্তিগত শ্রোতারা প্রায়ই "অফলাইন" শব্দটিকে ভুল বোঝেন, তাই এর পরিবর্তে অ্যাকশন-ভিত্তিক ভাষা ব্যবহার করুন যা আপনার দর্শকদের সাথে সম্পর্কিত হতে পারে।

I/O অ্যাপ অফলাইন।
অ্যাপটি অফলাইনে ব্যবহারের জন্য প্রস্তুত হলে Google I/O 2016 অ্যাপ ব্যবহারকারীকে জানিয়ে দেয়...
ক্রোম স্ট্যাটাস সাইট অফলাইন।
…এবং তাই ক্রোম প্ল্যাটফর্ম স্ট্যাটাস সাইট, যা দখলকৃত সঞ্চয়স্থান সম্পর্কে তথ্য অন্তর্ভুক্ত করে।

ইন্টারফেসে 'অফলাইনের জন্য সংরক্ষণ করুন' সুস্পষ্ট করুন

যদি একটি অ্যাপ্লিকেশন প্রচুর ডেটা ব্যবহার করে, অফলাইনে ব্যবহারের জন্য একটি আইটেম যোগ করার জন্য একটি সুইচ বা পিন আছে তা নিশ্চিত করুন৷ কোনো ব্যবহারকারী নির্দিষ্টভাবে সেটিংস মেনুর মাধ্যমে এই আচরণের জন্য জিজ্ঞাসা করলেই কেবলমাত্র স্বয়ংক্রিয়ভাবে ফাইলগুলি ডাউনলোড করুন৷ নিশ্চিত করুন যে পিন বা ডাউনলোড UI ব্যবহারকারীর কাছে স্পষ্ট এবং অন্যান্য UI উপাদান দ্বারা লুকানো নয়৷

এর একটি উদাহরণ হল একটি মিউজিক প্লেয়ার যার জন্য বড় ফাইল প্রয়োজন। ব্যবহারকারী সংশ্লিষ্ট ডেটা খরচ সম্পর্কে সচেতন, কিন্তু প্লেয়ারটি অফলাইনেও ব্যবহার করতে চাইতে পারে। পরবর্তী ব্যবহারের জন্য সঙ্গীত ডাউনলোড করার জন্য ব্যবহারকারীকে আগে থেকে পরিকল্পনা করতে হবে, তাই আপনি সম্ভবত অনবোর্ডিংয়ের সময় ব্যবহারকারীকে এটি সম্পর্কে শিক্ষিত করতে চান।

অফলাইনে কি পাওয়া যায় তা স্পষ্ট করুন

আপনি কি বিকল্পগুলি প্রদান করছেন সে সম্পর্কে পরিষ্কার হন। আপনাকে একটি "অফলাইন লাইব্রেরি" বা বিষয়বস্তু সূচকের জন্য একটি ট্যাব বা সেটিং দেখাতে হতে পারে যাতে ব্যবহারকারী দেখতে পারে তারা তাদের ডিভাইসে কী সঞ্চয় করেছে এবং কী সংরক্ষণ করা দরকার৷ সেটিংস সংক্ষিপ্ত কিনা তা নিশ্চিত করুন এবং ডেটা কোথায় সঞ্চয় করা হয়েছে এবং কার এতে অ্যাক্সেস রয়েছে সে সম্পর্কে পরিষ্কার থাকুন৷

একটি কর্মের প্রকৃত মূল্য দেখান

অনেক ব্যবহারকারী অফলাইন ক্ষমতাকে 'ডাউনলোডিং'-এর সাথে সমান করে। যেসব দেশে নেটওয়ার্ক কানেকশন নিয়মিতভাবে ব্যর্থ হয় বা পাওয়া যায় না সেসব দেশের ব্যবহারকারীরা প্রায়শই অন্যান্য ব্যবহারকারীদের সাথে বিষয়বস্তু শেয়ার করে, অথবা তাদের সংযোগ থাকলে অফলাইন ব্যবহারের জন্য সামগ্রী সংরক্ষণ করে।

ডেটা প্ল্যানের ব্যবহারকারীরা কখনও কখনও খরচের ভয়ে বড় ফাইল ডাউনলোড করা এড়িয়ে যান, তাই আপনি একটি সংশ্লিষ্ট খরচও প্রদর্শন করতে চাইতে পারেন যাতে ব্যবহারকারীরা একটি নির্দিষ্ট ফাইল বা কাজের জন্য একটি সক্রিয় তুলনা করতে পারে। উদাহরণস্বরূপ, পূর্বোক্ত মিউজিক অ্যাপ ব্যবহারকারী একটি ডেটা প্ল্যানে আছে কিনা তা সনাক্ত করতে পারে এবং ফাইলের আকার দেখাতে পারে যাতে ব্যবহারকারী একটি ফাইলের খরচ দেখতে পারে।

হ্যাক অভিজ্ঞতা প্রতিরোধ করতে সাহায্য করুন

ব্যবহারকারীরা প্রায়শই একটি অভিজ্ঞতা হ্যাক করে না বুঝেই তারা এটি করছেন। উদাহরণস্বরূপ, ক্লাউড-ভিত্তিক ফাইল-শেয়ারিং ওয়েব অ্যাপ্লিকেশানগুলির অস্তিত্বের আগে, ব্যবহারকারীদের জন্য বড় ফাইলগুলি সংরক্ষণ করা এবং ইমেলগুলিতে সংযুক্ত করা সাধারণ ছিল যাতে তারা একটি ভিন্ন ডিভাইস থেকে সেই ফাইলগুলি সম্পাদনা চালিয়ে যেতে পারে। হ্যাকড অভিজ্ঞতায় টানা না হয়ে ব্যবহারকারীরা যে সমস্যার সমাধান করার চেষ্টা করছেন ভালো UI সমাধান করে। উদাহরণস্বরূপ, ইমেলগুলিতে বড় ফাইল সংযুক্ত করাকে আরও ব্যবহারকারী-বান্ধব করার পরিবর্তে ডিভাইস জুড়ে বড় ফাইলগুলি ভাগ করার একটি উপায় সরবরাহ করুন৷

এক ডিভাইস থেকে অন্য ডিভাইসে অভিজ্ঞতা হস্তান্তরযোগ্য করুন

ফ্ল্যাকি নেটওয়ার্কের জন্য তৈরি করার সময়, সংযোগের উন্নতি হওয়ার সাথে সাথে সিঙ্ক করার চেষ্টা করুন যাতে অভিজ্ঞতা স্থানান্তরযোগ্য হয়। উদাহরণস্বরূপ, কল্পনা করুন যে একটি ভ্রমণ অ্যাপ বুকিংয়ের মাধ্যমে মাঝপথে নেটওয়ার্ক সংযোগ হারিয়ে ফেলেছে। সংযোগটি পুনঃস্থাপিত হলে, অ্যাপটি ব্যবহারকারীর অ্যাকাউন্টের সাথে সিঙ্ক করে, তাদের ডেস্কটপ ডিভাইসে তাদের বুকিং চালিয়ে যেতে দেয় এবং অভিজ্ঞতাকে নির্বিঘ্ন বোধ করে।

ব্যবহারকারীকে বলুন তাদের ডেটা কোন অবস্থায় আছে৷ উদাহরণস্বরূপ, অ্যাপটি সিঙ্ক হয়েছে কিনা তা আপনি দেখাতে পারেন৷ যেখানে সম্ভব তাদের শিক্ষিত করুন, কিন্তু অত্যধিক মেসেজিং দিয়ে তাদের অভিভূত না করার চেষ্টা করুন।

অন্তর্ভুক্তিমূলক ডিজাইন অভিজ্ঞতা তৈরি করুন

আপনার UX ডিজাইন করার সময়, অর্থপূর্ণ ডিজাইন ডিভাইস, সহজ ভাষা, স্ট্যান্ডার্ড আইকনোগ্রাফি এবং অর্থপূর্ণ চিত্র প্রদানের মাধ্যমে অন্তর্ভুক্ত হওয়ার চেষ্টা করুন যা ব্যবহারকারীকে পথ না পেয়ে ক্রিয়া বা কাজটি সম্পূর্ণ করতে গাইড করে।

সহজ, পরিষ্কার ভাষা ব্যবহার করুন

ভাল UX শুধুমাত্র আপনার ইন্টারফেস ডিজাইন করা সম্পর্কে নয়। এটিতে ব্যবহারকারী আপনার অ্যাপের মাধ্যমে যে পথটি নেয় এবং সেই পথের সাথে তারা যে সমস্ত কিছুর মুখোমুখি হয় তা অন্তর্ভুক্ত করে, সেই যাত্রা বর্ণনা করতে অ্যাপটি যে ভাষা ব্যবহার করে তা সহ। UI উপাদান বা অ্যাপের অবস্থা ব্যাখ্যা করার সময়, প্রযুক্তিগত শব্দচয়ন এড়িয়ে চলুন। "অফলাইন" শব্দটি প্রায়শই ব্যবহারকারীকে আপনার অ্যাপ কী করছে তা বলার জন্য যথেষ্ট পরিষ্কার নয়।

করবেন না
একটি পরিষেবা কর্মী আইকন একটি খারাপ উদাহরণ.
শর্তাবলী এড়িয়ে চলুন অ-প্রযুক্তিগত ব্যবহারকারীরা সম্ভবত জানেন না.
করবেন
একটি ডাউনলোড আইকন একটি ভাল উদাহরণ।
ব্যবহারকারী আসলে কী করছেন তা বর্ণনা করে এমন ভাষা এবং চিত্র ব্যবহার করুন।

অ্যাক্সেসযোগ্য ব্যবহারকারীর অভিজ্ঞতা তৈরি করতে একাধিক ডিজাইন ডিভাইস ব্যবহার করুন

স্থিতি বা অবস্থার পরিবর্তন দেখাতে ভাষা, রঙ এবং ভিজ্যুয়াল উপাদান ব্যবহার করুন। অবস্থা দেখানোর জন্য শুধুমাত্র রঙ ব্যবহার করা ব্যবহারকারীদের লক্ষ্য করা কঠিন হতে পারে, অথবা এমনকি দৃষ্টি প্রতিবন্ধী ব্যবহারকারীদের কাছে সম্পূর্ণরূপে অ্যাক্সেসযোগ্য নয়। এছাড়াও, যেহেতু ওয়েব ডিজাইন অক্ষম উপাদানগুলির জন্য ধূসর ব্যবহার করার প্রবণতা রাখে, তাই আপনার অ্যাপ অফলাইন রয়েছে তা দেখানোর জন্য ধূসর UI ব্যবহার করলে অফলাইনে আপনার অ্যাপ কী করতে পারে তা নিয়ে বিভ্রান্তি সৃষ্টি করতে পারে, বিশেষ করে যদি আপনি অবস্থা দেখানোর জন্য শুধুমাত্র রঙ ব্যবহার করেন।

ভুল বোঝাবুঝি রোধ করতে, একাধিক উপায়ে ব্যবহারকারীর কাছে অ্যাপ স্টেটগুলি প্রকাশ করুন, উদাহরণস্বরূপ রঙ, লেবেল এবং UI উপাদানগুলির সাথে৷

করবেন
একটি ভাল উদাহরণ যা একটি ত্রুটি দেখানোর জন্য রঙ এবং পাঠ্য ব্যবহার করে।
অর্থ বোঝাতে নকশা উপাদানের মিশ্রণ ব্যবহার করুন।
করবেন না
শুধুমাত্র রঙ ব্যবহার করে একটি খারাপ উদাহরণ।
শুধুমাত্র রঙ ব্যবহার করা বিভ্রান্তিকর বা বিভ্রান্তিকর হতে পারে।

অর্থ প্রকাশ করে এমন আইকন ব্যবহার করুন

আপনার আইকনগুলির পাশাপাশি অর্থপূর্ণ পাঠ্য লেবেলগুলি ব্যবহার করা নিশ্চিত করুন৷ শুধুমাত্র আইকনগুলিই বিভ্রান্তিকর হতে পারে, বিশেষ করে কারণ ওয়েবে 'অফলাইন' ধারণাটি তুলনামূলকভাবে নতুন। বিভ্রান্তিকর আইকনগুলির অন্যান্য ক্ষেত্রে 'সংরক্ষণ' উপস্থাপন করার জন্য একটি ফ্লপি ডিস্ক ব্যবহার করা অন্তর্ভুক্ত, যা তরুণ ব্যবহারকারীদের কাছে অর্থহীন হতে পারে যারা ফ্লপি ডিস্ক কখনও দেখেননি, সেইসাথে 'হ্যামবার্গার' মেনু আইকন।

একটি অফলাইন আইকন প্রবর্তন করার সময়, শিল্পের স্ট্যান্ডার্ড ভিজ্যুয়ালগুলির সাথে সামঞ্জস্যপূর্ণ থাকুন যখন সেগুলি বিদ্যমান থাকবে এবং একটি পাঠ্য লেবেল এবং বিবরণ প্রদান করুন৷ উদাহরণস্বরূপ, আপনি অফলাইনে সংরক্ষণ করার জন্য একটি ডাউনলোড আইকন ব্যবহার করতে পারেন, একটি সিঙ্ক আইকন যাতে সিঙ্ক করা হয়। স্থিতি প্রদর্শন করার জন্য আইকন ব্যবহার করার সময় সতর্কতা অবলম্বন করুন যা পরিবর্তে একটি সংরক্ষণ বা ডাউনলোড ক্রিয়া হিসাবে ব্যাখ্যা করা যেতে পারে।

বিভিন্ন আইকনের উদাহরণ যা অফলাইনে বোঝায়
কিছু আইকন যার অর্থ হতে পারে 'অফলাইন'।

আরও অনুপ্রেরণার জন্য, মেটেরিয়াল ডিজাইন আইকন সেটটি পড়ুন।

কঙ্কাল লেআউট এবং অন্যান্য প্রতিক্রিয়া প্রক্রিয়া ব্যবহার করুন

যখন আপনার অ্যাপ কন্টেন্ট লোড করছে, ব্যবহারকারীকে দেখান যে এটি লোড হচ্ছে যাতে তারা মনে না করে এটি নষ্ট হয়ে গেছে। এটি করার একটি উপায় হল একটি কঙ্কাল লেআউট ব্যবহার করা, আপনার অ্যাপের একটি ওয়্যারফ্রেম সংস্করণ যা সামগ্রী লোড হওয়ার সময় প্রদর্শিত হয়৷ ব্যবহারকারীকে অ্যাপটি লোড হচ্ছে বলে একটি টেক্সট লেবেল সহ একটি প্রিলোডার UI ব্যবহার করার কথাও বিবেচনা করুন, অথবা ওয়্যারফ্রেমের জন্য একটি মৃদু স্পন্দিত অ্যানিমেশন যাতে এটি জীবন্ত এবং লোড হচ্ছে বলে মনে হয়৷ এটি ব্যবহারকারীকে আশ্বস্ত করে যে কিছু ঘটছে এবং পুনরায় জমা দেওয়া বা অপ্রয়োজনীয় রিফ্রেশ প্রতিরোধে সহায়তা করে।

একটি কঙ্কাল লেআউট উদাহরণ.
নিবন্ধটি ডাউনলোড করার সময় একটি কঙ্কাল প্লেসহোল্ডার লেআউট দেখানো হয়েছে...
একটি লোড নিবন্ধ উদাহরণ.
… যেটি ডাউনলোড শেষ হলে বাস্তব বিষয়বস্তুর সাথে প্রতিস্থাপিত হয়।

প্রতিক্রিয়া প্রদান করে একটি কর্মের অবস্থা দেখান। উদাহরণস্বরূপ, যদি একজন ব্যবহারকারী অফলাইনে একটি দস্তাবেজ সম্পাদনা করে থাকেন, তাহলে প্রতিক্রিয়ার নকশা পরিবর্তন করার কথা বিবেচনা করুন যাতে তারা অনলাইনে থাকার সময় থেকে এটি দৃশ্যমানভাবে আলাদা কিন্তু তবুও দেখায় যে তাদের ফাইল "সংরক্ষিত" হয়েছে এবং যখন তাদের নেটওয়ার্ক সংযোগ থাকবে তখন সিঙ্ক হবে৷ এটি ব্যবহারকারীকে আপনার অ্যাপটি কীভাবে কাজ করে সে সম্পর্কে শিক্ষিত করে এবং তাদের আশ্বস্ত করে যে তাদের কাজ বা ক্রিয়া সংরক্ষণ করা হয়েছে, যা তাদের আপনার অ্যাপ্লিকেশন ব্যবহারে আরও আত্মবিশ্বাসী করে তুলতে পারে।

কন্টেন্ট ব্লক করবেন না

কিছু অ্যাপ্লিকেশানে, একজন ব্যবহারকারী একটি নতুন দস্তাবেজ তৈরি করার মতো একটি অ্যাকশন ট্রিগার করতে পারে। কিছু অ্যাপ নতুন ডকুমেন্ট সিঙ্ক করতে একটি সার্ভারের সাথে সংযোগ করার চেষ্টা করে এবং এটি প্রদর্শন করার জন্য তারা একটি অনুপ্রবেশকারী লোডিং মডেল ডায়ালগ প্রদর্শন করে যা পুরো স্ক্রীন জুড়ে থাকে। ব্যবহারকারীর একটি স্থিতিশীল নেটওয়ার্ক সংযোগ থাকলে এটি কাজ করতে পারে, কিন্তু যদি নেটওয়ার্কটি অস্থির হয়, তারা এই ক্রিয়া থেকে পালাতে সক্ষম হবে না, তাই UI তাদের অন্য কিছু করা থেকে ব্লক করে।

কন্টেন্ট ব্লক করে এমন নেটওয়ার্ক অনুরোধ এড়িয়ে চলুন। ব্যবহারকারীকে আপনার অ্যাপ ব্রাউজ করা চালিয়ে যেতে দিন এবং কানেকশনের উন্নতি হলে সঞ্চালিত এবং সিঙ্ক করা হবে এমন কাজগুলি সারিবদ্ধ করুন৷

পরবর্তী বিলিয়নের জন্য ডিজাইন

অনেক অঞ্চলে, লো-এন্ড ডিভাইসগুলি সাধারণ, সংযোগ অবিশ্বাস্য এবং অনেক ব্যবহারকারীর জন্য, ডেটা অত্যন্ত ব্যয়বহুল। ডেটার সাথে স্বচ্ছ এবং মিতব্যয়ী হয়ে আপনার ব্যবহারকারীদের আস্থা অর্জন করুন। দুর্বল সংযোগগুলিতে ব্যবহারকারীদের সাহায্য করার উপায়গুলি সম্পর্কে চিন্তা করুন এবং কাজগুলিকে গতি বাড়ানোর জন্য ইন্টারফেসটিকে সরল করুন৷ ডেটা-ভারী সামগ্রী ডাউনলোড করার আগে সর্বদা ব্যবহারকারীদের জিজ্ঞাসা করার চেষ্টা করুন।

ল্যাজি সংযোগে ব্যবহারকারীদের জন্য কম-ব্যান্ডউইথ বিকল্পগুলি অফার করুন। ধীরগতির নেটওয়ার্ক সংযোগে ছোট সম্পদ প্রদান করুন, অথবা উচ্চ বা নিম্ন মানের সম্পদ চয়ন করার জন্য একটি বিকল্প অফার করুন।

উপসংহার

শিক্ষা অফলাইন ইউএক্সের চাবিকাঠি কারণ ব্যবহারকারীরা এটির সাথে অপরিচিত। তাদের শিখতে সাহায্য করার জন্য, পরিচিত ধারণাগুলির সাথে অ্যাসোসিয়েশন তৈরি করার চেষ্টা করুন, যেমন ব্যাখ্যা করা যে পরবর্তীতে ব্যবহারের জন্য ডাউনলোড করা ডেটা অফলাইন করার মতোই।

অস্থির নেটওয়ার্ক সংযোগের জন্য ডিজাইন করার সময়, এই নির্দেশিকাগুলি মনে রাখবেন:

  • একটি নেটওয়ার্ক সংযোগের সাফল্য, ব্যর্থতা এবং অস্থিরতার জন্য ডিজাইন।
  • ডেটা ব্যয়বহুল হতে পারে, তাই ব্যবহারকারীর প্রতি যত্নবান হন।
  • বিশ্বব্যাপী বেশিরভাগ ব্যবহারকারীর জন্য, প্রযুক্তিগত পরিবেশ প্রায় একচেটিয়াভাবে মোবাইল।
  • সীমিত স্টোরেজ, মেমরি এবং প্রসেসিং পাওয়ার, ছোট ডিসপ্লে এবং নিম্ন টাচস্ক্রিন গুণমান সহ নিম্নমানের ডিভাইসগুলি সাধারণ বিষয়। কর্মক্ষমতা আপনার নকশা প্রক্রিয়া একটি অংশ নিশ্চিত করুন.
  • ব্যবহারকারীরা অফলাইনে থাকাকালীন আপনার অ্যাপ্লিকেশন ব্রাউজ করার অনুমতি দিন।
  • ব্যবহারকারীদের তাদের বর্তমান অবস্থা এবং রাজ্যের পরিবর্তন সম্পর্কে অবহিত করুন।
  • আপনার অ্যাপে বেশি ডেটার প্রয়োজন না হলে ডিফল্টরূপে অফলাইন প্রদান করার চেষ্টা করুন।
  • অ্যাপটি ডেটা-ভারী হলে, ব্যবহারকারীদের শিক্ষিত করুন যে তারা কীভাবে অফলাইন ব্যবহারের জন্য ডাউনলোড করতে পারে।
  • ডিভাইসের মধ্যে অভিজ্ঞতা হস্তান্তরযোগ্য করুন।
  • ব্যবহারকারীর কাছে ধারণা প্রকাশ করতে ভাষা, আইকন, চিত্র, টাইপোগ্রাফি এবং রঙ একসাথে ব্যবহার করুন।
  • ব্যবহারকারীকে সাহায্য করার জন্য আশ্বাস এবং প্রতিক্রিয়া প্রদান করুন।