
Allbirds
सफेद लिनन पर प्राकृतिक सामग्री
ऑलबर्ड्स एक शांत, सहज आत्मविश्वास के साथ काम करता है—लगभग पूरी तरह से रंगहीन कैनवास, जिसमें उत्पाद फोटोग्राफी से लिए गए गर्म रेत (#e0dacf) और हल्के मिट्टी के रंग शामिल हैं। उपयोगकर्ता इंटरफ़ेस उत्पाद अनुभव में बाधा नहीं डालता: सफेद सतहें, पतले बॉर्डर, बड़े अक्षरों में नेविगेशन और पिल-आकार के नियंत्रण जो वेब तत्वों के बजाय भौतिक बटनों की तरह लगते हैं। हेडलाइन और कलेक्शन के नाम जैसे कुछ महत्वपूर्ण स्थानों के लिए सेल्फ मॉडर्न (एक कस्टम सेरिफ़ फ़ॉन्ट) का उपयोग किया गया है, जबकि प्रत्येक अक्षर, बॉडी टेक्स्ट और बटन के लिए तीन संतुलित वज़न में जियोग्राफ का उपयोग किया गया है। श्रेणी कार्ड एक रंग प्रणाली बन जाते हैं: प्रत्येक कार्ड प्रदर्शित उत्पाद से अपना पृष्ठभूमि रंग लेता है, जिससे नेविगेशन एक जीवंत पैंटोन पैलेट में बदल जाता है।
अधिकतम चौड़ाई लगभग 1200px है, जो पर्याप्त साइड पैडिंग के साथ केंद्र में स्थित है। मुख्य तत्व एक गर्म रेतीले रंग की पृष्ठभूमि पर एक पूर्ण-चौड़ाई वाली संपादकीय पट्टी है, जिसके केंद्र से एक बड़ा उत्पाद कैरोसेल निकलता है। श्रेणी नेविगेशन चार स्तंभों में चार समान रंग के कार्डों का एक ग्रिड है, जिनमें से प्रत्येक में एक केंद्र में स्थित जूते का मॉडल है। नीचे की ओर, लेआउट पूर्ण-चौड़ाई वाले विभाजित पैनलों (बाईं ओर जीवनशैली फोटो + दाईं ओर उत्पाद नमूना) और एक छोटे, रेखांकित अनुभाग शीर्षक के नीचे केंद्र में स्थित उत्पाद कैरोसेल के बीच बदलता रहता है। समग्र लय इस प्रकार है: पूर्ण-चौड़ाई वाला संपादकीय पैनल → चार-स्तंभ ग्रिड → केंद्र में स्थित उत्पाद कैरोसेल → दो-स्तंभ विभाजित → केंद्र में स्थित उत्पाद कैरोसेल। अनुभागों के बीच की दूरी 40-56px है, जिससे सहज लेकिन जटिल संक्रमण नहीं होता है। नेविगेशन एक न्यूनतम, स्थिर शीर्ष पट्टी है जिसमें केंद्र में स्थित प्राथमिक लिंक हैं।
फोटोग्राफी संपूर्ण दृश्य प्रणाली है। सभी उत्पाद शॉट्स क्लोज-अप हैं, थोड़े तिरछे कोण से लिए गए हैं, और पृष्ठभूमि जूते के एक्सेंट रंग से मेल खाती है या उसे पूरक करती है, जिससे प्रत्येक फोटो प्रभावी रूप से एक रंग अध्ययन में बदल जाती है। लाइफस्टाइल फोटो गर्म, धूप वाले रंगों में, प्राकृतिक परिवेश (एगेव के खेत, लकड़ी के डेक, ऊबड़-खाबड़ इलाके) में खींची गई हैं, और शांत रंग पैलेट से मेल खाने के लिए सूक्ष्म रूप से शांत रंगों का उपयोग किया गया है। इसमें कोई चित्र, कोई 3डी रेंडर या कोई अमूर्त ग्राफिक्स नहीं हैं। पैंटोन के सहयोग से, शाब्दिक रंग पैलेट को एक ग्राफिक तत्व के रूप में उपयोग किया गया है। आइकनोग्राफी न्यूनतम और मोनोक्रोम है (नेविगेशन और सहायक स्थानों पर आउटलाइन आइकन)।
पैलेट
तटस्थ
- Canvas White
#ffffff— पेज की पृष्ठभूमि छवियां, कार्ड की सतहें, उत्पाद कार्ड की पृष्ठभूमि छवियां। - Charcoal
#212121— द्वितीयक यूआई तत्वों, विभाजकों और म्यूटेड लेबलों के लिए एक तटस्थ रंग समर्थित है। इसे कॉल टू एक्शन के प्राथमिक रंग के रूप में उपयोग नहीं किया जाना चाहिए। - True Black
#000000— शीर्षक, आइकन, उच्च-कंट्रास्ट फ्रेम, नेविगेशन टेक्स्ट। - Warm Sand
#e0dacf— मुख्य अनुभाग की पृष्ठभूमि, अतिरिक्त सतह छाया, बड़े संपादकीय पैनल। - Olive Char
#222519— द्वितीयक यूआई तत्वों, विभाजकों और म्यूटेड लेबलों के लिए एक तटस्थ रंग समर्थित है। इसे कॉल टू एक्शन के प्राथमिक रंग के रूप में उपयोग नहीं किया जाना चाहिए। - Iron Gray
#525252— द्वितीयक पाठ, सहायक पाठ, अगोचर फ्रेम।
टाइपोग्राफी
12 से 40px तक · 6 चरण
- Self Modern — प्रतिस्थापन: Playfair Display · रूपरेखा 400 · शीर्षकों और संपादकीय का प्रयोग सीमित रूप से किया गया है, जिसमें मुख्य वाक्यांशों और संग्रह के शीर्षकों को ही प्रमुखता दी गई है। सेरिफ़ और इटैलिक फ़ॉन्ट का प्रयोग सैन्स-सेरिफ़ फ़ॉन्ट की एकरसता को तोड़ता है और यह संदेश देता है: "यही कहानी का सार है।"
- Geograph — प्रतिस्थापन: Inter · रूपरेखा 400, 500, 700 · उपयोगकर्ता इंटरफ़ेस के लिए प्राथमिक फ़ॉन्ट में बॉडी टेक्स्ट, नेविगेशन लेबल, बटन, उत्पाद शीर्षक, फ़ूटर, इनपुट फ़ील्ड और आइकन शामिल हैं। हाइलाइट किए गए शीर्षकों के लिए 500 और उत्पाद नामों के लिए 700 का उपयोग किया गया है। नेविगेशन लेबल और श्रेणियों में बड़े अक्षरों के बीच पर्याप्त स्पेसिंग (0.025em–0.10em) एक सुसंगत ब्रांड शैली स्थापित करती है।
- HurmeGeometricSans3 — प्रतिस्थापन: Inter · रूपरेखा 400 · इसका उपयोग शायद ही कभी बैकअप या बटन के लिए समर्पित लेबल के रूप में किया जाता है। जियोग्राफ इस सिस्टम का उपयोग प्रतिदिन करता है।
अंतराल और रूप
| उद्देश्य | अर्थ |
|---|---|
| घनत्व | घना |
| बुनियादी कदम | 8-16px |
| बटन त्रिज्या | 9999px (pill) |
| कार्ड त्रिज्या | 16px |
| छैया छैया | नहीं - छाया के बजाय बॉर्डर |
| अनुभागों के बीच | 40-56px |
| पृष्ठ की चौड़ाई | 1200px |
एआई आपकी वेबसाइट को Allbirds शैली में बनाएगा और उसमें डेटा भरेगा।
- इन लिंक के माध्यम से उत्पादों और पोस्ट से भरें - Instagram, TikTok, Facebook ।
- अपनी पुरानी वेबसाइट से सामग्री स्थानांतरित करें—बस पता निर्दिष्ट करें।
- सर्वश्रेष्ठ इंजन पर आधुनिक डिजाइन: React ( Next.js) जिसमें सर्वर रेंडरिंग और एसईओ अनुकूलन की सुविधा अंतर्निहित है।
- खोज परिणामों और न्यूरल नेटवर्क अनुशंसाओं के लिए पूरी तरह से स्वचालित एसईओ अनुकूलन।
समान शैलियाँ
- Lightship — खुली सड़क का एक सिनेमाई दृश्य। गर्म क्रीम रंग की गैलरी की दीवारें बड़े-बड़े भूदृश्य चित्रों से सजी हैं, जिन्हें पास-पास लगाया गया है, फ्रेम पर पतले काले अक्षर मुश्किल से दिखाई दे रहे हैं, और एक चमकीला नारंगी रंग इस एकरसता को ऐसे तोड़ रहा है जैसे किसी घास के मैदान में जलती हुई आग।
- Faire ES — गर्म क्रीम का थोक कैटलॉग
- Adanola — सफेद कागज पर छपी एक संपादकीय लुकबुक। एक फैशन शूट जिसमें साफ सफेद सतहों पर टाइपोग्राफी और फोटोग्राफी जीवंत हो उठती है, टाइपफेस के लिए काली स्याही और ब्रांड की समग्र शैली को प्रतिबिंबित करने वाला एक सूक्ष्म सिग्नेचर सैन्स-सेरिफ फॉन्ट (फेवरिट) का उपयोग किया गया है।
- Oura Ring — धूप से जगमगाती एक आरामदायक ओटमील बनाने की कार्यशाला।
- Stykka — सफेद रोशनी में एक स्कैंडिनेवियाई कार्यशाला – एक शांत, हस्तनिर्मित शोरूम जहाँ केवल फोटोग्राफी की ही आवाज सुनाई देती है।
- DJI — एयरोस्पेस ब्लैक कैनवास, जिसमें एक इलेक्ट्रिक ब्लू हाईलाइट है।
- Altitude Beverages — मोनोक्रोम पत्रिका का पृष्ठ। कल्पना कीजिए एक फैशन पत्रिका के पृष्ठ की जिसमें स्थिर तस्वीरों के अलावा कोई रंग नहीं है—पाठ और खाली स्थान ही पूरी कहानी बयां करते हैं।
- AATHER — खुली हथेली, एक अकेली लौ - शांति में समाहित एक शांत विलासिता
- Cowboy — बर्फ़ जैसे सफ़ेद चीनी मिट्टी के बर्तनों से सजी एक बेल्जियम की साइकिल गैलरी। एक ऐसा शोरूम जहाँ मैट सतहें, संपादकीय सामग्री में प्रयुक्त बड़े फ़ॉन्ट और सजावट की लगभग अनुपस्थिति साइकिल और उसके अंदर रखी वस्तुओं पर ध्यान केंद्रित करती है।
- Refero — सफेद संगमरमर पर संपादकीय लेआउट - एक टाइपोग्राफर द्वारा बनाया गया उत्पाद पृष्ठ, जहाँ सेरिफ़ फ़ॉन्ट में लिखी गई हेडलाइन ब्रांड की पहचान है, और बाकी सब कुछ सादा है।
- Face Formula — एक स्कैंडिनेवियाई संपादकीय चित्र। एक शांत, पत्रिका-शैली का स्प्रेड, जहाँ मॉडल की निगाहें और शीर्षक, जो एक सघन सेरिफ़ फ़ॉन्ट में लिखे गए हैं, एक ठंडे, धुंधले पृष्ठभूमि के सामने खुद ही सब कुछ बयां करते हैं।
- Shupatto — सफेद संगमरमर पर संग्रहालय का प्रदर्शन केस