नया Yandex.Disk इंटरफ़ेस। हमने यह कैसे किया और हमने यह सब क्यों किया

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

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



मेरा नाम सर्गेई टॉमिलोव है, मैं उन लोगों में से एक था जिन्होंने नए डिजाइन पर काम किया। आज मैं आपको यह बताना चाहता हूं कि काम कैसे हुआ, हमें क्या कठिनाइयाँ हुईं, इन सबके पीछे की अवधारणा क्या थी और इसने डिज़ाइन को कैसे प्रभावित किया।

संकल्पना

आज, कई लोग, यहां तक ​​कि सबसे उन्नत भी नहीं हैं, अक्सर कई उपकरण होते हैं, जिस पर वे समान सेवाएं खोलते हैं। लैपटॉप, टैबलेट या स्मार्टफ़ोन के लिए उनका तकनीकी कार्यान्वयन अलग हो सकता है, लेकिन अर्थ समान है। और जो लोग काम कर रहे हैं, वे कम और कम फ़ाइलों और स्वरूपों, और अधिक से अधिक - सामग्री हैं। आप केवल .jpg, .epub और .mp3 में फ़ाइलें संग्रहीत नहीं करते हैं, लेकिन फ़ोटो, पुस्तकें और संगीत। और हर डिवाइस पर उनकी तस्वीरें, किताबें और संगीत होगा।

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



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

प्रक्रिया है

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

सबसे पहले, डिस्क पहले से ही Yandex.Mail उपधारा से बढ़ी है। इससे पूर्ण सेवा करने का समय आ गया था।



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



कई सौ फ़ाइलों वाली डिस्क पर पूर्ण-पाठ खोज के महत्व को कम करना मुश्किल है, इसलिए हमने इसके लिए एक प्रमुख स्थान लिया। वह अपने सामान्य स्थान पर चला गया - सेवा के शीर्ष लेख में।



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

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



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



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

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



ड्राइव के वेब इंटरफेस में भी समूह संचालन दिखाई दिया। कई ऑब्जेक्ट का चयन करने के लिए, आप मानक कुंजी संयोजनों का उपयोग कर सकते हैं: Shift +, ctrl (cmd) +।

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



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

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

आगे के कदम

वास्तव में, यह कहानी कि लोगों की समस्याओं को हल करने के लिए जानकारी की संरचना करना आवश्यक है और यांडेक्स के लिए सामग्री नई नहीं है। लगभग 17 वर्षों से, हमारी खोज ऐसे लोगों की खोज, रैंकिंग और प्रदर्शन कर रही है जो वे खोज रहे हैं। और वह ऐसा करता है ताकि उनके लिए पाया में नेविगेट करना सुविधाजनक हो। Yandex दुनिया की उन कंपनियों में से एक है जो किसी व्यक्ति के लिए अपने सवालों के जवाब पा सकती है। और ये html पेज या साइट नहीं हैं, बल्कि पते, समाचार, चित्र, नक्शे पर ऑब्जेक्ट, रेसिपी आदि हैं। लोगों के इस सभी ज्ञान और समझ को नई ड्राइव में आवेदन मिलेगा।

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

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

काम का यह तर्क पहले से ही Yandex.Disk क्लाइंट पर लागू होता है। उदाहरण के लिए, आप स्क्रीनशॉट लेते हैं, और उन्हें "स्क्रीनशॉट" फ़ोल्डर में जोड़ा जाता है; कैमरा या फोन कनेक्ट करें, और तस्वीरें कैमरा फ़ोल्डर में भेजी जाती हैं।

दूसरे, यैंडेक्स के साथ ड्राइव की वैश्विक कनेक्टिविटी विकसित होगी। पहले से ही, अब इससे प्राप्त वस्तुओं को Y. Post में अक्षरों से जोड़ा जा सकता है, Y. Music एप्लिकेशन में जोड़े गए गीतों को सुन सकते हैं, इसमें Y. Fotok के एल्बमों को सहेज सकते हैं। इसके अलावा, ड्राइव प्रौद्योगिकियां हमारे ब्राउज़र में सिंक्रनाइज़ेशन प्रदान करती हैं, जिनके उपयोगकर्ता तुरंत इसे सीधे अपने "क्लाउड" से बचा सकते हैं। और ऐसे और भी संबंध होंगे।

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



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