শুরু থেকেই বড় স্ক্রিনের জন্য ডিজাইন করুন

Android ডিভাইস বিভিন্ন ফর্ম ফ্যাক্টরে উপলভ্য—ফোন, ট্যাবলেট, ফোল্ডেবল, ChromeOS ডিভাইস—যেগুলির স্ক্রিনের সাইজ বিভিন্ন ধরনের হয়। Android-এ মাল্টি-উইন্ডো, মাল্টি-ডিসপ্লে, ফ্রি-ফর্ম ও ছবির-মধ্যে-ছবি সহ অনেক ডিসপ্লে মোড কাজ করে। ফোল্ডেবল ডিভাইস বিভিন্ন অবস্থায় বা ভঙ্গিতে থাকতে পারে, যেমন টেবিলটপ বা বই।

আপনার অ্যাপ ডিজাইন করা শুরু করার সময়, এটির জন্য বিভিন্ন ব্যবহারের ক্ষেত্রে বিবেচনা করুন। যেমন:

  • বড় স্ক্রিনের ডিভাইস ব্যবহারকারীদের আপনার মিডিয়া অ্যাপের কন্টেন্টের সাথে বিভিন্ন উপায়ে এনগেজ হওয়ার জন্য আরও বেশি জায়গা দেয়।

  • ব্যবহারকারীরা মাল্টি-উইন্ডো কনফিগারেশনে ভিডিও দেখার সময় মাল্টিটাস্ক করতে পারেন বা ছবি তোলার পরে আরও জটিল এডিট প্রয়োগ করতে বড় স্ক্রিনের সুবিধা নিতে পারেন।

  • ব্যবহারকারীরা ভিডিও কলের মাধ্যমে কানেক্টেড থাকতে এবং তাদের বন্ধু ও পরিবারকে আরও বিশদে দেখতে ট্যাবলেট ব্যবহার করতে পারেন। আপনার অ্যাপ কাস্টম প্লেব্যাক ওভারলেতে কোনও শীর্ষক বা দৃশ্য সম্পর্কে আরও সমৃদ্ধ প্রসঙ্গ দেখাতে পারে বা অন-স্ক্রিনে আরও কন্ট্রোল বিকল্প অফার করতে পারে।

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

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

আপনার মিডিয়া অ্যাপকে ডিফল্ট হিসেবে রেসপন্সিভ করুন

ফোন, ট্যাবলেট, ফোল্ডেবল ও ChromeOS ডিভাইস জুড়ে আপনার অ্যাপের লেআউট অ্যাডাপ্টিভ করে আপনার মিডিয়া অ্যাপে ব্যবহারকারীর অভিজ্ঞতা যাতে খারাপ না হয় তা দেখুন।

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

নির্দেশিকা অনুযায়ী ডিজাইন করুন

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

ডিভাইসের ফর্ম ফ্যাক্টর, স্ক্রিনের সাইজ, ডিসপ্লে মোড বা পসচার যাই হোক না কেন, আপনার অ্যাপ যেন ব্যবহারকারীকে দুর্দান্ত অভিজ্ঞতা প্রদান করে। তাই নিম্নলিখিত টিয়ার ১, ২ ও ৩ নির্দেশিকা অনুযায়ী আপনার অ্যাপ ডিজাইন করুন।

এই নির্দেশিকায় বেশিরভাগ ধরনের Android অ্যাপের জন্য কোয়ালিটি সংক্রান্ত প্রয়োজনীয়তার একটি বিস্তারিত সেট সংজ্ঞায়িত করা হয়েছে।

টিয়ার ৩:

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

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

টিয়ার ২:

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

টিয়ার ১:

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

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

অপ্টিমাইজ করা লেআউট

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

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

মিডিয়া লেআউট

তালিকা-বিবরণ, ফিড এবং সহায়ক পেনের জন্য মিডিয়া-নির্দিষ্ট লেআউট প্রয়োগ করে আপনার অ্যাপ আরও ব্যবহারযোগ্য করে তুলুন। MDX, Flutter ও Compose লেআউট সম্পর্কে জানতে, লেআউট রিসোর্স দেখুন।

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

  • ফিড: ফিড লেআউট কনফিগার করা যায় এমন গ্রিডে সমতুল্য কন্টেন্ট এলিমেন্ট সাজায় যাতে মিউজিক ফিড বা আপনার অ্যাপে সিনেমা ও টিভি কিয়স্কের মতো প্রচুর পরিমাণে কন্টেন্ট দ্রুত, সুবিধাজনকভাবে দেখা যায়। আরও তথ্যের জন্য, ফিড লেআউট দেখুন।

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

মিডিয়া লেআউটের কিউরেট করা কালেকশনের জন্য, মিডিয়া গ্যালারি দেখুন।

সোশ্যাল মিডিয়া লেআউট

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

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

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

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

সোশ্যাল মিডিয়া লেআউটের কিউরেট করা সংগ্রহের জন্য, সোশ্যাল মিডিয়া গ্যালারি পৃষ্ঠা দেখুন।

বড় স্ক্রিনের মিডিয়া অ্যাপের জন্য পেশাদার পদ্ধতি

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

ওরিয়েন্টেশন ও রিসাইজ করা

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

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

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

কীবোর্ড শর্টকাট

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

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

ক্যামেরা প্রিভিউ সংক্রান্ত সহায়তা

বড় স্ক্রিনের ক্ষেত্রে, স্ট্রেচিং, ক্রপিং ও ঘোরানোর সময় আপনি আরও বেশি সমস্যার সম্মুখীন হতে পারেন। তাই, আপনার মিডিয়া অ্যাপের UI আসলে যা রেন্ডার করে, ক্যামেরার প্রিভিউয়ের সাইজও যে সেটাই হবে, তা আপনি ধরে নিতে পারবেন না।

যেমন, কোনও ব্যবহারকারী তার ট্যাবলেট দিয়ে ছবি তুললে, সেটি যদি ট্যাবলেটের স্ক্রিনে উল্টো দেখায়, তাহলে সেটি সাব-অপ্টিমাল অভিজ্ঞতা। বড় স্ক্রিনের জন্য ক্যামেরা প্রিভিউ সংক্রান্ত সহায়তা অন্তর্ভুক্ত করুন।

আরও তথ্যের জন্য, CameraX প্রিভিউ অথবা Camera2 প্রিভিউ দেখুন।

ফোল্ডেবল পোস্টার

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

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