آپ جو بھی ایپ یا ویب سائٹ استعمال کرتے ہیں، اسے کسی نے ڈیزائن کیا ہے۔ UI/UX ڈیزائنرز طے کرتے ہیں کہ اسکرینز کیسی نظر آئیں اور انہیں استعمال کرنا کتنا آسان ہو۔ دنیا بھر میں کمپنیاں، اسٹارٹ اپس اور چھوٹے کاروبار اس کام کے لیے فری لانسرز ہائر کرتے ہیں۔
UI اور UX: فرق کیا ہے؟
| UX (یوزر کا تجربہ) | UI (یوزر انٹرفیس) | |
|---|---|---|
| سوال | کیا یہ آسان اور مفید ہے؟ | کیا یہ واضح اور خوبصورت لگتا ہے؟ |
| کام | ریسرچ، یوزر فلوز، ڈھانچہ، وائر فریمز، ٹیسٹنگ | رنگ، فونٹس، آئیکنز، بٹن، لے آؤٹ، بصری نفاست |
| نتیجہ | یوزرز الجھے بغیر اپنے مقصد تک پہنچتے ہیں | اسکرینز پیشہ ورانہ اور یکساں لگتی ہیں |
دونوں ہمیشہ ساتھ کام کرتے ہیں۔ خوبصورت ایپ جو یوزرز کو الجھائے ناکام ہوتی ہے؛ مفید ایپ جو بے پروائی سے بنی لگے بھروسہ کھو دیتی ہے۔ زیادہ تر فری لانس کام دونوں مانگتے ہیں، جسے اکثر UI/UX یا پروڈکٹ ڈیزائن کہا جاتا ہے۔
Figma کیا ہے
Figma ایک ڈیزائن ٹول ہے جو براؤزر میں اور ڈیسک ٹاپ ایپ کے طور پر چلتا ہے۔ ڈیزائنرز اس سے ایپس اور ویب سائٹس کی اسکرینز بناتے ہیں، دوبارہ استعمال ہونے والے کمپوننٹس تیار کرتے ہیں، کلک ہونے والے پروٹوٹائپ بناتے ہیں اور کلائنٹس اور ڈویلپرز کے ساتھ کام شیئر کرتے ہیں۔ کئی لوگ ایک ہی فائل میں ایک ساتھ کام کر سکتے ہیں، اور کلائنٹ سیدھا ڈیزائن پر کمنٹ کر سکتے ہیں۔
سیکھنے کے لیے مفت پلان کافی ہے
Figma کا ایک مفت پلان ہے اور پیڈ پلانز ہیں۔ مفت پلان کی کچھ حدیں ہیں (مثلاً ٹیم پراجیکٹس کی تعداد اور کچھ ایڈوانسڈ فیچرز پر)، لیکن یہ پورے کورس اور آپ کے پہلے پورٹ فولیو پراجیکٹس کے لیے کافی ہے۔ طلبہ اور اساتذہ Figma کے مفت ایجوکیشن پلان کے لیے درخواست دے سکتے ہیں۔ کچھ بھی خریدنے سے پہلے موجودہ قیمتوں کا صفحہ دیکھیں۔
Figma فائل کے بنیادی حصے
- فائلیں اور صفحات: ایک فائل میں ایک پراجیکٹ ہوتا ہے؛ صفحات اسے ترتیب دیتے ہیں (مثلاً "Wireframes"، "Final screens"، "Components")۔
- فریمز: وہ اسکرینز یا آرٹ بورڈز جن پر آپ ڈیزائن کرتے ہیں، جیسے فون اسکرین یا ڈیسک ٹاپ صفحہ۔
- لیئرز پینل (بائیں): ہر چیز ترتیب سے۔ لیئرز کے اچھے نام فائل کو صاف رکھتے ہیں۔
- پراپرٹیز پینل (دائیں): منتخب چیز کا سائز، جگہ، رنگ، ٹیکسٹ اور ایفیکٹس۔
- ٹول بار: فریم، شکل، پین، ٹیکسٹ اور کمنٹ کے ٹولز۔
کلائنٹ UI/UX ڈیزائنرز کو کس کام کے لیے ہائر کرتے ہیں
- شروع سے نئی موبائل ایپ یا ویب سائٹ ڈیزائن کرنا۔
- پرانی ایپ یا سائٹ کا نیا ڈیزائن۔
- پروڈکٹس اور مہمات کے لیے لینڈنگ پیجز۔
- سافٹ ویئر کے لیے ڈیش بورڈز اور ایڈمن پینلز۔
- ڈیزائن سسٹمز اور کمپوننٹ لائبریریاں۔
- کسی آئیڈیا کو ٹیسٹ کرنے یا سرمایہ کاروں کو دکھانے کے لیے کلک ہونے والے پروٹوٹائپ۔
اس کورس میں آپ اچھے پروڈکٹ ڈیزائن کے پیچھے کی سوچ اور اسے پورا کرنے کی Figma مہارتیں سیکھیں گے۔
عملی مشق (15 منٹ)
- Figma کا مفت اکاؤنٹ اور نئی ڈیزائن فائل بنائیں۔
- تین صفحات شامل کریں: "Wireframes"، "Final screens" اور "Components"۔
- اپنے فون پر دو ایپس کھولیں اور ہر ایک میں نظر آنے والا ایک UX مسئلہ اور ایک UI مسئلہ لکھیں۔
اپنی پیش رفت محفوظ کرنے اور ٹیسٹ دینے کے لیے لاگ اِن کریں یا مفت اکاؤنٹ بنائیں۔ لاگ اِن