Sushi Design System - UI Kit
१० हजार+
डाउनलोड गरिएका सामग्रीहरू
सबैजना
info
यो एपका बारेमा
सुशी Zomato को आफ्नै डिजाइन प्रणाली हो, जसले सफा र सरल डिजाइन भाषा पछ्याएर बलियो प्रयोगकर्ता इन्टरफेसहरू निर्माण गर्न मद्दत गर्छ। हामीले zomato मा, यसलाई ग्राउन्ड अपबाट निर्माण गरेका छौं। यो हाम्रो लागि डिजाइन प्रणाली मात्र होइन, तर यसले हामीलाई हाम्रा प्रयोगकर्ताहरूलाई नयाँ र परिष्कृत अनुभव प्रदान गर्न मद्दत गर्दछ। सुशीले तपाईंलाई परमाणु, सफा र सरल डिजाइन भाषा पछ्याएर बेस्पोक प्रयोगकर्ता इन्टरफेसहरू निर्माण गर्न मद्दत गर्न सक्छ। जबकि सुशीले आफ्नै डिजाइन भाषामा निर्माण गर्छ, यसले पूर्ण रूपमा अँगालेको छ र धेरै क्षेत्रहरूमा आन्तरिक रूपमा Google को सामग्री डिजाइन कम्पोनेन्टहरू प्रयोग गर्दछ।
एक डिजाइन प्रणाली र ब्रान्ड दिशानिर्देशहरूको लागि सन्दर्भको रूपमा, यो Zomato भित्र विभिन्न टोलीहरू द्वारा प्रयोग र प्रतिनिधित्व गरिन्छ, जस्तै - उत्पादन, इन्जिनियरिङ, मार्केटिङ र ब्रान्डिङ।
डिजाइन प्रणाली के हो?
एक डिजाइन प्रणाली पुन: प्रयोज्य कम्पोनेन्टहरूको संग्रह हो, स्पष्ट मापदण्डहरूद्वारा निर्देशित, जुन कुनै पनि संख्यामा अनुप्रयोगहरू निर्माण गर्न सँगै भेला गर्न सकिन्छ। डिजाईन प्रणाली भनेको तपाईंले डिजिटल उत्पादन निर्माण गर्न प्रयोग गर्नुहुने सम्पत्ति र कम्पोनेन्टहरूको सङ्कलन मात्र होइन। इमेट कोनोलीका अनुसार, इन्टरकममा उत्पादन डिजाइनका निर्देशक, "... धेरैजसो डिजाइन प्रणालीहरू साँच्चै मात्र प्याटर्न पुस्तकालयहरू हुन्: UI लेगो टुक्राहरूको ठूलो बक्स जुन नजिक-असीमित तरिकाहरूमा भेला गर्न सकिन्छ। सबै टुक्राहरू एकरूप हुन सक्छन्, तर यसको मतलब यो होइन कि एकत्रित परिणामहरू हुनेछन्। तपाईंको उत्पादन पुन: प्रयोज्य UI तत्वहरूको ढेर मात्र होइन। यसको संरचना र अर्थ छ। यो सामान्य वेब पृष्ठ होइन, यो अवधारणाको प्रणालीको अवतार हो।"
सुशी डिजाइन प्रणाली
आधारहरू
फाउन्डेशनहरू डिजिटल ब्रान्ड दिशानिर्देशहरू हुन्, जसले टाइपोग्राफी, रङ प्यालेटहरू, आइकनहरू, स्पेसिङ, छाया र हाम्रो डिजाइन प्रणालीको सूचना वास्तुकला परिभाषित गर्दछ। सुशी, परमाणु डिजाइन सिद्धान्तहरू पछ्याउँदै, कम्पोजेबल कम्पोनेन्टहरू प्रयोग गरेर तल-माथि बनाइएको छ, परमाणुहरू ➡️ अणुहरू ➡️ जीवहरूको रूपमा क्रमबद्ध गरिएको छ।
परमाणु डिजाइन
परमाणु डिजाइन (ब्राड फ्रस्टले वर्णन गरे अनुसार) हाम्रो प्रणालीमा म्याप गरियो।
#परमाणु
सबैभन्दा सानो अविभाज्य एकाइहरू परमाणुहरू हुन्। एन्ड्रोइडमा (वा कुनै पनि मोबाइल UI) पाठ लेबलहरू, बटनहरू, र छवि धारकहरू परमाणुहरू हुन्।
#अणुहरू
दृश्यहरू जसमा धेरै परमाणुहरू बन्नका लागि समावेश हुन्छन्, तर अझै पनि प्रयोगकर्तालाई एउटै निकायको रूपमा हेर्ने र व्यवहार गर्ने अणुहरू हुन्। उदाहरणका लागि, आगत क्षेत्रहरूमा इनपुट बाकस, त्रुटि क्षेत्र, र स्पष्ट बटन हुन्छ, तर सँगै यो एकल इकाई हो।
#जीवहरू
जटिल, तर पुन: प्रयोज्य कम्पोनेन्टहरू, जसले सँगै मिलेर काम गर्छ। धेरै परमाणु र अणुहरू मिलेर बनेको। बिन्दुमा एक केस रेटिङ बारहरू, जसमा ट्यागहरू हुन्छन्, प्रत्येकमा नम्बर र एउटा आइकन हुन्छ। विभिन्न मूल्याङ्कनहरू चयन गर्दा ट्यागहरूले रंग पनि परिवर्तन गर्दछ। प्रत्येक ट्याग व्यक्तिगत रूपमा अन्य ठाउँहरूमा पनि प्रयोग गरिन्छ, तर मूल्याङ्कन पट्टीको रूपमा, यो सबै नयाँ अर्थ सिर्जना गर्न सँगै काम गर्दछ।
टाइपोग्राफी
टाइपोग्राफी, तपाईलाई थाहा हुन सक्छ, लिखित भाषालाई सुपाठ्य, पढ्न योग्य र प्रदर्शित हुँदा आकर्षक बनाउनको लागि प्रकार व्यवस्थित गर्ने कला हो। प्रकारको व्यवस्थामा टाइपफेसहरू, बिन्दु आकारहरू, रेखा लम्बाइहरू, रेखा-स्पेसिङ, र अक्षर-स्पेसिङ, र अक्षरहरूको जोडीहरू बीच ठाउँ समायोजन गर्ने समावेश छ।
हामी निम्न टाइपफेस भिन्नताहरूलाई समर्थन गर्छौं -
एक्स्ट्रालाइट
उज्यालो
नियमित
मध्यम
सेमीबोल्ड
बोल्ड
एक्स्ट्रा बोल्ड
तपाईले कुनै पनि फन्ट प्रयोग गर्न सक्नुहुन्छ जसमा 8 फन्ट वजनहरू छन् र तिनीहरूलाई यी उपनामहरूबाट असाइन गर्नुहोस्। हामीसँग डेमोको लागि मेट्रोपोलिस, ओक्रा र रोबोटो हुँदा, तपाईंले आफ्नो ब्रान्डसँग जाने कुनै पनि फन्ट प्रयोग गर्न सक्नुहुन्छ।
रङहरू
सुशीले आफ्नो प्यालेटमा पूर्वनिर्धारित रङहरूको सेट पनि प्रदान गर्दछ। अत्यन्तै अनौठो केसहरूको लागि, तपाईंको आफ्नै रङहरू प्रयोग गर्न नहिचकिचाउनुहोस्, तर अन्यथा, हामी तपाईंको उत्पादनको सबै घटकहरूको लागि यो प्यालेटबाट रङहरू प्रयोग गर्न सिफारिस गर्छौं।
कोड भण्डार
एक डिजाइन प्रणाली र ब्रान्ड दिशानिर्देशहरूको लागि सन्दर्भको रूपमा, यो Zomato भित्र विभिन्न टोलीहरू द्वारा प्रयोग र प्रतिनिधित्व गरिन्छ, जस्तै - उत्पादन, इन्जिनियरिङ, मार्केटिङ र ब्रान्डिङ।
डिजाइन प्रणाली के हो?
एक डिजाइन प्रणाली पुन: प्रयोज्य कम्पोनेन्टहरूको संग्रह हो, स्पष्ट मापदण्डहरूद्वारा निर्देशित, जुन कुनै पनि संख्यामा अनुप्रयोगहरू निर्माण गर्न सँगै भेला गर्न सकिन्छ। डिजाईन प्रणाली भनेको तपाईंले डिजिटल उत्पादन निर्माण गर्न प्रयोग गर्नुहुने सम्पत्ति र कम्पोनेन्टहरूको सङ्कलन मात्र होइन। इमेट कोनोलीका अनुसार, इन्टरकममा उत्पादन डिजाइनका निर्देशक, "... धेरैजसो डिजाइन प्रणालीहरू साँच्चै मात्र प्याटर्न पुस्तकालयहरू हुन्: UI लेगो टुक्राहरूको ठूलो बक्स जुन नजिक-असीमित तरिकाहरूमा भेला गर्न सकिन्छ। सबै टुक्राहरू एकरूप हुन सक्छन्, तर यसको मतलब यो होइन कि एकत्रित परिणामहरू हुनेछन्। तपाईंको उत्पादन पुन: प्रयोज्य UI तत्वहरूको ढेर मात्र होइन। यसको संरचना र अर्थ छ। यो सामान्य वेब पृष्ठ होइन, यो अवधारणाको प्रणालीको अवतार हो।"
सुशी डिजाइन प्रणाली
आधारहरू
फाउन्डेशनहरू डिजिटल ब्रान्ड दिशानिर्देशहरू हुन्, जसले टाइपोग्राफी, रङ प्यालेटहरू, आइकनहरू, स्पेसिङ, छाया र हाम्रो डिजाइन प्रणालीको सूचना वास्तुकला परिभाषित गर्दछ। सुशी, परमाणु डिजाइन सिद्धान्तहरू पछ्याउँदै, कम्पोजेबल कम्पोनेन्टहरू प्रयोग गरेर तल-माथि बनाइएको छ, परमाणुहरू ➡️ अणुहरू ➡️ जीवहरूको रूपमा क्रमबद्ध गरिएको छ।
परमाणु डिजाइन
परमाणु डिजाइन (ब्राड फ्रस्टले वर्णन गरे अनुसार) हाम्रो प्रणालीमा म्याप गरियो।
#परमाणु
सबैभन्दा सानो अविभाज्य एकाइहरू परमाणुहरू हुन्। एन्ड्रोइडमा (वा कुनै पनि मोबाइल UI) पाठ लेबलहरू, बटनहरू, र छवि धारकहरू परमाणुहरू हुन्।
#अणुहरू
दृश्यहरू जसमा धेरै परमाणुहरू बन्नका लागि समावेश हुन्छन्, तर अझै पनि प्रयोगकर्तालाई एउटै निकायको रूपमा हेर्ने र व्यवहार गर्ने अणुहरू हुन्। उदाहरणका लागि, आगत क्षेत्रहरूमा इनपुट बाकस, त्रुटि क्षेत्र, र स्पष्ट बटन हुन्छ, तर सँगै यो एकल इकाई हो।
#जीवहरू
जटिल, तर पुन: प्रयोज्य कम्पोनेन्टहरू, जसले सँगै मिलेर काम गर्छ। धेरै परमाणु र अणुहरू मिलेर बनेको। बिन्दुमा एक केस रेटिङ बारहरू, जसमा ट्यागहरू हुन्छन्, प्रत्येकमा नम्बर र एउटा आइकन हुन्छ। विभिन्न मूल्याङ्कनहरू चयन गर्दा ट्यागहरूले रंग पनि परिवर्तन गर्दछ। प्रत्येक ट्याग व्यक्तिगत रूपमा अन्य ठाउँहरूमा पनि प्रयोग गरिन्छ, तर मूल्याङ्कन पट्टीको रूपमा, यो सबै नयाँ अर्थ सिर्जना गर्न सँगै काम गर्दछ।
टाइपोग्राफी
टाइपोग्राफी, तपाईलाई थाहा हुन सक्छ, लिखित भाषालाई सुपाठ्य, पढ्न योग्य र प्रदर्शित हुँदा आकर्षक बनाउनको लागि प्रकार व्यवस्थित गर्ने कला हो। प्रकारको व्यवस्थामा टाइपफेसहरू, बिन्दु आकारहरू, रेखा लम्बाइहरू, रेखा-स्पेसिङ, र अक्षर-स्पेसिङ, र अक्षरहरूको जोडीहरू बीच ठाउँ समायोजन गर्ने समावेश छ।
हामी निम्न टाइपफेस भिन्नताहरूलाई समर्थन गर्छौं -
एक्स्ट्रालाइट
उज्यालो
नियमित
मध्यम
सेमीबोल्ड
बोल्ड
एक्स्ट्रा बोल्ड
तपाईले कुनै पनि फन्ट प्रयोग गर्न सक्नुहुन्छ जसमा 8 फन्ट वजनहरू छन् र तिनीहरूलाई यी उपनामहरूबाट असाइन गर्नुहोस्। हामीसँग डेमोको लागि मेट्रोपोलिस, ओक्रा र रोबोटो हुँदा, तपाईंले आफ्नो ब्रान्डसँग जाने कुनै पनि फन्ट प्रयोग गर्न सक्नुहुन्छ।
रङहरू
सुशीले आफ्नो प्यालेटमा पूर्वनिर्धारित रङहरूको सेट पनि प्रदान गर्दछ। अत्यन्तै अनौठो केसहरूको लागि, तपाईंको आफ्नै रङहरू प्रयोग गर्न नहिचकिचाउनुहोस्, तर अन्यथा, हामी तपाईंको उत्पादनको सबै घटकहरूको लागि यो प्यालेटबाट रङहरू प्रयोग गर्न सिफारिस गर्छौं।
कोड भण्डार
मा अपडेट गरिएको
डेटाको सुरक्षा
विकासकर्ताहरू यहाँ उनीहरूको एपले तपाईंका डेटा सङ्कलन र प्रयोग गर्ने तरिकाका बारेमा जानकारी देखाउन सक्छन्। डेटाको सुरक्षाका बारेमा थप जान्नुहोस्
कुनै पनि जानकारी उपलब्ध छैन
