Mobile app فون اسکرینز کا سیٹ بناتا ہے — ایک شاٹ نہیں بلکہ فلو: آن بورڈنگ، مین اسکرین، سیٹنگز، درمیان کی اسٹیٹس، اصلی فون سائز پر آرٹ بورڈز کے بورڈ کی صورت میں۔ یہ ایپ شکل کے ڈیزائن کا ٹیمپلیٹ ہے — ٹچ ٹارگٹس، موبائل نیو، اسکرین سے اسکرین کا فلو۔
سیٹ، ایک اسکرین نہیں
اسے فلو کے لیے بریف کریں — "عادت ٹریکر ایپ: sign-up، آج کا ویو، streak، سیٹنگز" — اور ایجنٹ اسکرین سیٹ بناتا ہے، ہر ایک نتیجے میں ایک آرٹ بورڈ۔ mobile viewer انہیں ایک ایسے بورڈ پر بچھاتی ہے جس میں آپ چل سکتے ہیں یا گرڈ میں دیکھ سکتے ہیں، تاکہ فلو بطور فلو پڑھا جائے، اسکرین شاٹس کے ڈھیر کی طرح نہیں۔
اسکرینیں لائیو ہیں، تصاویر نہیں: انہیں ٹیپ کریں، کنٹرولز پر ہوور کریں، دیکھیں کہ نیو واقعی کہیں جاتی ہے — فون چوڑائی پر، جہاں ٹچ ٹارگٹس اور bottom nav ہی ٹوٹتے ہیں۔
Mobile app · Devin · e2e · gate PASS
Frond — A plant-care app in three finished screens — today, detail, reminder — device frames and all.
▸ the prompt that made it▾ the prompt that made it
“Design a mobile app: a plant-care app: today screen, plant detail, and watering reminder.”
موبائل اصول، چیک شدہ
گیٹ کے فون چوڑائی چیکس یہاں سب سے زیادہ اہم ہیں — ہٹ ٹارگٹ سائز، مردہ نیو، وہ bottom-bar جو آخری قطار نگل لیتا ہے۔ ٹیمپلیٹ وہ اصول لوڈ کرتا ہے تاکہ ایجنٹ ان کے لیے بنائے: انگلیوں کے سائز کے کنٹرولز، کہیں پہنچنے والی نیو، چھوٹی اسکرین پر بچنے والی ٹائپ۔
یہ کن چیزوں میں اچھا ہے
- ایپ کانسیپٹ کام — کسی آئیڈیا کا اسکرین سیٹ اس کے بننے سے پہلے
- فیچر فلوز — نیا فیچر موجودہ اسکرینوں میں کیسے گندھتا ہے
- موبائل مخصوص پیٹرنز — شیٹس، bottom nav، swipe اسٹیٹس
- اسٹیک ہولڈر ریویوز — فلو بطور بورڈ، بطور سپیک نہیں
اسکرین سیٹ کو سٹیئر کرنا
کسی بھی نتیجے کی سی سٹیئرنگ، موبائل شکل میں:
- کنٹرول یا اسکرین کے علاقے پر ⌥-click کریں، بالکل اس جگہ پر کمنٹ کریں
- غائب اسکرین یا غلط فلو کے لیے follow-ups ("sign-up اور آج کے بیچ empty state ڈالیں")
- ڈیزائن کے دکھائے ہوئے پیرامیٹرز کے لیے Tweaks (density، corner radius)
- ایک ہی فلو کے دو مختلف ٹیک کے لیے variants
فون بمقابلہ موک اپ بمقابلہ ویب سائٹ
- Mobile app — فون شکل کی اسکرینیں، ٹچ اسکیل کنٹرولز، موبائل نیو
- UI mockups — ڈیسک ٹاپ یا ویب انٹرفیس کی تصویر
- Interactive website — کام کرنے والی سائٹ، ملٹی پیج، ڈیسک ٹاپ اول
اگر اسکرین سیٹ فون سائز اور ٹچ شکل کی ہے تو یہی ٹیمپلیٹ ہے — خواہ "ایپ" کوئی موبائل ویب فلو ہی کیوں نہ ہو۔
مشورہ: اسے مکمل کہنے سے پہلے ہر اسکرین کو فون چوڑائی پر چیک کریں — یہاں سب سے عام FAIL کوئی bottom bar یا آخری قطار کا کنٹرول ہے جو مردہ زون میں گِر جاتا ہے، جو ڈیسک ٹاپ سائز پر نظر نہیں آتا۔
ایکسپورٹ کرنا
اسکرین سیٹس فی اسکرین PNG یا بطور سیٹ PDF میں ایکسپورٹ ہوتے ہیں — کسی ڈیک، سپیک یا اسٹیک ہولڈر ڈاک کے لیے۔ فائلیں اگلی سٹیئر کے لیے پروجیکٹ فولڈر میں رہتی ہیں۔