১. সংক্ষিপ্ত বিবরণ
গুগল আই/ও ২০১৯-এ, ম্যাটেরিয়াল ডিজাইন আপনার পণ্যের বিদ্যমান ম্যাটেরিয়াল থিমের পরিপূরক হিসেবে একটি ডার্ক থিম তৈরির জন্য নির্দেশিকা উপস্থাপন করেছে। যদিও লাইট থিম দীর্ঘক্ষণ পড়ার জন্য চমৎকার এবং আরও সুস্পষ্ট কনট্রাস্ট প্রদান করে, একটি ডার্ক থিমের কম উজ্জ্বলতা অন্ধকার পরিবেশে সুরক্ষা দেয় এবং চোখের উপর চাপ কমাতে পারে।
ম্যাটেরিয়াল প্রযুক্তিতে, ডার্ক থিমগুলোকে ডিফল্ট লাইট থিমের একটি পরিপূরক মোড হিসেবে ব্যবহারের জন্য ডিজাইন করা হয়েছে, যা একটি সূক্ষ্ম ও রাত্রিকালীন উপস্থাপনার মাধ্যমে আপনার অ্যাপের স্বতন্ত্র পরিচয় (রঙ, আকৃতি, টাইপ এবং এলিভেশনের স্টাইল সহ) বজায় রাখে।
এই ডিজাইনল্যাবে, আমরা আমাদের যেকোনো একটি ম্যাটেরিয়াল স্টাডি ব্যবহার করে, বিদ্যমান কোনো ম্যাটেরিয়াল থিমের উপর ভিত্তি করে একটি ডার্ক থিম তৈরি করার জন্য প্রয়োজনীয় ধাপগুলো আলোচনা করব।
আমরা রিপ্লাই (Reply) নিয়ে কাজ করব, যা স্বচ্ছতা, পাঠযোগ্যতা, স্বজ্ঞা এবং ব্যবহারের সুবিধার কথা মাথায় রেখে ডিজাইন করা একটি ইমেল অ্যাপ। আমরা রিপ্লাই-এর পরিচিতি সম্পর্কে জানব এবং অ্যাপটিতে ব্র্যান্ডের বৈশিষ্ট্যগুলো ধরে রাখার জন্য সতর্ক সিদ্ধান্ত নেব, পাশাপাশি এমন একটি থিম তৈরি করব যা অন্ধকারেও স্বাচ্ছন্দ্যে দেখা যায়।
আমরা থিমটিকে আরও এগিয়ে নিয়ে যাব এবং রিপ্লাই-এর অনন্য ব্যক্তিত্বকে পুনরায় তুলে ধরতে সাধারণ ডার্ক থিমের বাইরে গিয়ে কাস্টম সারফেস কালার ব্যবহার করব।
প্রয়োজনীয় উপকরণ:
২. প্রয়োজনীয় ফাইলগুলো সংগ্রহ করুন।
শুরু করার আগে, আপনাকে আমাদের ফিগমা স্টার্টার ফাইলটি ডাউনলোড করতে হবে। ডিজাইনল্যাবের জন্য আপনার প্রয়োজনীয় সবকিছু এই ফাইলটিতে অন্তর্ভুক্ত রয়েছে।
৩. আপনার পরিবেশ প্রস্তুত করুন
এরপরে, আপনাকে আপনার ডিজাইন পরিবেশ সেট আপ করতে হবে।
প্রথমে, ফিগমাতে সাইন ইন করুন অথবা একটি অ্যাকাউন্ট তৈরি করুন ।
একবার সাইন ইন করার পর, আগের ধাপে ডাউনলোড করা ফাইলটি ইম্পোর্ট করুন। এটি করার জন্য, ফিগমা ফাইল স্ক্রিনের উপরের বাম কোণে থাকা 'ইম্পোর্ট ফাইল' আইকনটি খুঁজুন এবং আপনার 'ডাউনলোডস' ফোল্ডারে ফাইলটি সনাক্ত করুন।
ফাইলটি একটু ঘুরে দেখুন। এতে একটি লাইট থিম, অ্যাপটির ব্র্যান্ডের ওপর ভিত্তি করে আগে থেকে তৈরি একটি টোনাল প্যালেট এবং আমরা যে চূড়ান্ত ডার্ক থিমটি তৈরি করব তার একটি কপি রয়েছে।
- অন্য একটি ট্যাবে, ডার্ক থিমের জন্য ম্যাটেরিয়াল ডিজাইন গাইডেন্সটি খুলুন। আমরা এই ডিজাইনল্যাব জুড়ে এই নির্দেশিকাগুলো ব্যবহার করব।
৪. পণ্যটির পরিচয় বুঝুন
রিপ্লাই-এর জন্য ডার্ক থিম নিয়ে কাজ শুরু করার আগে, আমাদের এর ব্র্যান্ডের কিছু বৈশিষ্ট্য বুঝতে হবে। এটি আমাদের থিম সম্পর্কে সঠিক সিদ্ধান্ত নিতে সাহায্য করবে, যাতে লাইট এবং ডার্ক উভয় থিমেই রিপ্লাই-এর পরিচিতি ও ব্র্যান্ড সামঞ্জস্যপূর্ণভাবে প্রকাশ পায়।
রিপ্লাই-এর ব্র্যান্ড যোগাযোগের উপর জোর দেয়। অ্যাপটি কার্যকরী গুণাবলীকে অগ্রাধিকার দেয় এবং এমন ডিজাইন উপাদানের চেয়ে ব্যবহারের সহজতাকে বেশি গুরুত্ব দেয়, যেগুলোর কোনো কার্যকরী উদ্দেশ্য নেই।
এই ডিজাইনল্যাবে আমাদের আলোচনার উদ্দেশ্যে, Reply-তে ব্র্যান্ড প্রকাশের সবচেয়ে গুরুত্বপূর্ণ উপাদানগুলো হলো রঙ, টাইপ এবং আকৃতি।
রঙ
রিপ্লাই-এর কালার থিমে গাঢ় নীল-ধূসর প্রধান রঙের সাথে কমলা-হলুদ গৌণ রঙ ব্যবহার করা হয়েছে।
যেহেতু দ্বিতীয় রঙটি খুব কম ব্যবহৃত হয়, তাই রিপ্লাই-এর ইউআই প্রায়শই একরঙা হয় এবং এতে প্রাথমিক রঙের বিভিন্ন রূপ ব্যবহার করা হয়। এই সূক্ষ্ম রঙের থিমটি কোনো রকম বিভ্রান্তি ছাড়াই বিষয়বস্তু সহজে পড়তে সাহায্য করে এবং ছবির অ্যাভাটারগুলোও সহজে দেখা যায়।
সুতরাং, রিপ্লাই-এর দ্বিতীয় রঙটি যেখানেই ব্যবহার করা হোক না কেন, তার একটি ব্যাপক প্রভাব রয়েছে — এটি অ্যাপ জুড়ে গুরুত্বপূর্ণ কাজগুলোকে তুলে ধরে এবং ব্র্যান্ডিং করা মুহূর্তগুলোকে স্পষ্টভাবে ঘোষণা করে।
প্রকার
যেহেতু অ্যাপটি মূলত টেক্সট-ভিত্তিক কন্টেন্ট এবং কার্যকারিতার উপর বেশি জোর দেয়, তাই রিপ্লাই-এর পরিচিতি প্রকাশের ক্ষেত্রে টাইপ ও টাইপোগ্রাফি অত্যন্ত গুরুত্বপূর্ণ। অ্যাপটি তার সম্পূর্ণ টাইপ স্কেলের জন্য ওয়ার্ক স্যান্স (Work Sans)- এর উপর নির্ভর করে এবং এতে বিভিন্ন ধরনের স্টাইল ব্যবহার করা হয়, যেগুলোতে ওয়ার্ক স্যান্সের ছয়টি ওয়েট—লাইট, রেগুলার, মিডিয়াম, সেমিবোল্ড এবং বোল্ড—অন্তর্ভুক্ত রয়েছে।
সম্পূর্ণ টাইপ স্কেলটি ওয়ার্ক স্যান্স থেকে তৈরি করার ফলে রিপ্লাই একটি সামঞ্জস্যপূর্ণ ও অনুমানযোগ্য, কিন্তু স্বতঃস্ফূর্ত এবং পাঠযোগ্য টাইপোগ্রাফি পেয়েছে।
ওয়ার্ক স্যান্সের ডিজাইনার ওয়েই হুয়াং-এর মতে, এই ফন্ট পরিবারটি স্ক্রিনে ব্যবহারের জন্য বিশেষভাবে তৈরি করা হয়েছে। এর ফলে ইমেল বা অন্যান্য কন্টেন্টে থাকা পাঠ্যাংশ দক্ষতার সাথে পড়ার জন্য এটি চমৎকার। আদি গ্রোটেস্ক ফন্টের গঠনের ওপর এর শিথিল ভিত্তি একে কিছুটা বেশি বন্ধুত্বপূর্ণ ও মানবিক একটি নান্দনিকতা প্রদান করে, এবং এর প্রশস্ত ট্র্যাকিং পড়ার অভিজ্ঞতাকে আরও মসৃণ করে তোলে।
আকৃতি
রিপ্লাই-এর গঠনশৈলীতে একটি সূক্ষ্মতা রয়েছে, যেখানে গোলাকার ও তীক্ষ্ণ উপাদানগুলোকে এমনভাবে মেলানো হয়েছে যা ইমেল লিস্টের কার্যকারিতা ও ব্যবহারিক প্রকৃতিকে আরও জোরদার করে, এবং একই সাথে মূল কাজ ও বৃহত্তর উপাদানগুলোতে একটি কোমল ছোঁয়া দেয়।
- ছোট উপাদান
- মাঝারি উপাদান
- বড় উপাদান
বাটন এবং FAB-এর মতো ছোট কম্পোনেন্টগুলো সম্পূর্ণ গোলাকার, অন্যদিকে ইমেল কার্ড এবং বটম অ্যাপ বারের মতো মাঝারি কম্পোনেন্টগুলো সম্পূর্ণ বর্গাকার। অ্যাকাউন্ট সুইচার এবং বটম শীটের মতো বড় কম্পোনেন্টগুলোর কোণাগুলো সামান্য গোলাকার।
এই আকৃতিগুলো একত্রিত হয়ে ব্যবহারকারীকে অ্যাপের মধ্যে তার অবস্থান, প্রতিটি উপাদানের নকশা এবং ইন্টারফেসের বাকি অংশের সাথে এর সম্পর্ক সম্পর্কে ধারণা পেতে সাহায্য করে।
৫. রঙ নিয়ে কাজ করা
রিপ্লাই-এর ডিফল্ট লাইট থিমে ব্র্যান্ড অভিব্যক্তিতে রঙের ভূমিকা কীভাবে কাজ করে, তা জানার পর আমরা একটি ব্যবহারযোগ্য ও অভিব্যক্তিপূর্ণ ডার্ক থিমের জন্য এর প্যালেটে সুচিন্তিত পরিবর্তন আনতে পারি।
ম্যাটেরিয়াল টেকনোলজিতে কালার সিস্টেমগুলো টোনাল প্যালেটের উপর ভিত্তি করে তৈরি হয় — এই প্যালেটগুলো আপনার ব্র্যান্ডের রঙ ব্যবহার করে একগুচ্ছ সামঞ্জস্যপূর্ণ ভ্যারিয়েন্ট তৈরি করে, যা একত্রিত হয়ে আপনার অ্যাপ জুড়ে একটি সমন্বিত কালার সিস্টেম হিসেবে প্রয়োগ করা হয় এবং এটি স্টাইল ও পাঠযোগ্যতা নিশ্চিত করে।
ফিগমা ফাইলটিতে আপনি রিপ্লাই-এর প্রাইমারি এবং সেকেন্ডারি টোনাল প্যালেটগুলো দেখতে পাবেন। প্রতিটি প্যালেটের উপরের হালকা তীরচিহ্নগুলো রিপ্লাই-এর লাইট থিমে ব্যবহৃত ভ্যালুগুলো নির্দেশ করে, আর গাঢ় তীরচিহ্নগুলো আমাদের ডার্ক থিমে ব্যবহৃত ভ্যারিয়েন্টগুলো নির্দেশ করে।
ম্যাটেরিয়াল ব্যবহার করে ডার্ক থিম তৈরি করার সময় হালকা রঙ বেছে নেওয়া হয়, যাতে আপনার কালার সিস্টেমটি অভিব্যক্তিপূর্ণ থাকে এবং চোখের উপর চাপ সৃষ্টি না করে যথাযথ কনট্রাস্ট বজায় রাখে। গাঢ় ব্যাকগ্রাউন্ডের বিপরীতে বেশি স্যাচুরেটেড রঙগুলো দৃশ্যত "কম্পন" সৃষ্টি করে, ফলে সেগুলো পড়া কঠিন হয়ে পড়ে। হালকা টোনগুলো উঁচু পৃষ্ঠতলের রঙ পরিবর্তনেও আরও বেশি নমনীয়তা প্রদান করে, যা নিয়ে আমরা শীঘ্রই আলোচনা করব।
৬. পৃষ্ঠের রং সমন্বয় করুন
এখন যেহেতু আমরা রিপ্লাই-এর টোনাল প্যালেট এবং আমাদের ডার্ক থিমে ব্যবহৃত রঙগুলো সম্পর্কে ধারণা পেয়েছি, তাই আমাদের মকআপে রঙের মানগুলো সমন্বয় করা শুরু করার সময় এসেছে।
ম্যাটেরিয়াল ডার্ক থিমে, ইন্টারফেসের সবচেয়ে নিচের স্তরটি সাধারণত গাঢ় ধূসর রঙের হয় এবং এর হেক্স ভ্যালু হলো #121212।
- ফিগমা ফাইলে, " Reply Starter " নামের আর্টবোর্ডটি খুঁজুন এবং " Background " নামের লেয়ারটি নির্বাচন করুন।
- স্ক্রিনের ডানদিকের ইন্সপেক্টর প্যানেলে " Fill " এর নিচে, রঙের মান 121212 সেট করুন এবং Return চাপুন।
- আপনার আর্টবোর্ডটি দেখতে এইরকম হওয়া উচিত:
রিপ্লাই-এর মনোক্রোম্যাটিক ইনবক্স ভিউতে, ইমেল কার্ডগুলোর রঙ ব্যাকগ্রাউন্ডের চেয়ে কিছুটা হালকা হয়, তাই ইনবক্সের ভিজ্যুয়াল হায়ারার্কি বজায় রাখতে ডার্ক থিমের কার্ডগুলোর ক্ষেত্রেও আমাদের একই পদ্ধতি অনুসরণ করা উচিত।
- একই আর্টবোর্ডে, "Email cards" নামের গ্রুপটি এক্সপ্যান্ড করুন এবং " Email card" নামের সমস্ত লেয়ার সিলেক্ট করুন।
- আগের মতোই, ইন্সপেক্টর প্যানেল থেকে Fill value নির্বাচন করুন। মানটি 121212- এ সেট করুন এবং Return চাপুন।
- এখন, শুধুমাত্র " ইমেল কার্ড ওভারলে" নামের লেয়ারগুলো নির্বাচন করুন। এই লেয়ারগুলো আমাদের এমন একটি ওভারলে তৈরি করতে সাহায্য করবে যা ইমেল কার্ডগুলোকে তাদের পটভূমি থেকে আলাদা করবে।
- লেয়ারগুলোকে ফিল করুন এবং ২% অপাসিটিতে FFFFFF কালার দিন।
ইমেল কার্ডগুলো গাঢ় করে দেওয়ায় আমাদের লেখা পড়া যাচ্ছে না। এরপর আমরা লেখার রঙ নিয়ে কাজ করব।
৭. লেখার রং সমন্বয় করুন
ডার্ক থিমে টেক্সটের রঙ বুঝতে হলে, বৃহত্তর ম্যাটেরিয়াল ডিজাইন সিস্টেমে টেক্সটে কীভাবে রঙ প্রয়োগ করা হয় তা বোঝা জরুরি।
ম্যাটেরিয়াল কম্পোনেন্টস "অন" কালার-এর ধারণাটি সংজ্ঞায়িত করে। এদের এমন নামকরণের কারণ হলো, এই রঙগুলো প্রাইমারি, সেকেন্ডারি, সারফেস, ব্যাকগ্রাউন্ড বা এরর কালার ব্যবহারকারী কম্পোনেন্ট এবং মূল সারফেসগুলোর "ওপর" প্রদর্শিত হয়। "অন" কালার প্রধানত টেক্সটের জন্য ব্যবহৃত হয়, যাতে এই সারফেসগুলোতে টেক্সটটি পাঠযোগ্য থাকে।
ম্যাটেরিয়ালের ডিফল্ট 'অন' রঙগুলো হলো সাদা (#FFFFFF) এবং কালো (#000000)। যেহেতু আমাদের গাঢ় করা পৃষ্ঠতলগুলোর বিপরীতে কালো বা গাঢ় 'অন' রঙ উপযুক্ত হবে না, তাই আমরা সাদা ব্যবহার করব।
এই 'অন' রঙের মাধ্যমে টেক্সটের স্তরবিন্যাস নির্ধারণের পদ্ধতিটি সহজ। উচ্চ-গুরুত্বপূর্ণ টেক্সটের অপাসিটি ৮৭%, মাঝারি-গুরুত্বপূর্ণ টেক্সটের জন্য ৬০% এবং নিষ্ক্রিয় টেক্সটের জন্য ৩৮% অপাসিটি ব্যবহৃত হয়।
উচ্চ অগ্রাধিকারের লেখা নিখুঁত সাদা হয় না, কারণ, ধাপ ৫-এ যেমন আলোচনা করা হয়েছে, #FFFFFF—একটি উজ্জ্বল রঙ—আমাদের কালো পটভূমির বিপরীতে দৃশ্যত "কম্পন" সৃষ্টি করবে। এছাড়াও, কালো পটভূমির বিপরীতে নিখুঁত #FFFFFF লেখা পাঠযোগ্যতার জন্য ক্ষতিকর হতে পারে, কারণ সেই লেখার আলো কালো পটভূমির বিপরীতে ছড়িয়ে পড়ে বা ঝাপসা হয়ে যায়।
এই সবকিছু জানার পর, চলুন আমাদের ডার্ক থিমের টেক্সটের রঙগুলো ঠিক করে নিই।
- আমাদের স্টার্টার লেআউটের সমস্ত টেক্সট সহজে অ্যাক্সেসের জন্য গ্রুপ করা আছে। 'ইনবক্স টেক্সট' নামের গ্রুপটি খুঁজুন এবং এর সমস্ত স্তর দেখতে এটিকে এক্সপ্যান্ড করুন।
- যেসব লেয়ারের শুরুতে " Hi -" লেখা আছে, সেগুলোকে নির্বাচন করুন। এগুলো হলো আমাদের লেআউটের সবচেয়ে গুরুত্বপূর্ণ লেখাগুলো।
- ইনস্পেক্টর প্যানেলে, ফিল (Fill) FFFFFF এবং অপাসিটি (opacity ) ৮৭% এ সেট করুন।
- ইনবক্স টেক্সট গ্রুপে ফিরে এসে, "Med -" দিয়ে শুরু হওয়া সমস্ত লেয়ার নির্বাচন করুন।
- ইনস্পেক্টর প্যানেলে, ফিল (Fill) FFFFFF এবং অপাসিটি (opacity ) ৬০% এ সেট করুন।
৮. উপাদানের রং সমন্বয় করুন
ম্যাটেরিয়াল দিয়ে তৈরি ডার্ক থিমে, উঁচু পৃষ্ঠতল এবং উপাদানগুলোতে ওভারলে ব্যবহার করে রঙ করা হয়। পৃষ্ঠতলটি যত বেশি উঁচু হয়, ওভারলেটি তত বেশি শক্তিশালী ও উজ্জ্বল হয়ে ওঠে। যখন পটভূমি এতটাই অন্ধকার থাকে যে নির্ভরযোগ্যভাবে গাঢ় ছায়া ফুটিয়ে তোলা যায় না, তখন উচ্চতা এবং স্তরবিন্যাস বোঝানোর জন্য এটি একটি উপায়।
নীচের অ্যাপ বার
রিপ্লাই-এর নিচের অ্যাপ বারটির জন্য, যা ইনবক্স UI-এর বাকি অংশ থেকে কিছুটা উঁচুতে অবস্থিত, আমরা একটি সূক্ষ্ম ওভারলে প্রয়োগ করব।
- লেয়ার লিস্টে 'Bottom app bar' নামের গ্রুপটি খুঁজুন এবং এটিকে এক্সপ্যান্ড করুন যাতে আপনি এর অন্তর্ভুক্ত লেয়ারগুলো দেখতে পারেন।
- ওই গ্রুপের মধ্যে Surface নামের লেয়ারটি খুঁজুন এবং এর Fill ভ্যালু 121212-এ সেট করুন।
- এর উপরের 'Surface overlay' নামের লেয়ারটি খুঁজুন এবং এর ফিল ভ্যালু (Fill value) FFFFFF ও অপাসিটি (opacity ) 12% দিন।
ভাসমান অ্যাকশন বোতাম
এরপর আমরা FAB-এ একটি নতুন রঙ প্রয়োগ করব। তা করার জন্য, আমরা আগে যে টোনাল প্যালেটগুলো দেখেছিলাম সেখানে ফিরে যান এবং Reply-এর সেকেন্ডারি রঙের 700 ভ্যালুটি নিন।
ঐচ্ছিকভাবে, আপনার নিজের অ্যাপের ছোট কিন্তু গুরুত্বপূর্ণ উপাদানগুলোর জন্য, আপনি কিছুটা বেশি স্যাচুরেটেড রঙ বেছে নিতে পারেন, তবে শর্ত হলো রঙটিকে অবশ্যই তার নিচের রঙগুলোর সাথে সঠিক কনট্রাস্ট বজায় রাখতে হবে। আমরা পরবর্তী ধাপে এই বিকল্পটি নিয়ে আলোচনা করব।
- লেয়ারের তালিকায় FAB নামক গ্রুপটি খুঁজুন এবং এর উপাদান অংশগুলো দেখতে এটিকে প্রসারিত করুন।
- সারফেস লেয়ারটি খুঁজুন এবং নির্বাচন করুন। এর ফিল FCC13B- তে সেট করুন।
নির্বাচিত কার্ড
আপনি হয়তো লক্ষ্য করবেন যে, রিপ্লাই-এর ইনবক্সের নির্বাচিত কিছু ইমেল কার্ডের কোণাতেও একই প্রভাবশালী কমলা-হলুদ রঙটি দেখা যায়। এটিও ব্র্যান্ডের একটি জোরালো প্রকাশ, কিন্তু এটি কোনো কম্পোনেন্ট, সারফেস বা টেক্সটের সাথে সুন্দরভাবে মিশে যায় না।
এই ধরনের পরিস্থিতির জন্য, আমাদের দ্বিতীয় বিকল্প রঙ (এই ক্ষেত্রে #FFFBE6) থেকে শুরু করে এমন কিছু খুঁজে বের করাই শ্রেয় যা Reply-এর কার্যকরী নান্দনিকতায় ব্যাঘাত না ঘটিয়ে যথাযথভাবে অভিব্যক্তিপূর্ণ হবে। Reply-এর জন্য, আমরা আমাদের সাধারণ দ্বিতীয় বিকল্পটিই ব্যবহার করতে পারি।
- Earmark নামের লেয়ারটি নির্বাচন করুন এবং এর Fill-কে FFF5A0- তে সেট করুন।
৯. আরও এক ধাপ এগিয়ে যান: কাস্টম সারফেস
আমরা আগেই জেনেছি যে, Reply-এর ফ্লোটিং অ্যাকশন বাটন (বা FAB) একটি অত্যন্ত গুরুত্বপূর্ণ উপাদান, যা অ্যাপটিতে একটি শক্তিশালী ব্র্যান্ডিং মুহূর্তেরও প্রতিনিধিত্ব করে। এই কারণে, আমরা Reply-এর ডার্ক থিমে এর আসল সেকেন্ডারি রঙটি ব্যবহার করে এর রঙের অভিব্যক্তিটি বজায় রাখার সিদ্ধান্ত নিতে পারি।
- লেয়ারের তালিকায় FAB নামক গ্রুপটি খুঁজুন এবং এর উপাদান অংশগুলো দেখতে এটিকে প্রসারিত করুন।
- সারফেস লেয়ারটি খুঁজুন এবং সেটি নির্বাচন করুন। এর ফিল আবার F9AA33- তে সেট করুন।
আমরা হয়তো বটম অ্যাপ বার এবং ইমেল কার্ডগুলোর জন্য রিপ্লাই-এর প্রাইমারি কালারটিকে একটি কাস্টম সারফেস কালার হিসেবে ফিরিয়ে আনতে চাইতে পারি। এটি করার জন্য, আমাদের শুধু ওভারলে-টিকে পরিবর্তন করে সেই গাঢ় প্রাইমারি কালারটি ব্যবহার করতে হবে, যা আমরা এতদিন ধরে উল্লেখিত টোনাল প্যালেটে নির্দেশ করে আসছি।
- লেয়ার লিস্টে 'Bottom app bar' নামের গ্রুপটি খুঁজুন এবং এটিকে এক্সপ্যান্ড করুন যাতে আপনি এর অন্তর্ভুক্ত লেয়ারগুলো দেখতে পারেন।
- Surface overlay নামের লেয়ারটি খুঁজুন এবং এর নতুন Fill ভ্যালু 344955 ও অপাসিটি 48% দিন। এটি পর্যাপ্ত কনট্রাস্ট বজায় রেখে ব্র্যান্ডের রঙকে আরও জোরালো করবে।
- লেয়ারের তালিকা থেকে 'Email card overlay' নামের লেয়ারগুলো খুঁজুন এবং সবগুলো নির্বাচন করুন।
- তাদের Fill-কে ADC0CB এবং অপাসিটিকে ৪% এ সেট করুন।
১০. উপসংহার
ম্যাটেরিয়ালে, ডার্ক থিম হলো আপনার পণ্যের অনন্য পরিচয়ের একটি সুচিন্তিত ও উদ্দেশ্যমূলক সম্প্রসারণ, যা লাইট থিমে প্রকাশ পায়। রঙে সাধারণ কিছু পরিবর্তন এবং এলিভেশন বা উচ্চতা উপস্থাপনের পদ্ধতির মাধ্যমে, আপনি এইমাত্র সফলভাবে আপনার প্রথম ম্যাটেরিয়াল ডার্ক থিম তৈরি করেছেন। অভিনন্দন!
এই ডিজাইন ল্যাবের ধাপগুলোকে আপনার নিজস্ব পণ্যের ডার্ক থিম বোঝা ও নির্ধারণ করার একটি কাঠামো হিসেবে বিবেচনা করুন এবং সর্বদা আপনার ব্র্যান্ড ও পণ্যের বৈশিষ্ট্য এবং লক্ষ্যগুলোকে গুরুত্ব দিন।
ডার্ক থিম সম্পর্কে আরও নির্দেশনার জন্য, ডার্ক থিমের ম্যাটেরিয়াল ডিজাইন স্পেকটি দেখে নিন।
আপনার কোনো প্রশ্ন থাকলে, টুইটারে @MaterialDesign ব্যবহার করে যেকোনো সময় নির্দ্বিধায় আমাদের জিজ্ঞাসা করতে পারেন।
গুগল ডিজাইন ইউটিউব চ্যানেলে আরও ডিজাইন কন্টেন্ট এবং টিউটোরিয়ালের জন্য চোখ রাখুন।