ध्यान रखने के लिए कुछ बिंदु:
- हर डिजाइन एक समस्या हल करती है
"मैं इसे कैसे सुंदर बनाऊँ?" और इसके बारे में सोचना शुरू करें "मैं इसे कैसे संभव के रूप में उपयोग करना आसान बनाता हूं?"
जब आप वेबसाइट बना रहे हैं, इसका मतलब है कि, व्यापक अर्थों में, आप एक व्यावसायिक समस्या को हल कर रहे हैं ।
व्यावसायिक लक्ष्य का एहसास करने के लिए एक वेबसाइट मौजूद है ।
किसी वेबसाइट के उपयोगकर्ता अपने स्वयं के लक्ष्य को ध्यान में रखते हैं- वे कुछ खरीदना चाहते हैं, उत्पादों की तुलना कर सकते हैं, किसी विषय पर पढ़ सकते हैं, आदि।
यह डिज़ाइनर के रूप में आपका काम है कि व्यवसाय को यह सुनिश्चित करने में मदद करें कि अधिक से अधिक उपयोगकर्ता व्यावसायिक लक्ष्य को पूरा करें और उपयोगकर्ताओं को वेबसाइट पर नेविगेट करने में मदद करें ताकि वे अपने स्वयं के लक्ष्य को पूरा कर सकें।
उदाहरण के लिए, आप एक ई-कॉमर्स स्टोर डिजाइन कर रहे हैं: यहां व्यवसाय का लक्ष्य उत्पादों को बेचना होगा। और उपयोगकर्ताओं का लक्ष्य ठीक वही है जो वे खरीदना चाहते हैं, जितनी जल्दी हो सके और जितनी जल्दी हो सके बाहर की जाँच करें।
डिज़ाइन प्रक्रिया का एक बड़ा हिस्सा समस्या का पता लगाने में जाता है, उपयोगकर्ता की एक प्रोफ़ाइल का निर्माण करना, यह सोचना कि व्यावसायिक लक्ष्य को कैसे महसूस किया जाए, आदि।
रंग, फोंट, लेआउट, आपके द्वारा किए गए प्रत्येक डिजाइन निर्णय को वेबसाइट के लक्ष्य द्वारा निर्धारित किया जाना है ।
- यह दोहराव है जो चीजों को सुंदर दिखता है ।
यही संगति है।
उदाहरण के लिए, फॉन्ट पेयरिंग। विवरणों के विवरण के आधार पर फ़ॉन्ट्स समान लक्षणों के आधार पर जोड़े जाते हैं।
यहाँ एक मैच है: फ़र्नहैम और बेंटन संस।
इस पोस्ट के अनुसार यहाँ 2 इन दो फोंट मैच क्योंकि:
[...] चेहरे उनके निचले अक्षरों के स्क्वाटनेस में समान हैं, जिनमें विशिष्ट रूप से कम आरोही और अवरोही हैं। [...] दोनों के निचले अक्षर विस्तृत हैं।
कुछ लक्षणों की पुनरावृत्ति इन 2 फोंट को एक साथ अच्छी तरह से काम करती है। आप उन्हें यहां एक वेब पेज पर देख सकते हैं 3 ।
दोहराव एक डिजाइन में सद्भाव लाता है। और सद्भाव डिजाइन को सुंदर बनाता है।
लेकिन, जैसा कि आप देख सकते हैं, फ़र्नहैम और बेंटन संस भी इसके विपरीत हैं- फ़र्नहम एक सेरिफ़ फ़ॉन्ट है और बेंटन सेन्स सेरिफ़ है।
इसके विपरीत की आवश्यकता क्यों है? हम एक डिजाइन में समानताएं शुरू करना चाहते हैं, है ना?
ठीक है, हाँ, लेकिन बहुत अधिक दोहराव आपके डिजाइनों को सुस्त और उपयोग करने में कठिन बनाता है ।
इलाज इसके विपरीत है।
- कंट्रास्ट उपयोगकर्ता को अपना रास्ता खोजने में मदद करता है
यह उन्हें एक दूसरे से अलग तत्वों को अलग करने में मदद करता है। यह हेडिंग, नेविगेशन, बटन जैसे प्रमुख तत्वों को खोजने में उनकी मदद करता है।
जितना महत्वपूर्ण तत्व है, उतना ही इसके परिवेश के साथ विपरीत होना चाहिए।
अपने डिजाइनों को सुसंगत बनाने के लिए पुनरावृत्ति का उपयोग करें। जैसे दूसरों ने कहा है- 2 फोंट एक सीमित रंग पैलेट, आदि।
इसके विपरीत का उपयोग करें जब आपको वास्तव में बाकी से एक तत्व को अलग करने की आवश्यकता होती है।
यह सब जानकर अच्छा लगा, लेकिन ... फिर भी यह आपकी अगली वेबसाइट को डिजाइन करने में मदद नहीं करता है, है ना?
खैर, मेरे पास इसके लिए एक उपाय भी है।
वेब डिजाइन में बेहतर बनने के लिए चरण 1 दूसरों के काम का निरीक्षण करना और अवशोषित करना है। बहुत ज़्यादा उसका। यहीं से “प्रेरणा” मिलती है।
सौ डिजाइनों को देखें जो आपको पसंद हैं, उनका विश्लेषण करें और आप पैटर्न को खोलना शुरू कर देंगे। आपका मस्तिष्क आपको इन पैटर्नों को अपने स्वयं के डिज़ाइन में संयोजित करने में मदद करेगा जो आपके द्वारा देखे गए सभी समान डिज़ाइनों की भिन्नता होगी। आपको कुछ "अद्वितीय" बनाने की आवश्यकता नहीं है।
सारांश: अगली बार जब आप अपने पक्ष परियोजना के लिए डिजाइन करना शुरू करते हैं
एक दर्जन समान वेबसाइटों / वेब ऐप के माध्यम से जाएं और उनके डिजाइन के त्वरित स्केच बनाएं। ध्यान दें कि वे किस कार्यप्रवाह का उपयोग करते थे। उन्होंने इसका इस्तेमाल क्यों किया? ध्यान दें कि उन्होंने किस आकार, रंग और फोंट का उपयोग किया।
फिर इस प्रक्रिया के माध्यम से अपना स्वयं का डिज़ाइन बनाएं:
परियोजना को परिभाषित करें। प्रोजेक्ट में खुद को डुबोएं और इस बारे में अधिक जानकारी प्राप्त करें:
1.Its उद्देश्य, इच्छित परिणाम
- इसके (भविष्य) उपयोगकर्ता
- अपने उपयोगकर्ताओं / आगंतुकों के लिए इच्छित अनुभव
- परियोजना के पीछे ब्रांडिंग
- आवश्यक संसाधनों को हासिल करें। अपने हाथों को प्राप्त करें (नमूना) सामग्री (समान साइटों से उधार लें)
सामग्री को आकार दें
- एक टाइपफेस चुनें जिसमें सामग्री टाइप करना है (एक को चुनें जो साइट के मूड और संदेश को फिट करता है)
- बॉडी कॉपी के लिए फॉन्ट साइज चुनें
- बॉडी कॉपी के फ़ॉन्ट आकार से एक मॉड्यूलर स्केल (आनुपातिक हार्मोनिक आयामों की एक तालिका) बनाएं (प्रकार स्केल - एक विज़ुअल कैलकुलेटर का उपयोग करके)
- परियोजना की आवश्यकताओं के आधार पर अलग-अलग लेआउट
- मॉड्यूलर स्केल की मदद से लेआउट (HTML और CSS में) बनाएँ: कॉलम की चौड़ाई, लाइन की ऊँचाई, हेडिंग साइज़, निचला मार्जिन, कॉलम (यदि आवश्यक हो)
- ब्रांड दिशानिर्देश के अनुसार रंग लागू करें
आप यहां इस प्रक्रिया के प्रत्येक चरण के बारे में अधिक पढ़ सकते हैं ।
