कैसे एक प्रोग्रामर एक फैशन साइट के लिए मिला

मैं एक प्रोग्रामर लड़की हूं। इसलिए, मेरा व्यवसाय बोर्श को खाना बनाना है और अपनी खुद की परियोजनाओं के बारे में हैबर पर लेख लिखना है। हाल ही में, हमने epic_noob के साथ दो साइटें लॉन्च की हैं। एक अधिक या कम दिलचस्प है ( dress4weather.ru ), और दूसरा फैशन ( Fashionhearts.ru ) के बारे में है। मैं आपको बताता हूं कि हमने उन्हें कैसे बनाया और उड़ान कैसे चली।

यह सब कैसे शुरू हुआ

लगभग एक साल पहले, हमने घुटने पर कुछ सरल साइट को काटने के लिए काम करने का फैसला किया। हमारे पास बहुत सारे विचार थे - ज़ोंबी गेम से लेकर कुकिंग ऐप्स तक। लेकिन हम में से दो हैं, एक आदमी और एक लड़की, इसलिए उन्होंने न तो मछली चुनी और न ही मांस - मौसम के बारे में एक साइट।
साइट का विचार मौसम और उन चीजों को दिखाना था जो इस मौसम में पहनने लायक हैं।
चूंकि हम दोनों एक ही कंपनी में इंटरफ़ेस डेवलपर्स के रूप में पूर्णकालिक काम करते थे और इस व्यवसाय से जुड़ने वाले नहीं थे, इसलिए हमारे पास इस परियोजना के भविष्य और मुद्रीकरण के लिए कोई विशेष योजना नहीं थी - हमने सिर्फ मनोरंजन के लिए किया।
Seryozha ने आपके इंटरनेट पर एक मुफ्त मौसम एपी ( wunderground.com ) खोदा और यह शुरू हुआ।

सर्वर पक्ष Node.js + MongoDB + nginx में लिखा गया था। जैसा कि कहा जाता है, कितने इंटरफ़ेस डेवलपर्स फ़ीड नहीं करते हैं, हर कोई जावास्क्रिप्ट को देखता है।

फोटोशॉप में घुटने पर डिजाइन को स्केच किया गया और इंजन बनाया गया। सामग्री सबसे जिद्दी जिद्दी (आई) द्वारा नियंत्रित किया गया था। चीजों के साथ पहला आधार अनुसूची से पहले किया गया था - मैंने बस अपने पसंदीदा स्टोर से चीजों की तस्वीरें एकत्र कीं, उन्हें फ़ोटोशॉप में संसाधित किया और सभी मौसम की स्थिति के लिए कपड़े के सेट बनाकर, उन्हें एक json फ़ाइल में लिखा।
पहला डिज़ाइन विकल्प dress4weather.ru:



अप्रत्याशित रूप से, लोग साइट पर आने लगे। मैं आपको ईमानदारी से बताऊंगा - अब साइट पर कम ट्रैफ़िक है। लेकिन यह गैर-शून्य (प्रति दिन 150 अद्वितीय), स्थिर और सबसे महत्वपूर्ण है ... हमने कुछ भी नहीं किया, ठीक है, हमने अपनी साइट को बढ़ावा देने के लिए कुछ भी नहीं किया।
यह विचार इंटरनेट समुदाय के लिए मज़ेदार लग रहा था, और नहीं, नहीं, और यह हमारे बारे में कुछ संसाधन लिख देगा। एक महत्वपूर्ण दिन पर, हमें मौसम एपि से पहली चीनी चेतावनी भी मिली जो यातायात सीमा को पार करने के बारे में थी - 500 अलग-अलग शहरों के दो हजार लोग आए। यह पता चला है कि एक फैशन ब्लॉगर ने हमारे बारे में लिखा है और हर कोई तत्काल यह देखने के लिए दौड़ा कि क्या मरमंस्क में सूरज चमक रहा था।
एक बार इज़राइल के एक मज़ेदार कॉमरेड ने हमें लिखा और साइट पर एक फ्रैंचाइज़ी खरीदने की कोशिश की। हम ऐसी बेवकूफी में लग गए कि शाम के आराम के लिए हमने कारपेट देखा और इसलिए उसका जवाब नहीं दिया।

मौसम से लेकर कपड़ों तक

समय बीतता गया, लोग आते गए, और पैसा हमारे पास नहीं आया।
कुछ बिंदु पर, सरोज़ोहा, जो काम के कई स्थानों को बदलने में कामयाब रहे, ने फैसला किया कि वह रचनात्मकता चाहते थे। बच्चों और बंधक के बिना एक युवा व्यक्ति मानव बलिदान के बिना कई महीनों की रचनात्मकता का खर्च उठा सकता है, इसलिए उसने खुद को एक लैपटॉप के साथ एक अपार्टमेंट में प्रवेश किया और काम पर बैठ गया।
पहले सोचा था कि मौसम के बारे में साइट को अपग्रेड किया जाए। यह आवश्यक था:
1. संकलन किट के लिए एक व्यवस्थापक पैनल बनाएं
2. यह पता लगाने के लिए कि साइट के लिए डेटा कहां मिलेगा (सभी समान, कॉपी और पेस्ट नहीं)
3. किसी तरह का समाजीकरण करें - पसंद करने की क्षमता, कपड़े और आप और आप का एक संयोजन हो सकता है

दूसरा विचार था:
1. ओएमजी। यह "अतिरिक्त कार्यक्षमता" पूरी साइट के लिए पर्याप्त है!

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

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

हमने अध्ययन करना शुरू कर दिया कि चीजों का एक बड़ा आधार कहां और कैसे प्राप्त करना है। हमने लंबे समय तक विकल्पों का अध्ययन किया, Yandex.Market API की ओर देखा। लेकिन कुछ बिंदु पर मैं साइटों के सहबद्ध कार्यक्रमों के लिए आया था admitad.ru और gdeslon.ru, जो xml प्रारूप में डेटा शिप कर सकता है और उन्हें सहबद्ध लिंक प्रदान कर सकता है (यदि कोई व्यक्ति हमारी साइट से जाकर कुछ खरीदता है, तो लाभ होगा)।
लाभ की प्यास अंधी थी और हम दूसरे विकल्प पर आ गए।

प्रक्रिया प्रौद्योगिकी के बारे में अबाधित तथ्य

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

चीजों के संपादक को तैयार किया गया (Fabric.js) और फ़ाइल के साथ थोड़ा संशोधित किया गया।



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

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



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

छवियों को उतारने और संसाधित करने में कंप्यूटर के निरंतर संचालन के 2 दिन लगे (औसतन 4 छवियों के साथ 80 000 आइटम)।

चीजों के बारे में डेटा के साथ आने वाली XML फाइलें, हमने इसे Xml2js का उपयोग करके JSON में चलाया। फ़ाइल पार्सिंग समय में एक गैर-रैखिक वृद्धि के साथ थोड़ा आश्चर्य हुआ। एक 200mb फ़ाइल को कई घंटों के लिए पार्स किया जा सकता है। लेकिन अन्यथा, भागीदारों से डेटा का निर्यात घटना के बिना चला गया।

उन्होंने सामाजिक नेटवर्क के माध्यम से उपयोगकर्ता प्राधिकरण करने का फैसला किया और जब प्रक्षेप्य के पहले दृष्टिकोण का उपयोग किया, तो उन्होंने uLogin का उपयोग किया। लेकिन उन्होंने जल्दी ही महसूस किया कि uLogin बहुत सीमित कार्य प्रदान करता है और उन्हें सामाजिक नेटवर्क एपीआई पर अपने स्वयं के रैपर लिखना होगा। "सबसे प्यारी आपी" श्रेणी में, फेसबुक एपी ने जीत हासिल की। दोनों इंटरफेस अच्छे हैं, और प्रलेखन में हर जगह यूएक्स गाइड रखे गए हैं। संक्षेप में, सौंदर्य। माय वर्ल्ड के लिए प्रलेखन सुखद आश्चर्यचकित था (ऐसा प्रतीत होगा)। सबसे समझदार आपी सहपाठियों से निकली। तकनीकी सहायता से पत्राचार से ही कुछ आवश्यक बातें पता की जा सकती हैं।

आप प्रक्रिया के बारे में अंतहीन बात कर सकते हैं, इसलिए मैं पूरी तरह से बंद कर दूंगा।

हमारे द्वारा उपयोग की जाने वाली तकनीकों की सामान्य सूची (सामान्य तौर पर, सब कुछ अफीम है):
1. Node.js
2. MongoDB
3. nginx
4. जेड
5. आवश्यकता
6. इन-मेमोरी डेटा स्टोरेज - रेडिस
7. संपादक द्वारा पूरा करने के लिए राफेल
8. फैब्रिक.जेएस - कोलाज संपादक
9. सीएसएस के लिए कम
10. पोस्ट-प्रोसेसिंग के लिए ImageMagick सर्वर पर कोलाज
11. फेस डिटेक्शन के लिए ओपनसीवी
12. भागीदारों से डेटा पार्स करने के लिए xml2js

+ भविष्य में हम rsync के माध्यम से CDN पर चित्र अपलोड करने की योजना बनाते हैं।

अब हमारे पास क्या है

अब हमने अंततः सार्वजनिक और पुन: डिज़ाइन किए गए ड्रेस 4weather.ru में साइट लॉन्च की।


ताजा बेक्ड Fashionhearts.ru


नई मेपल dress4weather.ru

एक मानव प्रोग्रामर पर एक सामाजिक प्रयोग के परिणामों के अनुसार, मैं कहूंगा कि घर पर काम करना बहुत मुश्किल है। कभी-कभी शेरोज़ा खिड़की से बाहर मुस्कुराते हुए दिखते थे और दोहराते थे: "कितना अच्छा, कितना अच्छा, कितना अच्छा मैं अपना प्रोजेक्ट कर रहा हूँ!" कभी-कभी उन्होंने बेसबॉल बॉल पर अपना चेहरा चित्रित किया, उन्हें विल्सन कहा और खलनायक-भाग्य के बारे में शिकायत की। संक्षेप में, एक साधारण प्रोग्रामर का जीवन कठिन और सादा होता है।

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



हम प्रमोशन स्टेज में हैं। मौसम के बारे में हमारी साइट से स्वचालित रूप से कुछ ट्रैफ़िक प्राप्त करें।
अभी हाल ही में, मैंने VKontakte और सहपाठियों पर विज्ञापन देने की कोशिश करने का फैसला किया।
हमने एक साथ संपर्क के लिए दो अलग-अलग विज्ञापन दायर किए। एक घोषणा को लगभग तुरंत स्वीकार कर लिया गया, जबकि दूसरा भाग्य से बाहर था। दो दिनों के लिए मुझे कीचड़ भरे जवाबों से रूबरू कराया गया, मैं इसे बर्दाश्त नहीं कर सका और टेक सपोर्ट को लिखा।
उन्होंने उत्तर दिया कि "क्षमा करें, अस्वीकृति खंड के साथ एक गलती की", और अंत में उन्होंने हमारे सबसे सुंदर साइटों के प्रचार पर प्रतिबंध लगा दिया, क्योंकि लिंक साथी साइटों के माध्यम से जाते हैं, और यह एक अनुप्रेषित है। एक पुनर्निर्देशित संपर्क साइटों को विज्ञापित नहीं करता है।
यह शर्म की बात है कि मैंने मूर्खतापूर्ण तरीके से अपने विज्ञापन खाते में पैसा डाला, और अब उनकी वापसी के लिए मुझे उन्हें आवेदन का एक स्कैन, पासपोर्ट की एक प्रति, उंगलियों के निशान और एक रक्त का नमूना भेजने की आवश्यकता है। और अगर मैं यह सब करता हूं, तो मुझे संपर्क के विज्ञापन नेटवर्क में हमेशा के लिए प्रतिबंधित कर दिया जाएगा। मैं सोच रहा हूं कि क्या करूं, 30 रुपये तो कम नहीं ...
सहपाठियों में विज्ञापन के साथ, सब कुछ बहुत सरल हो गया और अब हमारा सुपरबर्नर घूम रहा है, पीड़ितों को आकर्षित कर रहा है।
हमें धीरे-धीरे यह एहसास होता है कि हमें विषयगत समुदायों में विज्ञापन की ओर देखने की जरूरत है।

हम साइट को अंतिम रूप दे रहे हैं, मैं इसके लिए लेख लिख रहा हूं और अंजीर सामग्री। सर्गेई कोडिंग और डिज़ाइन जैसी छोटी चीजों में लगे हुए हैं।
हम मज़ेदार और डरे हुए हैं!
PS और मैं वास्तव में जानते हैं कि कैसे बोर्स्क खाना बनाना है। सबूत: