Spring toggle
A spring, not a tween. It overshoots a hair and settles, so it feels physical.
spring 520 / 30 04.5 / वेब और यूआई मोशन← मोशन ग्राफिक्स
ऐसे इंटरफ़ेस जोजीवंत लगें।
स्क्रॉल कहानियाँ, माइक्रो-इंटरैक्शन और पेज ट्रांज़िशन जो साइट को समझना आसान और भूलना मुश्किल बनाते हैं, गति या सुगम्यता की क़ीमत पर नहीं।
कारीगरी देखें
मोशन लैब: सात इंटरैक्शन जिन्हें आप छू सकते हैं
असली, चलता हुआ इंटरफ़ेस मोशन, वीडियो नहीं। टॉगल करें, होवर करें, खींचें और क्लिक करें। यहाँ सब कुछ घटी हुई गति की सेटिंग का सम्मान करता है।
04Depth
0%
- Brief
- Boards
- Animate
- Ship
Roaswell स्टूडियो द्वारा यह दिखाने के लिए बनाया गया कि हम कैसे काम करते हैं। यह क्लाइंट का काम नहीं है और न ही कोई असली ब्रांड।
आपको क्या मिलता हैलॉन्च करने के लिए
लॉन्च करने के लिए
सब कुछ।
काम शुरू होने से पहले तय किए गए स्पष्ट डिलिवरेबल, ताकि दायरा कभी चौंकाने वाला न बने।
01
मोशन सिद्धांत
ईज़िंग, टाइमिंग और स्प्रिंग टोकन ताकि हर इंटरैक्शन एक ही प्रोडक्ट का हिस्सा लगे।
02
स्क्रॉल और पेज ट्रांज़िशन
कहानी-प्रधान स्क्रॉल अनुक्रम और रूट ट्रांज़िशन जो ध्यान को दिशा देते हैं, जैसे इस साइट पर।
03
माइक्रो-इंटरैक्शन लाइब्रेरी
बटन, टॉगल, मेनू, कार्ड और फ़ॉर्म जो उद्देश्य के साथ प्रतिक्रिया देते हैं।
04
प्रोडक्शन कोड या एक्सपोर्ट
साफ़ CSS और JavaScript, या Lottie और वीडियो एक्सपोर्ट, आपके स्टैक के लिए तैयार।
05
सुगम्यता वेरिएंट
घटी हुई गति के विकल्प और फ़ोकस व्यवहार शुरू से डिज़ाइन किए गए, बाद में चिपकाए नहीं।
06
परफ़ॉर्मेंस बजट
मोशन को रिलीज़ से पहले लोड समय और इंटरैक्शन विलंब के विरुद्ध मापा जाता है।
यह कैसे चलता हैब्रीफ़ से
ब्रीफ़ से
तैयार काम तक।
चार चरण, हर एक का स्पष्ट आउटपुट, ताकि आप हमेशा जानें कि क्या बन रहा है और क्यों।
ऑडिट
पता लगाना कि मोशन कहाँ कुछ साफ़ करेगा और कहाँ बस शोर जोड़ेगा।
सिद्धांत तय करना
ईज़िंग और टाइमिंग की शब्दावली तय करना ताकि फ़ैसले मामला-दर-मामला न रहें।
ब्राउज़र में प्रोटोटाइप
असली माध्यम में बनाना ताकि आप जो मंज़ूर करें वही शिप हो।
शिप करना और मापना
परफ़ॉर्मेंस बजट के साथ रिलीज़ करना और देखना कि उपयोगकर्ता असल में क्या करते हैं।
यह कहाँ जुड़ता हैएक स्टूडियो।
एक स्टूडियो।
एक सिस्टम।
मोशन तब सबसे ज़्यादा असर करता है जब उसे डेटा से ब्रीफ़ किया जाए और वहाँ पहुँचाया जाए जहाँ बजट है।
सवालअच्छे सवाल,
अच्छे सवाल,
सीधे जवाब।
जो चाहिए वह नहीं मिला? सीधे पूछें, कोई वरिष्ठ जवाब देगा।
क्या एनिमेशन हमारी साइट को धीमा करेगा?
नहीं, अगर ठीक से बनाया गया हो। हम परफ़ॉर्मेंस बजट तय करते हैं, सबसे सस्ती प्रॉपर्टी से एनिमेट करते हैं और असली डिवाइस पर परखते हैं।
क्या आप कोड लिखते हैं?
हाँ। हम प्रोडक्शन-तैयार कोड शिप कर सकते हैं, या आपकी टीम के लागू करने के लिए स्पेसिफ़िकेशन और एक्सपोर्ट सौंप सकते हैं।
सुगम्यता का क्या?
हर मोशन का एक घटी-गति विकल्प होता है, और कीबोर्ड व स्क्रीन-रीडर व्यवहार एनिमेशन के साथ डिज़ाइन होता है।
क्या यह हमारे CMS या फ़्रेमवर्क के साथ काम करता है?
हम ज़्यादातर आधुनिक स्टैक के साथ काम करते हैं। बताइए आप क्या चलाते हैं और हम सबसे अच्छा तरीका पक्का करेंगे।
क्या मैं इसे काम करते देख सकता/सकती हूँ?
आप उसे देख ही रहे हैं। इस साइट के स्क्रॉल अनुक्रम, काउंटर और रिवील इसी तरीके से बने हैं।