রঙ

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

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

এক নজরে নির্দেশিকা (TL;DR)

  • দিন এবং রাত উভয় সময় গাড়ি চালানোর জন্য আপনার পছন্দের রঙ কালো থেকে তৈরি করুন
  • ব্যাকগ্রাউন্ড এবং আইকন বা টেক্সটের মধ্যে কমপক্ষে ৪.৫:১ কনট্রাস্ট অনুপাত বজায় রাখুন।
  • রঙ ব্যবহার করুন ন্যূনতম, উদ্দেশ্যমূলকভাবে
  • গ্রেস্কেলের মাধ্যমে উচ্চতা দেখান
  • ভিজ্যুয়াল ফোকাস পরিচালনার জন্য স্বচ্ছতা এবং অস্বচ্ছতা ব্যবহার করুন

প্যালেট এবং গ্রেডিয়েন্ট

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

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

কলআউট আইকন
মেটেরিয়াল ডিজাইন
রঙের ব্যবহার এবং প্যালেট

অ্যান্ড্রয়েড অটোমোটিভ ওএস গ্রেস্কেল প্যালেট

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

এই প্যালেটটি যথেষ্ট বৈচিত্র্যময় হওয়া প্রয়োজন যাতে:

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

টোনাল পার্থক্যগুলি সত্যিকারের কালো ব্যাকগ্রাউন্ডেও গভীরতার বিভ্রম তৈরি করে যেখানে ছায়া অদৃশ্য। পর্যাপ্ত টোনাল পার্থক্য প্রদানের জন্য, অ্যান্ড্রয়েড অটোমোটিভ ওএস গ্রেস্কেল প্যালেটে মাঝারি ধূসর অন্তর্ভুক্ত করা হয়েছে। ধূসর 900 থেকে শুরু করে মেটেরিয়াল ডিজাইনের ধূসর রঙগুলি খুব দ্রুত উজ্জ্বল রঙগুলিতে পৌঁছায়; দুই ধাপ হালকা রঙ হবে ধূসর 700, যা অটো কনটেক্সটের জন্য খুব উজ্জ্বল।

কম্পোনেন্ট উচ্চতা চার্ট
এই চার্টটি বিভিন্ন উপাদানের উচ্চতার স্তরগুলি দেখায়। প্রতিটি উচ্চতা স্তরের একটি সম্পর্কিত ধূসর মান রয়েছে।
দিন এবং রাতের মোড গ্রেস্কেল উচ্চতার স্তর
এই চার্টটি দিন এবং রাতের মোডে বিভিন্ন উচ্চতা স্তরের সাথে সম্পর্কিত ধূসর মানগুলি দেখায়।

অ্যাকসেন্ট রঙ

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

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

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

অস্বচ্ছতা-মান চার্ট

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

গাঢ় অস্বচ্ছতার মান

গাঢ় অস্বচ্ছতার মানগুলির জন্য সবচেয়ে সাধারণ ব্যবহারের ক্ষেত্রে হল স্ক্রিম (ওভারলে) তৈরি করা।

ওভারলেগুলির জন্য কালো অস্বচ্ছতার মান

সাদা অস্বচ্ছতার মান

এই মানগুলি বেশিরভাগই টেক্সটে ব্যবহৃত হয়। পটভূমি রঙিন হলে এগুলি বিশেষভাবে কার্যকর। গাঢ়, রঙিন পটভূমিতে ঘন ধূসর ব্যবহার করলে খুব বেশি ঘোলাটে দেখায়।

টেক্সটের জন্য সাদা অস্বচ্ছতার মান

স্ক্রিম এবং টেক্সট হায়ারার্কিতে অস্বচ্ছতা কীভাবে ব্যবহার করবেন তার উদাহরণের জন্য, নির্দেশিকা এবং উদাহরণ দেখুন।


বৈসাদৃশ্য

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

কনট্রাস্ট ডু

কর

নিশ্চিত করুন যে সমস্ত পঠনযোগ্য এবং কার্যকর কন্টেন্টের জন্য কন্ট্রাস্ট ন্যূনতম ৪.৫:১ অনুপাত পূরণ করে।
বৈসাদৃশ্য না

করো না

৪.৫:১ এর নিচে কন্ট্রাস্ট না নামিয়ে চালকের নিরাপত্তা হ্রাস করবেন না।

নির্দেশনা এবং উদাহরণ

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

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

  • অস্পষ্ট পটভূমি
  • ধারাবাহিকতা বজায় রাখা
  • একটি ভিজ্যুয়াল শ্রেণিবিন্যাস প্রতিষ্ঠা করা যা ব্যবহারকারীর মনোযোগ প্রাথমিক ক্রিয়াগুলির দিকে আকর্ষণ করে।
  • তালিকায় সত্তার পার্থক্য নির্ণয়

স্ক্রিম দিয়ে ব্যাকগ্রাউন্ড অস্পষ্ট করা

পূর্ণ-স্ক্রিন স্ক্রিম (ওভারলে) ব্যবহার করা হয় বিঘ্নকারী উপাদানগুলির পিছনের পটভূমিগুলিকে ঢেকে রাখার জন্য, যেমন ডায়ালগ যেখানে ব্যবহারকারীদের কোনও পদক্ষেপ নিতে হয়। আংশিক স্ক্রিমগুলি বিজ্ঞপ্তির মতো উপাদানগুলির পরিবর্তনের দিকে দৃষ্টি আকর্ষণ করার জন্য ব্যবহৃত হয়।

ডে মোডে ফুল স্ক্রিম
ডে মোডে ফুল স্ক্রিম (ডায়ালগ কার্ডের পিছনে)
নাইট মোডে ফুল স্ক্রিম
নাইট মোডে ফুল স্ক্রিম (ডায়লগ কার্ডের পিছনে)
ডে মোডে আংশিক স্ক্রিম
দিনের মোডে আংশিক স্ক্রিম (বিজ্ঞপ্তির পিছনে)
নাইট মোডে আংশিক স্ক্রিম
নাইট মোডে আংশিক স্ক্রিম (বিজ্ঞপ্তির পিছনে)

রঙের সাথে সামঞ্জস্য বজায় রাখা

রঙ স্মৃতিশক্তি এবং স্বীকৃতি জোরদার করার জন্য একটি শক্তিশালী সূত্র। পর্দা থেকে পর্দায় একটি সুসংগত অভিজ্ঞতা তৈরি করতে এটি ব্যবহার করুন।

ভিজ্যুয়াল রঙ স্বীকৃতি

কর

একাধিক ভিউ জুড়ে একটি আইটেমের জন্য একই রঙ ব্যবহার করে ভিজ্যুয়াল ধারাবাহিকতা বজায় রাখুন, যেমন এখানে টার্ন-বাই-টার্ন নেভিগেশন ভিউয়ের জন্য ব্যবহৃত সবুজ রঙ।
ভিজ্যুয়াল রঙের ধারাবাহিকতা

কর

এখানে দেখানো লাল হ্যাং-আপ CTA-এর মতো সম্পর্কিত উপাদান এবং ফাংশনগুলিকে দৃশ্যত সংযুক্ত করতে রঙ ব্যবহার করুন।
অ্যাপের স্থায়ী অ্যাকসেন্ট রঙ

কর

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

করো না

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

একটি ভিজ্যুয়াল শ্রেণিবিন্যাস প্রতিষ্ঠা করা

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

ভিজ্যুয়াল শ্রেণিবিন্যাস বজায় রাখার জন্য অস্বচ্ছতা এবং বৈসাদৃশ্যের উদাহরণ

কর

একটি ভিজ্যুয়াল শ্রেণিবিন্যাস বজায় রাখতে বিভিন্ন অস্বচ্ছতা এবং বৈসাদৃশ্য মান ব্যবহার করুন।
অস্বচ্ছতা এবং বৈসাদৃশ্য সীমাবদ্ধতা

করো না

সম্পূর্ণ অস্বচ্ছতা বা বৈসাদৃশ্য মানগুলিকে অনেকগুলি উপাদানে প্রয়োগ করে অতিরিক্ত ব্যবহার করবেন না। প্রাথমিক এবং মাধ্যমিক তথ্যের পার্থক্য করার জন্য অস্বচ্ছতার মানগুলিতে একটি বৈসাদৃশ্য প্রয়োজন।