ایڈوب تجربہ ڈیزائن ٹیکنیکس، تجاویز، اور تکنیک

01 کے 07

ایڈوب تجربہ ڈیزائن ٹیکنیکس، تجاویز، اور تکنیک

جب ایڈوب نے عوامی پیش نظارہ کے طور پر تجربہ ڈیزائن متعارف کرایا تو، کمپنی نے ایک ہی وقت میں دو بجائے حیرت انگیز پنکھ کو پورا کیا. سب سے پہلے، وہ ابھرتی ہوئی پروٹوٹائپ سوفٹ ویئر کی مارکیٹ میں ایک جگہ باہر پھنس گئے. دوسرا، انہوں نے صارفین کو "کام میں ترقی" کے ساتھ کھیلنے کے لئے ایک موقع بنایا اور صارفین کو یہ پیش رفت پر اثر انداز کر رہا ہے. اب یہ درخواست چند مہینے تک دستیاب ہے، میں نے سوچا کہ کچھ تجربہ ڈیزائن کی ترکیبیں، تجاویز، اور تکنیکوں کا اشتراک کرنے کا ایک اچھا وقت ہوگا.

لیکن سب سے پہلے، آپ سوچ رہے ہو کہ پروٹوٹائپ سوفٹ ویئر کی طرف سے کیا مطلب ہے. اس جگہ کے بڑے کھلاڑیوں میں پروتوس، پرنسپیز ، یوکسپن، ائٹومیک.یو ، تجربہ ڈیزائن اور انوژن ہیں. درخواستوں کے برعکس Sketch 3، فوٹوشاپ اور Illustrator جہاں جامد ڈیزائن تیار کیے جاتے ہیں، یہ گرافیکل ایڈیٹر آج کے موبائل اور ویب ڈیزائن کی جگہ میں مشترکہ طور پر، تحریک اور دیگر خصوصیات متعارف کراتے ہیں.

موبائل کے عروج اور ناگزیر، صارف پر لیزر کی طرح توجہ مرکوز کے ساتھ، یہ ڈیزائنرز کے لئے کچھ اب تک کچھ اسکرینوں کو پکڑنے کے لئے کافی نہیں ہے، چند کمپیوٹرز کو ایک ساتھ ھیںچو اور پھر اس منصوبے کی رہائی یا ویب سرور میں اپ لوڈ کریں. UI / UX کام کے بہاؤ نے بنیادی طور پر چیزیں تبدیل کردی ہیں. عمل کے ہر مرحلے، صارف، خاکہ، wireframes، mockups، اور prototyping کی شناخت سے اب وسیع صارف کی جانچ کے تابع ہیں.

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

اصل میں، یہ سافٹ ویئر آج کے "ریپ پروٹوٹائپ" ڈیزائن اور ڈویلپمنٹ ماحول میں ایک اہم حصہ بن گیا ہے.

اس کے ساتھ، چلو تجربہ ڈیزائن کے ساتھ کچھ مزہ آتے ہیں.

02 کے 07

ایڈوب تجربہ ڈیزائن میں ایک سادہ سرکل کے ساتھ ایک منزل پن بنائیں

XD کا ایک صاف پہلو ویکٹر ڈرائنگ کے اوزار کا استعمال ہے. آئکن نہیں مل سکا؟ کوئی مسئلہ نہیں. اپنا اپنا رول. یہاں کیسے ہے:

1. ایلپس کا آلہ منتخب کریں اور پریس / Alt-Shift کی چابیاں کے ساتھ دبائیں، ایک حلقہ ڈراؤ.
2. حلقہ منتخب کردہ کے ساتھ، مکمل رنگ FF0000 اور سرحد میں "کسی" کو مقرر کریں.
3. لنگر پوائنٹس کو دکھانے کے لئے دائرے پر ڈبل کلک کریں. نیچے کے نیچے لنگر نیچے ھیںچیں.
4. منتخب شدہ لنگر پوائنٹ پر ڈبل کلک کریں اور وکر کو لائنوں کے ساتھ تبدیل کر دیا گیا ہے.
5. سفید بھرنے کے ساتھ ایک چھوٹا سا حلقہ ڈرائیو اور کوئی غصہ نہیں. اسے پوزیشن میں منتقل کریں اور پن اور حلقہ کو منتخب کریں. پراپرٹی کے سب سے اوپر پر سیدھا پینل میں افقی مرکز کے بٹن پر کلک کریں اور پن پیدا ہوتا ہے.

03 کے 07

ایڈوب تجربے ڈیزائن میں ایک پس منظر کی بلاگر بنائیں

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

1. ایک نیا آرٹ بورڈ بنائیں اور اپنی پس منظر کی تصویر شامل کریں.
2. آئتاکار کا آلہ منتخب کریں تصویر میں ایک این ڈی آئتاکار ڈرائیو. منتخب آئتاکار کے ساتھ، سفید اور اسٹروک کو بھریں مکمل نہ کریں.
3. منتخب آئتاکار کے ساتھ، خصوصیات پینل میں پس منظر کی چمک منتخب کریں . تین سلائڈر بلور رقم، روشنی اور استحکام ہیں. یہ وہی ہے جو وہ کرتے ہیں:

• خالی رقم: شکل کے نیچے کی تصویر کی بلوغتندی کو قبول کرتا ہے. زیادہ سے زیادہ قیمت +50 ہے.
• چمک: تصویر میں نمائش اور سائے کو ایڈجسٹ کرتی ہے. کم از کم قیمت 50 ہے اور زیادہ سے زیادہ قیمت +50 ہے.
• استحکام: شکل کے شفافیت اور شکل کے تحت تصویر کی نمائش پر اثر انداز ہوتا ہے. اقدار 0٪ سے 100٪ تک ہوتی ہے.

اگر آپ واقعی "چیزوں کو سوئچ کریں" چاہتے ہیں تو، تصویر کی "نظر" کو تبدیل کرنے کے لئے شکل کا رنگ تبدیل کریں اور استحکام کی قیمت سے کھیلنا.

04 کے 07

ایڈوب تجربے کے ڈیزائن میں ایک سکریچ بنائیں

ایک عام ڈیزائن مسئلہ انٹرفیس عناصر عناصر کو ایک عام رنگ ہونا پڑتا ہے، لیکن پس منظر کی تصویر یا ٹھوس رنگ پر کھو دیا جاتا ہے. حل ایک مبتلا ہے. انٹرفیس انٹرفیس عنصر اور پس منظر کے درمیان ایک کچھ بھی غیر متوقع مریض ہے. یہ ایکس ڈی میں پورا کرنا آسان ہے. یہاں کیسے ہے:

1. اپنی آرٹ بورڈ کو XD میں بنائیں، ایک تصویر شامل کریں اور ایک مناسب انٹرفیس کے عناصر کو مناسب UI کٹ - فائل> اوپن UI کٹ سے پیسٹ کریں ... - آرٹ بورڈ میں. مندرجہ بالا تصویر میں تصویر کو حیثیت کے بار اور دیکھنے کے لئے اپلی کیشن بار بنا دیتا ہے.
2. آئتاکار کا آلہ منتخب کریں اور آئتاکار ڈراؤ. پراپرٹیز پینل میں بھریں منتخب کریں اور رنگ چنندہ میں پاپ نیچے سے گریجویٹ منتخب کریں. بلیک اور وائٹ کو میلے رنگ مقرر کریں. ایک قیمت مقرر کریں - دھندلاپن 60٪ اور وائٹ ای قیمت 0 فی صد تک.
3. منتخب آئتاکار کے ساتھ، آبجیکٹ> ترتیب دیں> پس منظر بھیجیں منتخب کریں . انٹرفیس عناصر اب تصویر پر نظر آتے ہیں.

05 کے 07

ایڈوب تجربہ ڈیزائن میں تصویری اوتار بنائیں

عام ڈیزائن پیٹرن چیٹ ایپس میں پایا جاتا ہے جہاں لوگ ایک دوسرے سے گفتگو کرتے ہیں اور اسکرین پر اسپیکر کی تصویر ظاہر ہوتی ہے. یہ اوتار عموما ایسی تصاویر ہیں جو ماسک کئے گئے ہیں. یہ مردہ سادہ ہے اس کو XD میں پورا. یہاں کیسے ہے:

1. آپ آرٹ بورڈ پر ایک تصویر اور ایک حلقہ یا دوسرے شکل کے ساتھ شروع کرتے ہیں. آپ حلقے کو کسی بھی رنگ سے بھر سکتے ہیں. آپ کو کیا کرنے کی ضرورت نہیں ہے ایک اسٹروک رنگ شامل کرنے کے لئے ہے. جب آپ اثر پیدا کرتے ہیں تو یہ غائب ہو جائے گا، لہذا کیوں پریشان ہوسکتا ہے. اگر آپ کو دائرے کو روکنے کی ضرورت ہے تو اسے کلپ بورڈ میں کاپی کریں.
2. حلقے کو تصویر پر منتقل کریں اور تصویر اور دائرہ دونوں کو منتخب کریں. منتخب کردہ بوٹ کی اشیاء کے ساتھ، شکل کے ساتھ ماسک منتخب کریں . جب آپ ماؤس کو آزاد کرتے ہیں تو، اوتار پیدا ہوتا ہے. اس سے آپ اس کا سائز تبدیل کر سکتے ہیں.
3. اگر آپ کو ایک اسٹروک شامل کرنے کی ضرورت ہے تو، آپ کے کلپ بورڈ پر حلقہ بائیں جانب آرٹ بورڈ پر چسپاں کریں. کاپی کے ساتھ منتخب کردہ فلٹر کو پراپرٹی میں بند کردیں اور ایک اسٹروک رنگ اور چوڑائی شامل کریں. ان کو لائن کرنے کے لئے، دونوں اشیاء کو منتخب کریں اور خصوصیات کے پینل میں سب سے اوپر کے اختیارات میں سیدھ اختیارات میں کلک کریں.
4. اگر آپ ماسک میں تصویر کو منتقل کرنا چاہتے ہیں، تو ماسک پر کلک کریں. یہ تصویر اور ماسک کی شکل دکھایا جائے گا. تصویر پر کلک کریں اور اسے پوزیشن میں ڈراو. جب آپ ماؤس کو آزاد کرتے ہیں تو، تصویر ماسک کے اندر اپنی نئی پوزیشن میں ہوگی.

06 کا 07

ایڈوب تجربے ڈیزائن آرٹ بورڈز کے ساتھ کھیلیں

تجربہ ڈیزائن آرٹ بورڈز صرف آپ کے لئے مواد رکھنے کے لئے نہیں ہیں. وہ بھی، جوڑی جا سکتا ہے. یہاں کچھ چیزیں ہیں جو آپ کر سکتے ہیں:

1. اگر آپ کو ایک آرٹ بورڈ کی زمین کی تزئین اور پورٹریٹ کے ورژن کی ضرورت ہو تو، آرٹ بورڈ کو ڈپلیکیٹ کریں اور، ڈپلیکیٹ منتخب کردہ کے ساتھ، پراپرٹیز پینل میں زمین کی تزئین کے بٹن پر کلک کریں. آرٹ بورڈ کو زمین کی تزئین کی واقفیت میں تبدیل کردیا جائے گا. اگر آرٹ بورڈ اس پر مواد رکھتا ہے، تو آرٹ بورڈ کا نام اور آرٹبورڈ کی خصوصیات پر کلک کریں پراپرٹیز پینل.
2. آرٹ بورڈ میں اپنی مرضی کے مطابق رنگ شامل کرنے کے لئے، اور اس معاملے کے لئے منصوبے، آرٹ بورڈ کو منتخب کریں اور پراپرٹیز پینل کے ظہور سیکشن میں بھرپور رنگ چپ پر کلک کریں. رنگ کے لئے ہیجیڈاسیکائل قدر درج کریں اور + نشانی پر کلک کریں. رنگ اپنی مرضی کے رنگ کے طور پر شامل کیا جائے گا. اس رنگ کو دوسری جگہ پر لاگو کرنے کے لئے، ایک اعتراض کو منتخب کریں اور رنگ کو لاگو کرنے کیلئے اپنی مرضی کے مطابق رنگین چپ پر کلک کریں.
3. آرٹ بورڈز عمودی طور پر طومار بنائے جا سکتے ہیں. ایسا کرنے کے لئے، آرٹ بورڈز کو منتخب کریں اور پراپرٹیز پینلز پر یا آرٹ بورڈ بورڈ کے نچلے حصے کے نیچے ھیںچیں. پراپرٹیز پینل کے طومار علاقے میں، پاپ ڈومین مینو سے عمودی کا انتخاب کریں اور اسکرین کے لۓ ملاحظہ کی اونچائی درج کریں. یہ دھکا ہوا نیلے رنگ آپ کو نظارہ کے نیچے دکھاتا ہے. اس کی جانچ کرنے کے لئے، کھیل کے بٹن پر کلک کریں اور اس سے دور کریں. اسکرولنگ کو بند کرنے کے لئے، سکرولنگ پاپ نیچے کوئی بھی منتخب نہ کریں.

07 کے 07

ایڈوب تجربہ ڈیزائن میں موبائل یو آئی کٹ میں ترمیم کریں

آئی ایس او کی ترقی کے لئے تجربہ ڈیزائن میں یو آئی کٹ شامل ہے، لوڈ، اتارنا Android اور ونڈوز UI. جب آپ سب سے پہلے ان کو کھولتے ہیں، تو آپ یہ سوچ سکتے ہیں کہ وہ اچھی طرح سے اچھی جگہ پر قائم ہیں. کافی نہیں - ہر قسم کے ٹکڑوں اور ٹکڑوں میں ٹکڑے ٹکڑے مکمل طور پر قابل تدوین ہے. آو ایک لوڈ، اتارنا Android wireframe کی تعمیر کی طرف سے تلاش کریں.

1. آپ آرٹ بورڈ کے آلے کو منتخب کرتے ہوئے اور پراپرٹیز پینل کے گوگل سیکشن میں لوڈ، اتارنا Android موبائل کا انتخاب کرتے ہیں.
2. فائل> کھولیں UI کٹ> Google مواد منتخب کریں . یہ مواد ڈیزائن UI کٹ کھولتا ہے. میگنفائنگ شیشے کو منتخب کریں اور اس کی سمارٹ گائڈز آرٹ کی بورڈ کو مارکو. میں اس کے ساتھ شروع کرنا پسند کرتا ہوں کیونکہ یہ مجھے انٹرفیس عناصر کے مناسب اسکرین کی جگہ کے لۓ ہدایت دیتا ہے. اگر آپ بلیو سلاخوں میں سے ایک پر کلک کریں تو آپ دیکھیں گے کہ یہ بند ہے. اسے انلاک کرنے کیلئے ہر ایک سے منسلک تالا پر کلک کریں . مارکو آرٹ بورڈ اور انتخاب کلپ بورڈ پر کاپی کریں. اپنے دستاویزات پر واپس جائیں اور اسکرین کو اپنے فن بورڈ میں چسپاں کریں.
3. ایپ بار پر ایک بار کلک کریں کہ آرٹ بورڈ کے سب سے اوپر. نوٹس کریں کہ آپ اسے کس طرح منتخب کرسکتے ہیں. آبجیکٹ کا انتخاب کریں> ترتیب دیں> فرنٹ لے لو. آپ کا انتخاب اب سکرین گائڈز سے اوپر ہے. یہ آپ کو یہ بتانا چاہیے کہ اسکرین پر موجود عناصر میں سے ہر ایک میں ترمیم کرنے کے قابل ہے.
4. سب سے اوپر اسٹیٹس بار دوپہر پر کلک کریں اور پراپرٹیز پینل اور 455A64 تک رنگ بھریں . اپلی کیشن بار ڈبل کلک کریں اور اسے بھریں 607D8B تک سیٹ کریں. یہ آپ کو بتانا چاہئے کہ آپ کو ہر ایک عنصر UI کٹ میں اس منصوبے کے رنگ کی وضاحتیں پورا کرنے کے لئے ترمیم کی جا سکتی ہے.
5. شبیہیں کیا ہے؟ ان کا رنگ تبدیل کرنے کا طریقہ یہاں ہے. اسے منتخب کرنے کے لئے دل پر کلک کریں. اگر آپ پراپرٹیز پینل کو دیکھتے ہیں، تو آپ یہ سمجھ سکتے ہیں کہ آپ انتخاب میں ترمیم نہیں کرسکتے. کافی نہیں دل کو ایک بار پھر ڈبل کلک کریں . پراپرٹیز کھولیں اور آپ کو FF0000 پر بھرپور رنگ تبدیل کریں. باقی شبیہیں اور متن کے لئے اس ڈبل ڈبل کلک کلک کی چال کو دوپہرائیں.