मोबाइल HUD सूचना पदानुक्रम: युद्ध, लॉबी और मोडल में क्या दिखाएं

HUD विफलताएं शायद ही कभी “हम हेल्थ बार भूल गए” होती हैं—वे एक स्क्रीन पर एक ही प्राथमिकता वाले बहुत अधिक एलिमेंट होती हैं: युद्ध के दौरान लॉबी टैब, सिनेमैटिक के ऊपर टैप करने योग्य शॉप, या मोडल खुला होने पर अंतर्निहित HUD अभी भी टैप खा रहा हो। डिज़ाइन मॉक अक्सर सिंगल-फ्रेम होते हैं और कभी “युद्ध में करेंसी छिपाएं” चिह्नित नहीं करते—आपको स्टेट × लेयर स्पेक चाहिए ताकि इंजीनियरिंग दृश्यता, इनपुट ब्लॉकिंग और ड्रॉ ऑर्डर लागू कर सके।

नीचे मुख्य शब्दावली के रूप में Unity UGUI (Prefab, Canvas.sortingOrder, Graphic raycasts) का उपयोग किया गया है। Godot: CanvasLayer layer + Control mouse_filter; Cocos: node draw order + BlockInputEvents / फुल-स्क्रीन ब्लॉकर्स—समान मानदंड और टेबल। Safe Area, फ्लोटिंग टेक्स्ट और Canvas ऑर्डरिंग विवरण: Safe Area, फ्लोटिंग डैमेज नंबर। डिवाइस, सभी लोकेल और Release बिल्ड: प्री-शिप चेकलिस्ट आइटम 1, 2 और 5।

विफलता मानदंड (कोई एक भी = पास नहीं): मोडल / सिनेमैटिक / भुगतान फ्लो के दौरान, अंतर्निहित HUD अभी भी इंटरैक्टिव (जब तक स्पेक “हाफ-स्क्रीन अभी भी संचालन योग्य” न कहे); युद्ध में, गैर-युद्ध प्रोमो जिसे खारिज नहीं किया जा सकता प्ले एरिया को ब्लॉक करता है; एक ही जानकारी दो बार दिखाई गई (जैसे टॉप-बार कॉइन्स के साथ बड़ा इन-कॉम्बैट कॉइन UI) बिना किसी प्रोडक्ट नोट के; पिछले स्टेट के कंट्रोल बने रहते हैं (दिखाई देते हैं या अभी भी raycast-ब्लॉक करते हैं); बहुभाषी स्ट्रेस लोकेल के साथ, युद्ध-न्यूनतम लेआउट अभी भी लंबी कॉपी (DE/ES, आदि) को क्लिप करता है।

---

पहले स्टेट परिभाषित करें, फिर कंट्रोल

गेम स्टेट (उदाहरण)	HUD लक्ष्य	आमतौर पर दिखाएं	आमतौर पर छिपाएं / घटाएं
लॉबी / होम	नेविगेशन + संसाधन + इवेंट	टॉप करेंसी, बॉटम टैब, इवेंट एंट्री	युद्ध कौशल, क्रॉसहेयर
युद्ध / लेवल में	क्रियाएं + उत्तरजीविता जानकारी	हेल्थ, स्किल्स, पॉज़	लॉबी टैब, फुल-स्क्रीन इवेंट बैनर
सिनेमैटिक / CG	कोई इनपुट नहीं या केवल स्किप	स्किप बटन	लगभग सभी HUD (या केवल स्किप)
मोडल (शॉप, सेटिंग्स)	डायलॉग पर फोकस	मोडल-में कंट्रोल	अंतर्निहित HUD raycasts बंद या पूरी लेयर छिपी
भुगतान / अनुपालन	फ्लो पूरा करें	शर्तें, पुष्टि	इन-गेम प्रोमो ओवरले

स्टेट एनम पर डिज़ाइन + इंजीनियरिंग के साथ सहमति बनाएं (जैसे GameUIState.Lobby | Combat | Cinematic | Modal)। UI रूट स्टेट मशीन की सदस्यता लें (Unity Prefab ग्रुप / Godot सीन ब्रांच / Cocos प्रीफैब)—हर बटन स्क्रिप्ट पर बिखरे SetActive / visible से बचें।

---

लेयर और सॉर्ट ऑर्डर (इंजन-न्यूट्रल स्पेक)

नीचे से ऊपर दस्तावेज़ित करें (उच्च संख्या = सामने):

लेयर	सामग्री	इनपुट
L0	फुल-स्क्रीन बैकग्राउंड / सीन UI ब्लीड	कोई नहीं
L1	युद्ध HUD (हेल्थ, जॉयस्टिक प्लेसहोल्डर)	हां
L2	युद्ध फ्लोटिंग टेक्स्ट / टिप्स	कोई raycasts नहीं (फ्लोटिंग डैमेज नंबर)
L3	सिस्टम टोस्ट / मार्की	आमतौर पर कोई नहीं
L4	मोडल / फुल-स्क्रीन डायलॉग	हां; L1–L3 टैप ब्लॉक करता है
L5	नेटवर्क ड्रॉप, फोर्स्ड अपडेट	हां; सभी ब्लॉक करता है

Unity: sortingOrder / कई Canvases; Godot: CanvasLayer layer; Cocos: एक Canvas के अंतर्गत sibling order या लेयर्ड Canvas + मास्क। जब मोडल खुले, तो L4 ऊपर उठाएं और L1 raycasts / mouse_filter / BlockInput बंद करें—केवल “ऊपर चित्रित लेकिन टैप पास हो जाते हैं” नहीं।

---

सूचना प्राथमिकता (युद्ध उदाहरण)

यदि युद्ध छोटी स्क्रीन पर केवल N पठनीय ब्लॉक रख सकता है, तो डिफ़ॉल्ट कैप:

प्राथमिकता	ब्लॉक	घटाने की रणनीति
P0	हेल्थ / विफलता-शर्त संबंधित	न छिपाएं
P0	पॉज़ / युद्ध से बाहर निकलें	न छिपाएं
P1	स्किल्स / प्राथमिक क्रियाएं	कम बटन में मर्ज करें
P2	संक्षिप्त उद्देश्य टेक्स्ट	आइकन + लॉन्ग-प्रेस विवरण
P3	करेंसी, इवेंट एंट्री	युद्ध में डिफ़ॉल्ट रूप से छिपा या पॉज़ मेनू में
P3	चैट एंट्री	आइकन में संकुचित करें

घटाव बहुभाषी स्ट्रेस लोकेल (DE/ES, आदि) में पठनीय रहना चाहिए—केवल अंग्रेज़ी-श्रिंक परीक्षण नहीं।

---

स्वीकृति (5 चरण)

1. स्टेट सूचीबद्ध करें — मुख्य फ्लो से, ट्रांज़िशन गिनें (लेवल में प्रवेश, शॉप खोलना, CG, रीकनेक्ट)।
2. प्रति स्टेट स्क्रीनशॉट — Editor Play और डिवाइस Release प्रत्येक (प्री-शिप आइटम 1 और 5); SetActive(false) / visible=false वाले नोड्स सत्यापित करें जो अभी भी इनपुट ब्लॉक करते हैं।
3. मोडल स्पॉट-चेक — शॉप / सेटिंग्स / भुगतान खुला होने पर, पूर्व HUD बटन पर टैप कुछ नहीं करना चाहिए (फुल-स्क्रीन ट्रांसपेरेंट raycast या BlockInput मास्क)।

4. Safe Area के साथ क्रॉस करें — युद्ध P0 कंट्रोल safe inset के अंदर (Safe Area)।
5. वर्ज़न्ड एसेट कमिट करें — स्टेट टेबल दृश्यता चलाती है (Unity ScriptableObject / Godot Resource / Cocos config)—केवल Scene-मात्र अस्थायी छिपाव नहीं।

---

डिज़ाइन को क्या जोड़ना चाहिए

डिलिवरेबल	उद्देश्य
प्रति-स्टेट वायरफ्रेम (कम से कम लॉबी / युद्ध / मोडल)	इंजीनियरिंग दृश्यता कॉन्फ़िगर करती है
मॉक पर युद्ध “छिपा सकते हैं” सूची	एक फ्रेम पर हर एलिमेंट चित्रित करने से बचें
मोडल स्पेक: डिम बैकग्राउंड, टैप-थ्रू अनुमत?	raycast नीति तय करता है
प्रोमो / इवेंट लेयर z-order	L4/L5 के साथ संरेखित करें

डिज़ाइनर्स को स्टेट मशीन लिखने की ज़रूरत नहीं—टेबल + एनोटेशन अनुमान कम करते हैं।

---

फिक्स रूटिंग

लक्षण	संभावित कारण	कार्रवाई	स्वामी
डायलॉग के बाद अभी भी युद्ध टैप कर सकते हैं	अंतर्निहित raycasts चालू	मोडल लेयर / फुल-स्क्रीन मास्क पर Graphic raycast बंद करें	इंजीनियरिंग
युद्ध में फुल-स्क्रीन इवेंट	स्टेट टेबल नहीं	युद्ध में P3 छिपाएं; डिज़ाइन साइन-ऑफ	इंजीनियरिंग + डिज़ाइन
सिनेमैटिक के बाद HUD बचा	Cinematic स्टेट हुक नहीं	स्टेट मशीन HUD को समान रूप से छिपाती है	इंजीनियरिंग
दो करेंसी डिस्प्ले	लॉबी बार युद्ध में बंद नहीं	युद्ध में टॉप बार छिपाएं या डेटा स्रोत मर्ज करें	इंजीनियरिंग + डिज़ाइन
युद्ध न्यूनतम लेआउट में लंबा लोकेल क्लिप	DE/ES परीक्षण नहीं	लोकेल ओवरफ़्लो पथ	डिज़ाइन + इंजीनियरिंग

---

FAQ

लॉबी और युद्ध के लिए दो Canvases?
ठीक है—या ग्रुप के साथ एक Canvas। मायने स्टेट दृश्यता + raycasts रखते हैं, Canvas संख्या नहीं।

हाफ-स्क्रीन शॉप—क्या वह मोडल है?
हां। निर्दिष्ट करें कि अंतर्निहित टैप करने योग्य है या नहीं और युद्ध लॉजिक रुकता है या नहीं।

“कम ही अधिक है” UX से टकराव?
पदानुक्रम टेबल एक प्रोडक्ट नियम है, सौंदर्यशास्त्र नहीं; P3 स्टेट मशीन फ्लैग के माध्यम से इवेंट के लिए फिर खुल सकता है।

3D में वर्ल्ड-स्पेस ओवरहेड बार?
वे युद्ध जानकारी हैं, L1 के साथ प्रबंधित; वर्ल्ड-स्पेस सॉर्ट नियम फ्लोटिंग डैमेज नंबर और Safe Area के साथ संरेखित होते हैं।