ایسی Android ایپ UI کا ڈیزائن کیسے کریں جو چوس نہیں جاتا ہے

. لیکن ڈویلپر کیوں ایسا نہیں کرسکتے ہیں؟



اس دن جب ، متحرک سپلیش لینڈنگ پیجز اور فینسی لے آؤٹ ایک چیز تھے ، تب یقین ہے کہ کسی پیشہ ور ڈیزائنر کی خدمات حاصل کرنا سمجھ میں آگیا ہے۔ لیکن آج کا رجحان ہے کم سے کم - یا کم از کم بڑے پیمانے پر آسان بنایا گیا ہے۔

میں آپ کو ایک عجیب مثال پیش کرتا ہوں - تھوڑی دیر پہلے ، کسی نے مجھ سے ان کے پی سی سافٹ ویئر کے لئے سپلیش اسکرین بنانے کے لئے کہا۔ اس ل I میں سب نکل گیا - اسکوچ پیپر پر نکالا ، فوٹو شاپ پر امپورٹ کیا ، بہت ساری فینسی نیین لائنز اور اثرات تخلیق کیے۔ یہ سپلیش اسکرین کے بجائے ڈیسک ٹاپ وال پیپر ہوسکتا تھا۔ نکتہ یہ ہے کہ میں نے ان کے لئے یہ واقعتا پسند اور وسیع ڈیزائن تیار کیا ہے۔



جیسا کہ آپ شاید اندازہ لگا سکتے ہیں ، انہیں یہ پسند نہیں آیا۔ وہ جس ڈیزائن کے ساتھ گئے تھے وہ لفظی طور پر چند اوور لیپنگ رنگوں کے دائروں کا تھوڑا لوگو ، اور اس کے نیچے سوفٹ ویئر کا نام تھا۔ جیسے ، فوٹو شاپ کام میں 2 منٹ۔ اور تم جانتے ہو کیا؟ مجھے ایک طرح سے اتفاق کرنا پڑا کہ یہ میرے سے بہتر تھا۔



اس لئے میں جو بات کر رہا ہوں وہ یہ ہے۔ - میرے خیال میں پروگرامر بھی اسی غلطی کے جال میں پھنس جاتے ہیں جو میں نے کیا تھا۔ ہم UIs اور سپلیش اسکرینوں کے بارے میں سوچنے کی ضرورت رکھتے ہیں جن کی ضرورت ان واقعی غیر حقیقی ، چشم کشا چیزوں سے ہوتی ہے جو ایپ کو بناتی ہیں۔ باہر کھڑے ہو جاؤ . لیکن انہیں نہیں ہونا چاہئے - ایمانداری سے ، انہیں نہیں ہونا چاہئے۔ ہمیں ایک لینا چاہئے پروگرامر ذہنیت اور اس کو جمالیاتی ڈیزائن پر لاگو کریں۔ آسان ، فعال ، کام کرتا ہے۔



اس آرٹیکل میں ، ہم ایک خوبصورت اینڈرائیڈ ایپلی کیشن UI / UX بنانے کے لئے کچھ انتہائی آسان طریقوں پر غور کریں گے ، یہاں تک کہ اگر آپ کو ڈیزائننگ کا تجربہ بھی نہ ہو۔

جب تک کہ آپ واقعی کچھ اور نہ چاہتے ہو ، مادی ڈیزائن پر قائم رہیں

آپ کی ایپ کو 'بننے کی ضرورت نہیں ہے' انوکھا ' اور “ باقی سے کھڑے ہو جاؤ ' یہ مقبول ہونے اور اچھے لگنے کے ل.۔ یہی گوگل کا ہے مادی ڈیزائن حاصل کرنے کے لئے نکلے۔ پوری صنعت میں ایپ UI کیلئے ایک معیار ، اور انہوں نے ایک اچھا کام کیا ہے۔ وہاں بہت ساری مقبول ایپس موجود ہیں جو میٹریل ڈیزائن پر قائم رہتی ہیں - Android ایپس کے کچھ بڑے نام ، جیسے سوئفٹکی ، نووا لانچر ، ٹیکسٹرا ایس ایم ایس ، یوٹیوب ، صرف کچھ ناموں کے نام۔

مادی ڈیزائن کی بنیادی توجہ کارڈ پر مبنی لے آؤٹ پر ہے ، جس میں ٹھوس رنگ پیلیٹ ہے۔ گوگل نے اعلی صنعت ڈیزائنرز کے ساتھ مل کر کام کیا ، کم سے کم ڈیزائن کے طریقوں سے بہت سارے عناصر تیار کیے ، اور پھر پوری چیز کو مفت میں جاری کیا - یہ ایک اچھی بات ہے ، کیونکہ ویب سائٹ اور ایپ ڈیزائن کورسز ای بک ، ویڈیوز ، وغیرہ



مٹیریل ڈیزائن کے ساتھ شروعات کرنا ناقابل یقین حد تک آسان ہے ، اور یہاں بہت سارے ٹولز موجود ہیں جو اسے اور بھی آسان بنا دیتے ہیں ، جن کی ہم ذیل میں فہرست بنائیں گے۔

  • مادی تھیم ایڈیٹر (میکوس + خاکہ)
  • مادی ڈیزائن رنگین پیلیٹ پلگ ان (فوٹو شاپ / السٹریٹر)
  • مواد ڈیزائن UI کٹ پی ایس ڈی (فوٹو شاپ)
  • لوڈ ، اتارنا Android مادہ ڈیزائن UI کٹ ( خاکہ)
  • میٹریل UI تھیم جنریٹر

اور اگر آپ کو آسان ، خوبصورت مادی ڈیزائن تھیمز بنانے کے ل some کچھ حوصلہ افزائی کی ضرورت ہے تو ، فہرست کے یہ بلاگز دیکھیں۔

رنگین تدبیریں آپ کے خیال سے کہیں زیادہ آسان ہیں

میٹریل ڈیزائن کے متبادل کے ل. ، ڈولر گریڈینٹ سادہ ، جدید ، اور چشم کشا ہیں۔ اور آپ یہ سوچ سکتے ہیں کہ ڈیزائنرز تمام رنگوں میں پینٹنگ کرنے ، یا حتمی میلان ڈیزائن کرنے میں کافی وقت صرف کرتے ہیں۔ آپ غلط ہوں گے - یہ فوٹو شاپ میں 10 سیکنڈ میں کیا جاسکتا ہے۔

فوٹوشاپ میلان UI میں 10 سیکنڈ۔

یہاں تک کہ میں آپ کو یہاں سے گزروں گا ، یہ بتانے کے لئے کہ یہ کتنا آسان ہے۔

موبائل کے لئے ایک نیا PS پروجیکٹ بنائیں ( 1080 x 1920 px @ 72 ppi ٹھیک کام کرتا ہے)

UIGradients.com - پہلے سے تیار شدہ میلانڈ کا بڑا ذخیرہ۔

کے پاس جاؤ یوآئیگریڈیئنٹ ڈاٹ کام اور اپنی پسند کی کوئی چیز تلاش کریں۔

رنگین ہیکس اقدار کو Uigradient سے کاپی کریں

پیش نظارہ کے اوپر سے میلان رنگ کی کاپی کریں۔

فوٹو شاپ میلان سلیکٹر۔

PS میں کسی خالی پرت پر دائیں کلک کریں ، اور ملاوٹ کے اختیارات> تدریجی اوورلے پر جائیں۔

ڈراپ ڈاؤن مینو میں میلان پیٹرن پیش نظارہ پر براہ راست کلک کریں - ڈراپ ڈاؤن بٹن پر کلک نہ کریں۔ میلان پر براہ راست کلک کرنے سے رنگین ایڈیٹر کھل جاتا ہے۔

U جیگراڈینٹ سے PS تدریجی ٹول میں ان پٹ ہیکس اقدار ان پٹ۔

اب صرف UIGradient سے رنگین ہیکس اقدار کو پی ایس گریڈینٹ ایڈیٹر میں پیسٹ کریں۔

ضرورت کے مطابق ایڈجسٹ کریں۔ اب آپ کے پاس اپنے Android ایپ کے لئے پیشہ ورانہ میلان پس منظر ہے۔

جانچ پڑتال کے قابل دوسرے تدریجی اوزار:

  • ویب گریڈینٹ ڈاٹ کام
  • Android شکلیں جنریٹر ( XML کے ذریعہ شکلیں پیدا کرنے کے ل grad ، تدریجی اختیار کے ساتھ)

جے پی جی / پی این جی کی بجائے ایس وی جی استعمال کریں

اپنے گرافیکل عناصر (بٹن ، لوگو ، وغیرہ) کیلئے PNGs یا JPGs استعمال کرنے کے بجائے آپ کو واقعی SVGs استعمال کرنا چاہئے ( توسیع پذیر ویکٹر گرافکس) اس کے بجائے اس کی وجہ یہ ہے کہ معیار کو کھونے کے بغیر SVG کو تبدیل کیا جاسکتا ہے - مثال کے طور پر ، اگر آپ کسی JPG کو کسی بڑی قیمت پر چڑھاتے ہیں تو ، اس کا معیار کھو جاتا ہے اور دھندلا پن / pixelated ہوجاتا ہے۔ ایک ایس وی جی نہیں کرتا ہے۔ لوگ بڑی بڑی PNG فائلوں کو استعمال کرنے کی کوشش کرتے ہیں جو ہو گی ڈاؤن اسکیل اینڈروئیڈ اسکرین پر فٹ ہونے کے ل - - جب اس کے بجائے ، آپ چھوٹے چھوٹے ایس وی جی استعمال کرسکتے ہیں جو ہیں اعلی درجے کی معیار میں کسی نقصان کے بغیر.

مزید یہ کہ ، ایس وی جی بھی ہوسکتی ہیں PNG کے مقابلے میں فائل سائز میں 60٪ سے 80٪ چھوٹا ہے . اس کا مطلب ہے کہ آپ کی ایپ یا موبائل ویب سائٹ صارف کے لئے تیز تر لوڈ ہو گی ، اور اسکرین کے حل سے قطع نظر اچھ lookی نظر آئے گی۔

تھیم ڈاٹ کام کا استعمال کرتے ہوئے ڈارک موڈ شامل کریں۔ ڈے نائٹ

آپ کو اپنی ایپ میں ڈارک / نائٹ موڈ تھیم شامل کرنے کے لئے دو الگ الگ تھیمز ڈیزائن کرنے کی ضرورت نہیں ہے۔ یہ بہت زیادہ AppCompat لائبریری میں بنایا ہوا ہے ، آپ کو صرف اسے قابل بنانے اور اقدار میں ترمیم کرنے کی ضرورت ہے۔

ایپلئل گائیڈ ملاحظہ کریں ' اپنے اینڈروئیڈ ایپ میں ڈارک موڈ کو کیسے نافذ کریں ”۔

ٹیمپلیٹ یا موبائل UI کٹ استعمال کریں

اگر آپ کی ایپ کسی پسندی ، اپنی مرضی کے مطابق جی یو آئی کو طلب نہیں کرتی ہے تو ، ٹیمپلیٹ یا کٹ کے استعمال میں قطعی کوئی برائی نہیں ہے۔ ٹیمپلیٹس اور کٹس کو ایک متاثر کن ہدایت نامہ کے طور پر استعمال کیا جاسکتا ہے ، یا آپ اپنے بٹنوں اور چیزوں کو شامل کرکے لفظی طور پر صرف سانچے / کٹ کو ہی استعمال کرسکتے ہیں۔

Android UI ٹیمپلیٹس اور کٹس کیلئے کچھ عمدہ وسائل:

  • سپکی بائے - IOS اور Android کے لئے 50 مفت موبائل UI کٹس
  • خاکہ نگاری کے وسائل - Android UI ایپ وسائل ( خاکہ)
  • Freebiesbug - پی ایس ڈی UI کٹس ( فوٹو شاپ)
ٹیگز انڈروئد ترقی 4 منٹ پڑھا