paint-brush
अपने डिजाइन विकसित करना शुरू करें (शाब्दिक रूप से)द्वारा@ivansipilov
नया इतिहास

अपने डिजाइन विकसित करना शुरू करें (शाब्दिक रूप से)

द्वारा IvanSipilov7m2024/10/28
Read on Terminal Reader

बहुत लंबा; पढ़ने के लिए

डिजाइनरों से अपेक्षा की जाती है कि वे रचनात्मकता और प्रौद्योगिकी के बीच की खाई को पाटें। कोई भी व्यक्ति, यहाँ तक कि डेवलपर भी, जो इंटरफेस पर काम कर रहा है, उसे डिजाइन की अच्छी समझ होनी चाहिए। कोडिंग को समझने वाले डिजाइनरों को एक अनूठा लाभ होता है। वे टीमों के बीच काम करने में बेहतर होते हैं। वे विचारों को व्यावहारिक, आकर्षक समाधानों में बदल सकते हैं।
featured image - अपने डिजाइन विकसित करना शुरू करें (शाब्दिक रूप से)
IvanSipilov HackerNoon profile picture
0-item


डिजाइनरों के लिए कोडिंग सीखने का सही समय क्यों है?

मुझे पूरा यकीन है कि आज के डिजाइनरों को सिर्फ़ अच्छे दिखने वाले यूजर इंटरफेस बनाने से कहीं ज़्यादा कुछ करने की ज़रूरत है। भूमिका विकसित हो गई है, और अब हमसे रचनात्मकता और तकनीक के बीच की खाई को पाटने की उम्मीद की जाती है।


ऐसा करने के लिए हम अपने टूलकिट में जो सबसे अच्छा कौशल जोड़ सकते हैं, वह है कोडिंग


अब देखिए, इस बात पर गरमागरम बहस चल रही है कि क्या डिज़ाइनर कोडिंग सीखनी चाहिए या नहीं मुझे लगता है कि डिज़ाइनर और डेवलपर्स के बीच पुराना विभाजन अब काम नहीं करता। यह आज की उत्पाद विकास आवश्यकताओं को पूरा नहीं करता। कोई भी व्यक्ति, यहाँ तक कि डेवलपर भी, जो इंटरफेस पर काम कर रहा है, उसे डिज़ाइन की अच्छी समझ होनी चाहिए।


साथ ही, डिजाइन संबंधी निर्णय उन लोगों द्वारा निर्धारित कठोर नियमों या मैनुअल में बंद नहीं किए जाने चाहिए, जिनमें निम्नलिखित की समझ का अभाव है:

  • इंटरैक्शन,
  • तकनीक, या
  • कोडिंग.


इस प्रक्रिया के दौरान, डिज़ाइन (दाईं ओर) और इसका वास्तविक कार्यान्वयन (बाईं ओर) अक्सर इस प्रकार दिखता है:



और आप (डिजाइनर) ही एकमात्र ऐसे लोग हैं जो इसे ठीक कर सकते हैं। मैं आपको कोड दे रहा हूँ - एक जादुई गोली के रूप में जिससे आप अपने सपनों के अनुसार UI तैयार कर सकते हैं।


आखिरकार, यह सही ही कहा गया है कि डिजाइन कोई व्यक्ति नहीं है। यह एक कार्य है।

कोडिंग हमें डिजाइन बाज़ार में होने वाले बदलावों के प्रति अधिक अनुकूल बनाती है

डिजाइन तेजी से बदल रहा है, और साथ ही हमें इसके साथ तालमेल बिठाने के लिए आवश्यक कौशल भी। अब, मैं यह नहीं कह रहा हूँ कि हम जल्द ही “उत्पाद डिजाइनर-डेवलपर” नामक एक आधिकारिक भूमिका देखेंगे, लेकिन नियोक्ता निश्चित रूप से ऐसे लोगों की तलाश कर रहे हैं जो पारंपरिक डिजाइन के बुलबुले से बाहर निकल सकें। वे ऐसे डिज़ाइनर चाहते हैं जो:


  • समझना मानव व्यवहार ,

  • टीमों के बीच सहयोग कर सकते हैं,

  • और सिर्फ दृश्य निर्माण से आगे भी योगदान दें।


कोडिंग को समझने वाले डिज़ाइनरों को एक अनूठा लाभ होता है। वे टीमों के साथ मिलकर काम करने में बेहतर होते हैं। वे विचारों को व्यावहारिक, आकर्षक समाधानों में बदल सकते हैं जो वास्तविक उपयोगकर्ता की ज़रूरतों को पूरा करते हैं।


पारंपरिक UI डिज़ाइन पर्याप्त नहीं है। यह समझना कि चीज़ें कैसे बनाई जाती हैं - फ़्रेमवर्क, कोडबेस और सिस्टम जो हमारे डिज़ाइन को शक्ति देते हैं - हमें ऐसे अनुभव बनाने में मदद करते हैं जो न केवल सुंदर हैं बल्कि उन्हें चलाने वाली तकनीक के साथ सहजता से काम भी करते हैं। हम अब सिर्फ़ “आंखों को लुभाने वाली” स्क्रीन नहीं बना रहे हैं।


उदाहरण के लिए, हाल ही में एक परियोजना के दौरान स्पंदन एकल कोडबेस से ऐप्स बनाने के लिए एक ओपन-सोर्स फ्रेमवर्क, को पढ़ते समय मुझे एहसास हुआ कि सूचित डिज़ाइन विकल्प बनाने के लिए कोडिंग ज्ञान कितना महत्वपूर्ण था।


तकनीक को जाने बिना, एनिमेशन, ट्रांजिशन या गति तत्वों को डिजाइन करना बहुत कठिन होगा जो विकास टीम की सीमाओं के भीतर काम करेंगे।


जर्मन बागवानों के लिए मेरे वेजी ग्रोअर आईओएस ऐप के लिए एनिमेशन इसलिए संभव हो पाया क्योंकि मैंने कोडिंग सीखी थी।



कोडिंग के लाभ कौशल से भी आगे बढ़ते हैं। यह मस्तिष्क के संचालन के तरीके को भी बदल सकता है। प्रत्येक कोडिंग चुनौती मेरे मस्तिष्क में नए कनेक्शनों को जन्म देती है। यह अनुकूलन और विकास करता है, जिससे मुझे अन्य क्षेत्रों में मदद मिलती है।


विज्ञान से पता चलता है कि जब हम कोई कठिन या अपरिचित चीज़ सीखते हैं, जैसे कोडिंग या कोई वाद्य बजाना, तो नए तंत्रिका मार्ग बनते हैं। नए कौशल हमारी क्षमताओं को बढ़ाने से कहीं ज़्यादा काम करते हैं। वे हमारे दिमाग को भी नया रूप देते हैं। हम चुनौतियों का सामना करने में ज़्यादा अनुकूलनशील और लचीले बनते हैं।


कोडिंग से डेवलपर के दृष्टिकोण को समझने में मदद मिलती है

जो डिज़ाइनर कोडिंग जानते हैं, वे डेवलपर्स के साथ सहयोग को आसान बनाते हैं। इससे प्रक्रियाएँ आसान होती हैं और उत्पाद बेहतर होते हैं। कोडिंग हमें अधिक व्यावहारिक, यथार्थवादी डिज़ाइन बनाने में मदद करती है। यह डेवलपर्स के लिए जीवन को आसान बनाता है और टीमों के बीच टकराव को कम करता है। जब हम कोड को समझते हैं, तो हम अपने विचारों को बेहतर ढंग से संप्रेषित करने और रचनात्मक दृष्टिकोण को व्यावहारिक समाधानों में बदलने में सक्षम होते हैं।


मैं अपने "बच्चे" वेजी ग्रोवर ऐप के साथ और अधिक समझाऊंगा। मेरी सबसे बड़ी गलती यूआई को अत्यधिक जटिल बनाना था क्योंकि क्लाइंट "वाह कारक" पर जोर देता था। हम प्रभावित करना चाहते थे, लेकिन लक्ष्य से चूक गए - ऐप स्टोर में ऐप का वास्तविक यूआई अच्छा नहीं निकला (ऊपर इस कहानी का कवर देखें)।


इससे मुझे यह सीख मिली कि डिज़ाइनरों को वास्तव में डेवलपर्स के लिए रक्षा की पहली पंक्ति के रूप में कार्य करने की आवश्यकता है। जब व्यावसायिक विचार अवास्तविक क्षेत्र में जाने लगते हैं, तो हमें पीछे हटना पड़ता है, उत्पाद और UX को बहुत जटिल होने से बचाना पड़ता है। हम ऐप लॉन्च करने के लिए कुछ स्मार्ट वर्कअराउंड खोजने में कामयाब रहे। मैंने लोटी एनिमेशन और कुछ खुद बनाए गए एनिमेशन का मिश्रण इस्तेमाल किया - मेरी कोडिंग स्किल्स निश्चित रूप से यहाँ काम आई। इसने हमें रिलीज़ को संभव बनाने के लिए चीजों को बेहतर बनाने में मदद की।


कोडिंग सीखने से मेरे डिज़ाइन को देखने का नज़रिया पूरी तरह बदल गया। मैंने चीज़ों को डेवलपर के नज़रिए से देखना शुरू किया, उनके सामने आने वाली चुनौतियों को समझना शुरू किया - जैसे कि जटिल सुविधाओं को बजट सीमाओं के साथ संतुलित करना और बड़े विचारों और वास्तव में संभव चीज़ों के बीच एक यथार्थवादी मध्य मार्ग खोजना।


डेवलपर्स की पीड़ा को समझना बनाम यह जानना कि कब अपनी बात पर अड़े रहना है

कोडिंग ने मुझे प्रक्रिया के विकास पक्ष के प्रति सहानुभूति सिखाई।


यह पहचानना महत्वपूर्ण है कि डेवलपर्स को अक्सर चीजों को कार्यात्मक बनाने के लिए बहुत अधिक दबाव का सामना करना पड़ता है। डिबगिंग में कई दिन बिताने के बाद, आखिरी चीज जो वे चाहते हैं वह है जटिल डिज़ाइन तत्वों से निपटना जो अनावश्यक जटिलताएँ जोड़ते हैं।


यहीं पर हमें, डिज़ाइनर के रूप में, समस्या-समाधानकर्ता के रूप में आगे आना चाहिए। हमें सरलता और स्पष्टता के लिए प्रयास करना चाहिए - रूप और कार्य के बीच संतुलन बनाना जो उपयोगकर्ता और डेवलपर दोनों के लिए उपयोगी हो।


इसका मतलब यह नहीं है कि सभी डिज़ाइनों को इतना सरल बना दिया जाए कि वे नीरस हो जाएँ। इसका मतलब है रणनीतिक होना, इंटरफ़ेस को प्रबंधनीय, निर्माण योग्य घटकों में तोड़ना जिन्हें डेवलपर्स के लिए समझना और लागू करना आसान हो।


अब, आइए "गेटकीपिंग" नामक चीज़ के बारे में भी बात करें। आजकल, UX में, इसे आमतौर पर एक नकारात्मक विशेषता के रूप में देखा जाता है। गेटकीपिंग: किसी चीज़ तक सामान्य पहुँच को नियंत्रित करने और आमतौर पर सीमित करने की गतिविधि।


लेकिन डिज़ाइन में, "गेटकीपर" होना नौकरी का एक बड़ा हिस्सा है। हम किसी चीज़ के लाइव होने से पहले बचाव की रेखा हैं। हमारी भूमिका यह सुनिश्चित करना है कि हम जो कुछ भी बनाने में मदद करते हैं वह वास्तव में उपयोगकर्ता की यात्रा को बेहतर बनाता है।


यह "गेटकीपिंग" मुश्किल होने के बारे में नहीं है। यह सुनिश्चित करने के बारे में है कि उपयोगकर्ता की ज़रूरतें सबसे आगे और केंद्र में हों। और यहीं पर थोड़ा सा कोड जानना बहुत बड़ा अंतर ला सकता है।


जब आप विकास पक्ष को समझ जाते हैं, तो आप यह बताने में बेहतर स्थिति में होते हैं कि कुछ डिज़ाइन विवरण क्यों महत्वपूर्ण हैं।


मान लीजिए कि आप किसी ऐसे फीचर पर काम कर रहे हैं, जहाँ आपको उपयोगकर्ता का ध्यान आकर्षित करने के लिए एक खास एनीमेशन की आवश्यकता है, लेकिन डेवलपर समय बचाने के लिए इसे छोड़ना चाहता है। अगर आपको पता है कि वह एनीमेशन, जैसे कि एक साधारण CSS ट्वीक या मौजूदा जावास्क्रिप्ट लाइब्रेरी का उपयोग करके कैसे किया जा सकता है, तो आप अपने मामले को प्रभावी ढंग से प्रस्तुत कर सकते हैं, और डेवलपर के आपकी बात सुनने की संभावना अधिक होती है।


यह महत्वपूर्ण है: कोडिंग करना जानना आपके दृष्टिकोण को रचनात्मक तरीके से प्रस्तुत करने में सहायक है, तथा इससे किसी भी पक्ष को निराशा नहीं होती।


कोडिंग हमें 'वाह फैक्टर' के पीछे का जादू देखने का मौका देती है


नीचे "एवोकैडो गाइ" अतिरिक्त आइटम के लिए लोडिंग दिखाता है। डेवलपर्स के लिए यह मुश्किल था, इसलिए मैंने इसे JSON में बदलने के लिए लोटी का इस्तेमाल किया - जिससे एकीकरण सहज हो गया और दिनों के बजाय केवल 15 मिनट लगे।


चीजों को कार्यात्मक बनाने पर ध्यान केंद्रित करते हुए, हम "वाह कारक" के बारे में नहीं भूल सकते।


एनीमेशन का प्रवाह या यूआई रंग कैसे पूरी तरह से संतुलित हैं, यह अनुभव को यादगार बना सकता है। यह भावनात्मक जुड़ाव उत्पादों को न केवल उपयोगी बनाने में महत्वपूर्ण है, बल्कि आनंददायक भी बनाता है।


उपयोगकर्ता छोटी-मोटी प्रयोज्य समस्याओं के प्रति अधिक सहनशील होते हैं जब उन्हें कोई इंटरफ़ेस देखने में आकर्षक लगता है। आखिरकार, सिर्फ़ कार्यात्मक डिज़ाइन की तुलना में सौंदर्यपूर्ण डिज़ाइन के सफल होने की संभावना ज़्यादा होती है।


हालाँकि, "वाह कारक" बस यूँ ही नहीं होता। इसके लिए हमें डेवलपर्स के साथ मिलकर काम करना पड़ता है ताकि यह सुनिश्चित हो सके कि उन क्षणों के लिए हमारी दृष्टि अंतिम उत्पाद में तब्दील हो। लोटी या सीएसएस एनिमेशन जैसे उपकरण हमें डेवलपर्स को ठीक वही दिखाने की अनुमति देते हैं जो हम चाहते हैं, जिससे बदलावों और अंतःक्रियाओं को जीवंत बनाने में मदद मिलती है।


कोडिंग हमें यह समझने में मदद करती है कि क्या संभव है

कोडिंग सीखने से हमें यह समझने में मदद मिलती है कि क्या बनाना यथार्थवादी है - और क्या सिर्फ़ एक खिंचाव हो सकता है। ज़रूर, एक शानदार ड्रिबल पोर्टफोलियो देखना बहुत अच्छा है। लेकिन, अगर उन डिज़ाइनों को विकसित नहीं किया जा सकता है, तो वे सिर्फ़ डिजिटल कला हैं, कार्यात्मक उत्पाद नहीं।


जब हम कोडिंग की कुछ बुनियादी बातें जान लेते हैं, तो हम यह देखना शुरू कर देते हैं कि क्या संभव है, जिसका अर्थ है कि हम अपने डेवलपर्स को अव्यावहारिक विचारों से अभिभूत किए बिना रचनात्मक हो सकते हैं।


उदाहरण के लिए, लॉगिन स्क्रीन के लिए माइक्रो-इंटरैक्शन डिज़ाइन करना। कल्पना करें कि आप एक सूक्ष्म, संतोषजनक एनीमेशन चाहते हैं। यह उपयोगकर्ताओं को उनके पासवर्ड टाइप करते समय फ़ीडबैक देना चाहिए। उदाहरण के लिए, सही फ़ॉर्मेट मिलने पर फ़ील्ड को हरे रंग में चमकना चाहिए। CSS या JavaScript को थोड़ा भी समझे बिना, आप कुछ बहुत जटिल पिच कर सकते हैं जिसे बनाने में डेव टीम को घंटों लग जाएँगे। कुछ कोडिंग ज्ञान के साथ, आपको पता चल जाएगा कि कौन से प्रभाव यथार्थवादी हैं। यह आपको ऐसे विचार पेश करने में मदद करेगा जो शानदार और प्राप्त करने योग्य दोनों हैं।


डिजाइनरों को "पानी की तरह होना चाहिए" - अनुकूलनीय और तरल (इस उद्धरण के लिए धन्यवाद, ब्रूस ) हम अभी भी रचनात्मक सीमाओं को आगे बढ़ा सकते हैं, लेकिन हम अपने सामने मौजूद बाधाओं के प्रति संवेदनशील हैं।


सर्वोत्तम डिजाइन प्रेरणा देते हैं उपयोगकर्ता और डेवलपर्स दोनों निर्माण के लिए व्यावहारिक सीमा से आगे बढ़ने की आवश्यकता नहीं है।


प्रभावशाली डिजाइन के लिए हाथ से हाथ मिलाना

डिज़ाइन का मतलब सिर्फ़ सौंदर्यबोध नहीं है। यह एक समस्या-समाधान प्रक्रिया है जिसका उद्देश्य आपके द्वारा पेश किए जाने वाले उत्पाद और सेवा के साथ लोगों के अनुभव को बेहतर बनाना है, और अंततः आपके ब्रांड के साथ भी।


आज, हम सिर्फ़ डिज़ाइनर नहीं हैं; हम समस्या-समाधानकर्ता हैं, उपयोगकर्ता अनुभव के चैंपियन हैं, और सबसे महत्वपूर्ण बात, सहयोगी हैं। अपनी रचनात्मकता को तकनीकी अंतर्दृष्टि के साथ जोड़कर, हम कल के उत्पादों के लिए मार्ग प्रशस्त कर रहे हैं - ऐसे उत्पाद जो न केवल सुंदर हैं बल्कि उपयोगकर्ताओं के लिए वास्तव में सार्थक और प्रभावी भी हैं।


डिज़ाइनर के तौर पर हमारा काम सिर्फ़ एक सुंदर प्रोटोटाइप तैयार करने से कहीं ज़्यादा है - यह उस विज़न को जीवन में लाने के लिए डेवलपर्स के साथ मिलकर काम करने के बारे में है। इसका मतलब है विकास प्रक्रिया के दौरान शामिल रहना, तकनीकी चुनौतियों से निपटने के लिए मौजूद रहना, ज़रूरत पड़ने पर डिज़ाइन में बदलाव करना और संचार लाइनें खुली रखना। यह निरंतर सहयोग ही है जो एक अच्छे डिज़ाइन को एक बेहतरीन उत्पाद में बदल देता है।


जैसे-जैसे डिज़ाइन विकसित होता जा रहा है, कोडिंग का महत्व बढ़ता ही जा रहा है। डिज़ाइन और तकनीक के चौराहे पर, नवाचार की अविश्वसनीय संभावना है - लेकिन इसके लिए मानसिकता में बदलाव की आवश्यकता है। कोडिंग को एक मुख्य कौशल के रूप में अपनाने से डिज़ाइनर ऐसे उत्पाद बना पाते हैं जो न केवल दिखने में शानदार हों बल्कि कार्यात्मक, डेवलपर-अनुकूल और प्रभावशाली भी हों।


पी.एस.: मुझे पता है कि आप क्या सोचते हैं, आप ये रंगीन सब्जी कार्ड चाहते हैं। मैंने एक खुला कार्ड तैयार किया है फ़िग्मा आपके लिए संसाधन फ़ाइल: