ہر پروجیکٹ کا دائیں طرف لائیو پریویو ہے — کوئی موک اپ نہیں بلکہ پروجیکٹ فولڈر کی اصل فائلیں، مقامی طور پر serve ہو کر ایجنٹ کے لکھتے ہی دوبارہ پینٹ ہوتی ہیں۔ جو آپ دیکھ رہے ہیں وہ لفظاً وہی ہے جو آپ شپ کریں گے۔
Result، Code اور Split
پینل کے اوپر والے ٹیبز ایک ہی حالت کو دیکھنے کا طریقہ بدلتے ہیں:
- Result — رینڈر شدہ ڈیزائن۔ سٹیئرنگ یہیں ہوتی ہے۔
- Code — پریویو کے نیچے کا سورس، جب آپ فائلیں دیکھنا چاہیں۔
- Split — دونوں ساتھ ساتھ۔
ویو پورٹس اور زوم
ٹول بار کے ڈیوائس بٹن نتیجے کو مقررہ چوڑائیوں پر دوبارہ بہاتے ہیں — ڈیسک ٹاپ، ٹیبلٹ اور فون — تاکہ آپ رن چھوڑے بغیر دیکھ سکیں کہ ڈیزائن کیسے جواب دیتا ہے، اور width چپس سیدھا ان بریک پوائنٹس پر جاتی ہیں جنہیں گیٹ چیک کرتی ہے (وہ فون اور ٹیبلٹ سائز جہاں نیو اور ہٹ ٹارگٹس اکثر ٹوٹتے ہیں)۔
ان کے ساتھ والا زوم کنٹرول −، ایک فیصد اور + دکھاتا ہے، اور 25% سے 400% تک قدم بہ قدم چلتا ہے۔ آپ ٹریک پیڈ پر pinch بھی کر سکتے ہیں، Ctrl-scroll کر سکتے ہیں، یا ⌘/Ctrl +، − اور 0 دبا سکتے ہیں — یہ شارٹ کٹس اس وقت بھی کام کرتے ہیں جب فوکس ڈیزائن کے اندر ہو۔ ڈیوائس فریم پر pinch کرسر کے نیچے والی جگہ کو اپنی جگہ پر رکھتا ہے۔ 100% پر واپس جانے کے لیے فیصد پر کلک کریں۔ جو ڈیزائن اپنا منظر خود زوم کرتے ہیں، جیسے نقشہ، وہ pinch اپنے لیے رکھتے ہیں۔
چونکہ چیک لائیو ہے، گیٹ کی چلائی جانے والی پانچ چوڑائیوں کی تخلیق — ڈیسک ٹاپ، لیپ ٹاپ، ٹیبلٹ اور دو فون چوڑائیاں — ایسی چیز ہے جسے آپ خود کسی بھی وقت دیکھ سکتے ہیں، صرف ٹرن ختم ہونے کے بعد نہیں۔
پک، کمنٹ اور ٹولز ریل
پریویو کے اندر ⌥-hover کرسر کے نیچے والے عنصر کو نمایاں کرتا ہے — وہی عنصر جو ایجنٹ دیکھتا ہے — اور ⌥-click اس پر کمنٹ پن کرتا ہے۔ ریل بٹن سٹیئرنگ ڈراز کھولتے ہیں: لائیو کنٹرولز کے لیے Tweaks، پنز اور ڈرائنگ کے لیے Comment mode، اور ڈیزائن سے پوچھنے کے لیے کہ یہ ایسا کیوں دکھتا ہے اس کے لیے Designer talk۔ ہر ایک کا اپنا صفحہ Steering کے تحت ہے۔
Present موڈ
Present اسٹوڈیو کروم ہٹا دیتا ہے اور ونڈو کو نتیجے سے بھر دیتا ہے — رن کو کمرے میں موجود کسی اور کو دکھانے کے لیے، یا بس ٹرانسکرپٹ کے بغیر ڈیزائن دیکھنے کے لیے۔ Escape پروجیکٹ پر واپس لے آتی ہے۔
ایجنٹ کے کام کے دوران کیا لائیو رہتا ہے
پریویو ٹرن کے دوران دوبارہ پینٹ ہوتا ہے، صرف آخر میں نہیں — آپ ڈیزائن کو فائل بہ فائل جڑتے دیکھتے ہیں۔ ایجنٹس کو ہدایت ہوتی ہے کہ پہلے مین پیج لکھیں اور ہر سیکشن یا اسکرین کے بعد اسے محفوظ کریں، اس لیے پریویو بلڈ کے آخر میں نہیں بلکہ شروع ہی میں ڈیزائن دکھانے لگتا ہے۔ ڈیٹا ماڈل سے بننے والی ڈیزائن اقسام، جیسے Mobile app، Social Media، Pixel Sprite، Diagram اور Map، پہلے starter رینڈر کرتی ہیں اور ماڈل بڑھنے کے ساتھ اپڈیٹ ہوتی ہیں۔ سٹیئرنگ (picks، کمنٹس، Tweaks) بھی لائیو رہتی ہے؛ نئے نوٹس بلڈ میں خلل ڈالنے کے بجائے اگلے ٹرن کی قطار میں چلے جاتے ہیں۔
مین پیج بننے سے پہلے
ایک ملٹی اسکرین ڈیزائن مین پیج محفوظ ہونے سے پہلے کئی منٹ ٹوکنز، کمپوننٹ اسٹائلز اور مشترکہ اسکرپٹس لکھنے میں لگا سکتا ہے۔ تب تک پریویو کی جگہ خالی فریم یا ٹیمپلیٹ کے نمونہ مواد کے بجائے بلڈ کارڈ دکھاتی ہے:
- Design so far سب سے اوپر ہوتا ہے۔ جیسے ہی ایجنٹ اپنا ڈیزائن پلان محفوظ کرتا ہے، کارڈ اسے ڈیزائن کے اپنے ٹوکنز میں بناتا ہے: اصل ہیڈلائن اور مرکزی ایکشن، ترتیب سے سیکشنز، وہ ایک bold لمحہ اور پہلی اسکرین کا ایجنٹ کا خاکہ۔ اس کے بعد ہر تھیم میں ایک نمونہ اسکرین آتی ہے، پھر پیلیٹ، ٹائپ فیسز اور کمپوننٹس (بٹن، کارڈز، چپس، اِن پٹس، ٹوگلز) جو ایجنٹ کی محفوظ کردہ stylesheets سے بنے ہیں۔ اس پر لیبل لگا ہوتا ہے کہ یہ نمونہ ہے، ایجنٹ کی لکھی ہوئی اسکرین نہیں، اور کارڈ مواد کے مطابق بڑھتا ہے، اس لیے لمبا پلان دوسرے اسکرول بار کے بغیر اوپر سے نیچے پڑھا جا سکتا ہے۔
- Build so far اس رن میں لکھی گئی فائلوں کی فہرست دیتا ہے، تازہ ترین پہلے، ان کے سائز اور عمر کے ساتھ، اور ساتھ ایک لائن جو بتاتی ہے کہ مین پیج ابھی لکھا نہیں گیا، ابھی تک ٹیمپلیٹ کا starter ہے، یا لکھا جا چکا ہے اور لوڈ ہو رہا ہے۔
- لمبے رن پر ایک نوٹ یہ بھی بتاتا ہے کہ ملٹی اسکرین ڈیزائنز کے لیے لمبے بلڈز معمول کی بات ہیں۔
نئی ویب سائٹ پر پہلا بلڈ چلنے کے دوران ٹیمپلیٹ کا placeholder پیج چھپا رہتا ہے۔ ٹوکنز یا stylesheets لکھنا آغاز نہیں گنا جاتا؛ کارڈ تب تک دکھتا رہتا ہے جب تک ایجنٹ خود مین پیج دوبارہ نہ لکھے، اور یہ صاف بتاتا ہے: پیج ابھی بھی ٹیمپلیٹ کا placeholder ہے، آپ کا ڈیزائن نہیں۔ ایڈیٹر ٹیمپلیٹس (اسپرائٹ، کیریکٹر، 3D پارٹ، ڈایاگرام، نقشہ) اس سے مستثنیٰ ہیں — ان کا مین پیج خود ایڈیٹر ہے، اس لیے کوئی بھی ڈیزائن فائل پریویو کو سامنے لے آتی ہے۔
کارڈ ڈیزائن دکھاتا ہے، کبھی سورس کوڈ نہیں — کوئی فیصد یا وقت کے اندازے نہیں، صرف وہی جو ایجنٹ نے واقعی محفوظ کیا ہے۔
اگر کوئی محفوظ شدہ پیج لوڈ ہو جائے مگر پریویو سے کبھی نہ جڑے (مثلاً اس لیے کہ اس کی کوئی اسکرپٹ شروع ہی میں ناکام ہو گئی)، تو پریویو دو سیکنڈ بعد اسے جیسا ہے ویسا دکھا دیتا ہے، اس نوٹ کے ساتھ: "Showing the saved page — it hasn't answered the preview bridge, so picking and comments wait." (محفوظ شدہ پیج دکھایا جا رہا ہے — اس نے preview bridge کو جواب نہیں دیا، اس لیے پک اور کمنٹس رکے ہوئے ہیں۔) بعد میں محفوظ کرنے پر یہ پھر بھی ریفریش ہوتا ہے۔
مشورہ: نتیجہ مکمل کہنے سے پہلے فون ویو پورٹ چیک کریں — گیٹ ضرور کرے گی۔ ڈیسک ٹاپ چوڑائی پر چلنے والی نیو جو موبائل پر مردہ ہو جائے، سب سے عام FAIL ہے۔