Android অ্যাপ আইকনগুলির জন্য একটি ব্যবহারিক নির্দেশিকা: অভিযোজিত আইকনগুলি ব্যাখ্যা করা হয়েছে (এবং কীভাবে আপনার সঠিকভাবে তৈরি করবেন)

প্রথমবারের মতো Android ডেভেলপারদের জন্য এটি একটি সাধারণ বিস্ময়: আপনি আপনার অ্যাপ আইকনের জন্য একটি একক বর্গাকার PNG পোলিশ করেন, এটি একটি পরিপাটি 512x512 এ রপ্তানি করেন এবং এটি আপনার চিত্র সম্পাদকে নিখুঁত দেখায়। তারপরে আপনি একটি স্যামসাং ফোনে একটি ডিবাগ বিল্ড ইনস্টল করেন এবং আইকনটি হঠাৎ ক্রপ করা এবং সামান্য অফ-সেন্টার দেখায়, যেন লোগোর কিছু অংশ কেটে ফেলা হয়েছে। ফাইল নিজেই সঙ্গে কিছু ভুল. সমস্যাটি হল যে একটি একক বর্গাকার ছবি কখনই Android লঞ্চারগুলির বাস্তব জগতের সাথে যোগাযোগ রক্ষা করতে পারেনি, যার প্রত্যেকটি ক্রপ, মাস্ক এবং আইকনগুলিকে আলাদাভাবে পরিবর্তন করে। আপনি যদি এখনও এটি না করে থাকেন তবে এটি করার আগে এটি কেবল সময়ের ব্যাপার, তাই আসুন হুডের নীচে কী ঘটছে এবং কীভাবে এটি প্রথমবার ঠিক করা যায় তা জেনে নেওয়া যাক৷

কেন একটি একক স্কোয়ার PNG আর যথেষ্ট নয়

Android-এর প্রথম দিকের বছরগুলিতে, অ্যাপের আইকনগুলি দেখতে ঠিক তেমনই ছিল: একটি একক বর্গাকার (বা মাঝে মাঝে মুক্ত-আকৃতির) PNG যা প্রতিটি লঞ্চার যেমন- তেমনই প্রদর্শিত হয়। এটি ঠিক কাজ করেছিল যতক্ষণ না নির্মাতারা তাদের ফোনগুলিকে দৃশ্যত আলাদা করা শুরু করে এবং এটি করার সবচেয়ে সহজ জায়গাগুলির মধ্যে একটি হল হোম স্ক্রিন। স্যামসাং বৃত্তাকার স্কোয়ার চেয়েছিল, কিছু চীনা OEM স্কিন বিভিন্ন কোণার চিকিত্সা চেয়েছিল এবং স্টক Android অবশেষে চেনাশোনাগুলিতে বসতি স্থাপন করেছিল। হঠাৎ, ঠিক একই আইকন ফাইলটি কার ফোনে অবতরণ করেছে তার উপর নির্ভর করে এটি লক্ষণীয়ভাবে আলাদা এবং কখনও কখনও দৃশ্যত আরও খারাপ লাগছিল।

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

একটি অভিযোজিত আইকন ঠিক কি?

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

একটি অ্যাপের সংস্থানগুলিতে, এটি সাধারণত mipmap-anydpi-v26/ic_launcher.xml-এর মতো একটি XML ফাইলের মাধ্যমে সংজ্ঞায়িত করা হয়, যা পিক্সেল ডেটা ধারণ করার পরিবর্তে ব্যাকগ্রাউন্ড এবং ফোরগ্রাউন্ড অঙ্কনযোগ্যকে নির্দেশ করে৷ একটি ঐতিহ্যগত ফ্ল্যাট ic_launcher.png এখনও Android 7.1 বা তার আগের ডিভাইসগুলির জন্য একটি ফলব্যাক হিসাবে রাখা হয়েছে, যা সম্পূর্ণরূপে অভিযোজিত আইকন সিস্টেমের পূর্ববর্তী।

কেন নিরাপদ অঞ্চল বিষয়

এখানে সেই অংশ যা মানুষকে সবচেয়ে বেশি ট্রিপ দেয়। যদিও প্রতিটি স্তরের জন্য ক্যানভাস 108dp বাই 108dp, শুধুমাত্র ভিতরের 66dp বাই 66dp বৃত্ত, সেই ক্যানভাসে কেন্দ্রীভূত, যে মুখোশের আকৃতি প্রয়োগ করা হোক না কেন দৃশ্যমান হওয়ার নিশ্চয়তা। এই অভ্যন্তরীণ অঞ্চলটিকে সাধারণত নিরাপদ অঞ্চল বলা হয়। এর বাইরের যেকোন কিছু একটি বৃত্তাকার মুখোশে প্রদর্শিত হতে পারে এবং তারপরে হঠাৎ করে আরও আক্রমণাত্মক কাঠবিড়ালি বা টিয়ারড্রপ মাস্কে ক্লিপ করা হতে পারে বা এর বিপরীতে।

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

লঞ্চার আকৃতি আপনি সম্মুখীন হবেন

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

সম্পদ তৈরি করা: আপনার প্রয়োজনীয় আকার এবং ঘনত্ব

আপনি যদি iOS-এ অ্যাপটি শিপিং করে থাকেন, তাহলে সম্পূর্ণরূপে আরেকটি সেট যোগ করুন, যেহেতু Apple-এর অ্যাপ স্টোর আইকনের প্রয়োজনীয়তা 1024x1024-এ রয়েছে এবং সম্পূর্ণ ভিন্ন, অ-স্তরবিশিষ্ট বিন্যাস ব্যবহার করুন যেখানে কোনও স্বচ্ছতা নেই।

ম্যানুয়াল উপায় বনাম একটি জেনারেটর ব্যবহার

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

একটি বিদ্যমান APK থেকে আইকন নিষ্কাশন করা হচ্ছে

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

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

সাধারণ আইকন ভুল যা পর্যালোচনায় ফ্ল্যাগ করা হয়

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

আপনি পাঠানোর আগে আকার জুড়ে আপনার আইকন পরীক্ষা করা

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

সচরাচর জিজ্ঞাসিত প্রশ্নাবলী (FAQ)

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