ন্যাভিগেশন ড্রয়ারগুলি যেকোনো টিভি অ্যাপে অপরিহার্য উপাদান কারণ তারা ব্যবহারকারীদের বিভিন্ন গন্তব্য এবং বৈশিষ্ট্যগুলি অ্যাক্সেস করতে দেয়। একটি নেভিগেশন ড্রয়ার হল অ্যাপের তথ্য স্থাপত্যের মেরুদণ্ড, যা অ্যাপের মাধ্যমে নেভিগেট করার একটি পরিষ্কার এবং স্বজ্ঞাত উপায় প্রদান করে।
মোবাইল নেভিগেশন ড্রয়ারের বিপরীতে, টিভিতে নেভিগেশন ড্রয়ারে ব্যবহারকারীর কাছে প্রসারিত এবং ভেঙে পড়া উভয় অবস্থাই রয়েছে।
সম্পদ
টাইপ | লিঙ্ক | স্ট্যাটাস |
---|---|---|
ডিজাইন | ডিজাইন সোর্স (ফিগমা) | পাওয়া যায় |
বাস্তবায়ন | জেটপ্যাক রচনা (নেভিগেশন ড্রয়ার) জেটপ্যাক কম্পোজ (মডাল নেভিগেশন ড্রয়ার) | পাওয়া যায় |
হাইলাইট
- গন্তব্যগুলি ব্যবহারকারীর গুরুত্ব অনুসারে অর্ডার করা হয়, ঘন ঘন গন্তব্যগুলি প্রথমে এবং সম্পর্কিত গন্তব্যগুলি একসাথে গোষ্ঠীভুক্ত করা হয়৷
- ধসে পড়লে স্ট্যান্ডার্ড এবং মডেল নেভিগেশন ড্রয়ারের জন্য একটি নেভিগেশন রেল প্রয়োজন।
বৈকল্পিক
দুটি ধরণের নেভিগেশন ড্রয়ার শৈলী রয়েছে:
- স্ট্যান্ডার্ড নেভিগেশন ড্রয়ার — নেভিগেশনের জন্য অতিরিক্ত স্থান তৈরি করতে প্রসারিত হয়, পৃষ্ঠার বিষয়বস্তুকে একপাশে সরিয়ে দেয়।
- মোডাল নেভিগেশন ড্রয়ার — অ্যাপের বিষয়বস্তুর উপরে একটি স্ক্রিম সহ একটি ওভারলে হিসাবে উপস্থিত হয় যা ড্রয়ারটি প্রসারিত হলে পঠনযোগ্যতা উন্নত করতে সহায়তা করে।
স্ট্যান্ডার্ড নেভিগেশন ড্রয়ার
অ্যানাটমি
- শীর্ষ বিভাগ: অ্যাপ্লিকেশন লোগো বৈশিষ্ট্য. প্রোফাইল স্যুইচ করতে বা সার্চ অ্যাকশন ট্রিগার করতে একটি বোতাম হিসেবে কাজ করে। ভেঙে পড়া অবস্থায়, উপরের পাত্রে শুধুমাত্র আইকনটি দৃশ্যমান থাকে।
- নেভিগেশন আইটেম: নেভিগেশন রেলের প্রতিটি আইটেমে একটি আইকন এবং পাঠ্যের সংমিশ্রণ রয়েছে, শুধুমাত্র আইকনটি ভেঙে যাওয়া অবস্থায় দৃশ্যমান।
- ন্যাভিগেশন রেল: নেভিগেশন রেল হল একটি কলাম যা 3 থেকে 7টি অ্যাপের গন্তব্য দেখায়, প্রধান মেনু হিসাবে কাজ করে। প্রতিটি গন্তব্যে একটি টেক্সট লেবেল এবং একটি ঐচ্ছিক আইকন রয়েছে, যেখানে আরও ভাল প্রাসঙ্গিকতার জন্য মেনু আইটেমগুলিকে গ্রুপ করার বিকল্প রয়েছে৷
- নীচের অংশ: এক থেকে তিনটি অ্যাকশন বোতাম থাকতে পারে, যা সেটিংস, সাহায্য বা প্রোফাইলের মতো পৃষ্ঠাগুলির জন্য আদর্শ৷
আচরণ
- ন্যাভিগেশন ড্রয়ারের প্রসারণ: প্রসারিত হলে স্ট্যান্ডার্ড নেভিগেশন ড্রয়ারগুলি নেভিগেশনের জন্য প্রসারিত সংস্করণের জন্য পৃষ্ঠার বিষয়বস্তুকে স্থান দেয়।
- নেভিগেশন আপডেট: একটি নেভিগেশন আইটেম থেকে অন্য আইটেম সরানো, পৃষ্ঠাটি স্বয়ংক্রিয়ভাবে নতুন গন্তব্যে আপডেট হয়।
মোডাল নেভিগেশন ড্রয়ার
অ্যানাটমি
- শীর্ষ বিভাগ: অ্যাপ্লিকেশন লোগো বৈশিষ্ট্য. প্রোফাইল স্যুইচ করতে বা সার্চ অ্যাকশন ট্রিগার করার জন্য একটি বোতাম হিসেবে কাজ করে। ভেঙে পড়া অবস্থায়, উপরের পাত্রে শুধুমাত্র আইকনটি দৃশ্যমান থাকে।
- নেভিগেশন আইটেম: নেভিগেশন রেলের প্রতিটি আইটেমে একটি আইকন এবং পাঠ্যের সংমিশ্রণ রয়েছে, শুধুমাত্র আইকনটি ভেঙে যাওয়া অবস্থায় দৃশ্যমান।
- ন্যাভিগেশন রেল: কলাম যা তিন থেকে সাতটি অ্যাপের গন্তব্য দেখায়, প্রধান মেনু হিসাবে কাজ করে। প্রতিটি গন্তব্যে একটি টেক্সট লেবেল এবং একটি ঐচ্ছিক আইকন রয়েছে, যেখানে আরও ভাল প্রাসঙ্গিকতার জন্য মেনু আইটেমগুলিকে গ্রুপ করার বিকল্প রয়েছে৷
- Scrim: নেভিগেশন আইটেম টেক্সট ভাল পঠনযোগ্যতার জন্য.
- নীচের অংশ: এক থেকে তিনটি অ্যাকশন বোতাম থাকতে পারে, যা সেটিংস, সাহায্য বা প্রোফাইলের মতো পৃষ্ঠাগুলির জন্য আদর্শ৷
আচরণ
- ড্রয়ারের সম্প্রসারণ: অ্যাপের বিষয়বস্তুর উপরে একটি ওভারলে হিসাবে উপস্থিত হয়, একটি স্ক্রিম সহ যা ড্রয়ারটি প্রসারিত হলে পঠনযোগ্যতা উন্নত করে।
- নেভিগেশন আপডেট: ব্যবহারকারী যখন একটি নেভিগেশন আইটেম নির্বাচন করে তখন ঘটে।
স্ক্রিম
মডেল নেভিগেশন ড্রয়ারের জন্য, ড্রয়ারের পিছনে একটি স্ক্রিম নিশ্চিত করে যে ড্রয়ারের বিষয়বস্তু পাঠযোগ্য। আপনি UI এর বিভিন্ন বৈচিত্র তৈরি করতে নেভিগেশন ড্রয়ারের পিছনে একটি গ্রেডিয়েন্ট বা কঠিন পৃষ্ঠ ব্যবহার করতে পারেন।

গ্রেডিয়েন্ট স্ক্রিম

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

বিভাজক (ঐচ্ছিক)
ভাল সংগঠনের জন্য নেভিগেশন ড্রয়ারের মধ্যে গন্তব্যের গ্রুপগুলিকে আলাদা করতে ডিভাইডারগুলি ব্যবহার করা যেতে পারে। যাইহোক, এগুলিকে অল্প পরিমাণে ব্যবহার করা গুরুত্বপূর্ণ কারণ অনেকগুলি বিভাজক ভিজ্যুয়াল শব্দ তৈরি করতে পারে এবং ব্যবহারকারীদের জন্য অপ্রয়োজনীয় জ্ঞানীয় ওভারলোড যোগ করতে পারে।

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

ব্যাজ প্রসারিত হয়েছে

ব্যাজ ভেঙে পড়েছে
লেবেল
নেভিগেশন ড্রয়ারের লেবেলগুলি পরিষ্কার এবং সংক্ষিপ্ত হওয়া উচিত যাতে সেগুলি পড়তে সহজ হয়৷

সতর্কতা

করবেন না

করবেন না

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

করবেন
