প্রোগ্রামার এবং ডেভেলপার সাধারণত ডিজাইনার নয় - এটি ব্যাপকভাবে স্বীকৃত সত্য। ডেভেলপাররা অ্যাপ কাজ করে সেটিতে ফোকাস করে - ডিজাইনাররা অ্যাপ সৌন্দর্যিকভাবে আকর্ষণীয় সেটিতে ফোকাস করে। কিন্তু ডেভেলপাররা একই জিনিস কেন করতে পারেন না?
পুরনো দিনে, যখন অ্যানিমেটেড স্প্ল্যাশ ল্যান্ডিং পেজ এবং ফ্যান্সি লেয়াউট একটা জিনিস ছিল, তখন অবশ্যই প্রফেশনাল ডিজাইনার ভাড়া দেয়া বুঝত। কিন্তু আজকের ট্রেন্ড হলো মিনিমাল - অথবা কমপক্ষে ব্যাপকভাবে সরলীকৃত।
আপনাকে একটি উদাহরণ দেই - কিছুক্ষণ আগে, কেউ আমাকে তাদের PC সফটওয়্যারের জন্য একটি স্প্ল্যাশ স্ক্রিন তৈরি করতে বলল। তাই আমি পুরো হয়ে গেলাম - স্কেচ পেপরে আঁকলাম, PhotoShop-এ ইম্পোর্ট করলাম, অনেক ফ্যান্সি नियন লাইন এবং ইফেক্ট তৈরি করলাম। এটি একটি ডেস্কটপ ওয়ালপেপার হতে পারত, একটি স্প্ল্যাশ স্ক্রিনের চেয়ে। পয়েন্ট হলো আমি তাদের জন্য এই খুব ফ্যান্সি এবং জটিল ডিজাইন তৈরি করলাম।
আপনি সম্ভবত অনুমান করতে পারেন, তাদের পছন্দ হয়নি। তারা যে ডিজাইনটি সিলেক্ট করল সেটি ছিল আসলে একটু লোগো কিছু ওভারল্যাপিং কালার সার্কেল, এবং সফটওয়্যারের নাম নিচে। যেন, PhotoShop-এ ২ মিনিটের কাজ। এবং জানেন কি? আমি একটু একমত হয়েছিলাম যে এটি আমার একটা থেকে ভালো।
আমি যে পয়েন্টটি বোঝাতে চাচ্ছি সেটি এই - আমি মনে করি প্রোগ্রামাররা একই ভুলে পড়ে যান যা আমি করলাম। আমরা UI এবং স্প্ল্যাশ স্ক্রিনকে এই খুব ফ্যান্সি, চোখ ধরা জিনিসভাবের ভাবে চিন্তা করি যা অ্যাপকে স্বতন্ত্র করবে। কিন্তু এটার প্রয়োজন নেই -说实话, এটা হওয়া উচিত নয়। আমাদের প্রোগ্রামারের মাইন্ডসেট নেওয়া উচিত এবং এটা এস্থেটিক ডিজাইনে প্রয়োগ করা উচিত - সিম্পল, ফাংশনাল, কাজ করে।
এই আর্টিকেলে, আমরা কিছু খুব সিম্পল উপায় দেখব একটি এলিগ্যান্ট অ্যান্ড্রয়েড APP UI / UX তৈরি করার, এমনকি আপনার σχεদো ডিজাইনিং অভিজ্ঞতা নেই।
যদি আপনি খুব কিছু অন্য জিনিস চান না, তবে Material Design-এ টিকে থাকুন
আপনার অ্যাপকে "ইউনিক" এবং "অন্যদের থেকে আলাদা দাঁড়াতে" হয় না পপুলার এবং ভালো দেখানোর জন্য। গুগলের Material Design সেটিই অর্জন করতে চেয়েছিল - ইন্ডাস্ট্রি জুড়ে অ্যাপ UI-এর একটি স্ট্যান্ডার্ড, এবং তারা ভালো কাজ করেছে। Material Design-এ টিকে থাকা প্রচুর পপুলার অ্যাপ আছে - Android-এ কিছু সবচেয়ে বড় নাম, যেমন SwiftKey, Nova Launcher, Textra SMS, YouTube, শুধু নাম 몇몇।
Material Design-এর কোর ফোকাস হলো কার্ড-ভিত্তিক লেয়াউট, একটি স olid কালার প্যালেটের সাথে। গুগল টপ ইন্ডাস্ট্রি ডিজাইনারের সাথে কাজ করেছে, মিনিমালিস্ট ডিজাইন প্র্যাকটিস থেকে অনেক এলিমেন্ট আঁকা, এবং পুরো জিনিসটি ফ্রিতে রিলিজ করেছে - এটি খুব ভালো ডিল, যেহেতু ওয়েবসাইট এবং অ্যাপ ডিজাইন কোর্স হাজার হাজার ডলার খরচ করে ই-বুক, ভিডিও, ইত্যাদির জন্য।
Material Design-এ শুরু করা অবিশ্বাস্যভাবে সহজ, এবং কিছু টুল আছে যা এটাকে আরও সিম্পল করে, যেগুলো নিচে তালিকাভুক্ত:
- Material Theme Editor (macOS + Sketch)
- Material Design Color Palette প্লাগ-ইন (PhotoShop / Illustrator)
- Material Design UI Kit PSD (PhotoShop)
- Android Material Design UI Kit (Sketch)
- Material UI Theme Generator
এবং আপনার যদি সিম্পল, এলিগ্যান্ট Material Design থিম তৈরি করার জন্য কিছু ইনস্পিরেশনের প্রয়োজন হয়, তবে এই লিস্ট ব্লগগুলো চেক করুন:
- MaterialDesignBlog - ১৫ Awesome examples of Material Design done right
- MockPlus - ১২ Best Material Design Website Examples to Draw Inspiration
- AndroidAuthority - ১০ best Material Design apps for Android
কালার গ্রেডিয়েন্ট আপনার চিন্তার চেয়ে অনেক সহজ
Material Design-এর একটি অল্টারনেটিভ হিসেবে, ডোলর গ্রেডিয়েন্ট সিম্পল, ট্রেন্ডি, এবং চোখ ধরা। এবং আপনি ভাবতে পারেন ডিজাইনাররা অনেক সময় কাটায় সব রং পেইন্ট করতে, বা আল্টিমেট গ্রেডিয়েন্ট ডিজাইন করতে। আপনি ভুল হয়েছেন - এটি PhotoShop-এ ১০ সেকেন্ডে করা যায়।
আমি আপনাকে এর মাধ্যমে হাঁটা দিচ্ছি, দেখানোর জন্য কতটা সহজ।
Mobile-এর জন্য একটি নতুন PS প্রজেক্ট তৈরি করুন (১০৮০ x ১৯২০ px @ ৭২ ppi কাজ করবে)
UIGradients.com-এ যান এবং কিছু পছন্দ করুন।
প্রিভিউর উপরে থেকে গ্রেডিয়েন্ট কালার কপি করুন।
PS-এ একটি খালি লেয়ারের ওপর রাইট-ক্লিক করুন, এবং Blending Options > Gradient Overlay-এ যান।
ড্রপ-ডাউন মেনুর গ্রেডিয়েন্ট প্যাটার্ন প্রিভিউর ওপর সরাসরি ক্লিক করুন - ড্রপ-ডাউন বাটনে ক্লিক করবেন না। গ্রেডিয়েন্টের ওপর সরাসরি ক্লিক করলে কালার এডিটর খুলবে।
এখন শুধু UIGradient থেকে কালার হেক্স ভ্যালুগুলো PS গ্রেডিয়েন্ট এডিটরে পেস্ট করুন।
প্রয়োজন মতো অ্যাডজাস্ট করুন। আপনার অ্যান্ড্রয়েড অ্যাপের জন্য এখন একটি প্রফেশনাল গ্রেডিয়েন্ট ব্যাকগ্রাউন্ড আছে।
চেক আউট করার লায়ক অন্যান্য গ্রেডিয়েন্ট টুল:
- WebGradients.com
- Android Shapes Generator (XML-এর মাধ্যমে শেপ জেনারেট করার জন্য, গ্রেডিয়েন্টের অপশনসহ)
JPG / PNG-এর বদলে SVGs ব্যবহার করুন
আপনার গ্রাফিক্যাল এলিমেন্টের জন্য (বাটন, লোগো, ইত্যাদি) PNG বা JPG ব্যবহার করার বদলে, আপনার সত্যিকারের SVGs (Scalable Vector Graphics) ব্যবহার করা উচিত। কারণ SVGs রিসাইজ করা যায় কোয়ালিটি লস ছাড়া - উদাহরণস্বরূপ, আপনি যদি একটি JPG কে বড় ভ্যালুতে আপস্কেল করেন, তবে এটি কোয়ালিটি হারায় এবং ব্লার / পিক্সেলেটেড হয়ে যায়। একটি SVG নয়। লোকেরা চেষ্টা করে বড় PNG ফাইল ব্যবহার করতে যা ডাউনস্কেল হবে অ্যান্ড্রয়েড স্ক্রিনে ফিট করার জন্য - যখন বদলে, আপনি ছোট SVG ব্যবহার করতে পারেন যা আপস্কেল হয় কোনো কোয়ালিটি লস ছাড়া।
আরও, SVGs PNG-এর চেয়ে ৬০% থেকে ৮০% ছোট ফাইল সাইজে হতে পারে। এর মানে আপনার অ্যাপ বা মোবাইল ওয়েবসাইট ব্যবহারকারীর জন্য দ্রুত লোড হবে, এবং স্ক্রিন রেজোলিউশন যেন যেন হোক ভালো দেখাবে।
Theme.AppCompat.DayNight ব্যবহার করে ডার্ক মোড অন্তর্ভুক্ত করুন
আপনার অ্যাপে ডার্ক / নাইট মোড থিম অন্তর্ভুক্ত করার জন্য আপনাকে দুটি আলাদা থিম ডিজাইন করার প্রয়োজন নেই। এটা প্রায়শই AppCompat লাইব্রেরির বিল্ট-ইন, আপনাকে শুধু এটি ইনেবল করতে হবে এবং ভ্যালুগুলো এডিট করতে হবে।
Appual's গাইড দেখুন "How to Implement a Dark Mode in your Android App"।
একটি টেমপ্লেট বা মোবাইল UI কিট ব্যবহার করুন
যদি আপনার অ্যাপ একটি ফ্যান্সি, কাস্টমাইজড GUI-এর জন্য কল না করে, তবে একটি টেমপ্লেট বা কিট ব্যবহার করতে কিছুই সমস্যা নেই। টেমপ্লেট এবং কিট একটি ইনস্পিরেশনাল গাইডলাইন হিসেবে ব্যবহার করা যায়, অথবা আপনি শুধু টেমপ্লেট / কিটকেও ইহা ব্যবহার করতে পারেন, আপনার নিজের বাটন এবং স্টাফ অ্যাড করে।
Android UI টেমপ্লেট এবং কিটের জন্য কিছু গ্রেট রিসোর্স:
- SpeckyBoy - ৫০ Free Mobile UI Kits for iOS & Android
- SketchAppSources - Android UI App Resources (Sketch)
- Freebiesbug - PSD UI Kits (PhotoShop)
