टेलीग्राम, WhatsApp+380637610482
वैलेरी डैन्युक
वैलेरी डैन्युकडेवलपरव्यवसायों के लिए एआई उपकरण विकसित करना। उच्च गुणवत्ता। किफायती।Telegram पर लिखें
Foodnoms — इस शैली में एक साइट का पूर्वावलोकन

Foodnoms

सफेद चीनी मिट्टी पर बना धूप से जगमगाता फलों का बाजार - गर्म संतरे, ताजी हरी सब्जियां और विशाल गोल आकृतियाँ

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

इस पेज में एक सिंगल-कॉलम, सेंटर्ड, फुल-विड्थ लेआउट (~1200px) है जिसमें पर्याप्त वर्टिकल रिदम है। हेडर एक पतली टॉप बार है जिसमें बाईं ओर लोगो, सेंटर्ड नेविगेशन और दाईं ओर एक भरा हुआ नारंगी एक्शन बटन है। हीरो सेक्शन सेंटर्ड स्टैक है: दो रंगों वाला टाइटल, एक सिंगल-लाइन सबहेडर, एक ऐप स्टोर आइकन और फिर चौड़ाई में फैले 3-5 फोन मॉकअप की एक पंक्ति। हीरो सेक्शन के नीचे 2x3 ग्रिड में सेंटर्ड "As Recommended" प्रेस लोगो सेक्शन है। फीचर सेक्शन एक दोहराव वाले पैटर्न का पालन करते हैं: दो-कॉलम टेक्स्ट + फोन मॉकअप, बारी-बारी से साइड्स, नारंगी/हरे रंग में एक्सेंट सेक्शन हेडिंग के साथ। फुटर से पहले अंतिम एलिमेंट एक फुल-विड्थ डाउनलोड करने योग्य CTA कार्ड है। सेक्शन के बीच का गैप पर्याप्त (96px) है, जिससे एक विशाल, गैलरी जैसा अनुभव मिलता है। नेविगेशन एक मिनिमलिस्ट टॉप बार है - कोई साइडबार या मेगा मेनू नहीं है।

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

पैलेट

ब्रांड

  • Ember Orange #ff5406 — नारंगी रंग का उपयोग सजावटी विवरणों में द्वितीयक संकेत के रूप में और कभी-कभार उपयोग होने वाले संकेतों को उजागर करने के लिए किया जाता है। इसे कार्रवाई के लिए प्राथमिक रंग के रूप में उपयोग नहीं किया जाना चाहिए।

तटस्थ

  • Graphite #2f2f2f — मुख्य पाठ, गहरे रंग के बटन (ऐप स्टोर आइकन) और आइकन की रूपरेखा। शीर्षकों और मुख्य पाठ में प्रमुख रूप से गैर-सफेद रंग का प्रयोग।
  • Verdant Green #00b33f — हरा रंग सजावटी विवरणों के लिए एक अतिरिक्त आकर्षण के रूप में और निम्न आवृत्तियों पर जोर देने के लिए कार्य करता है।
  • Signal Red-Orange #ff3400 — एक द्वितीयक वार्म एक्सेंट, जो ऐप स्क्रीन यूआई तत्वों और संबंधित ब्रांडिंग में दिखाई देता है। एम्बर ऑरेंज से एक टोन अधिक वार्म, यह चयनित या सक्रिय ऐप स्थितियों पर जोर देता है।
  • Sky Blue #00a9dd — ऐप के आंतरिक डेटा श्रेणियों (कार्बोहाइड्रेट/प्रोटीन/अन्य पोषक तत्व समूह) के लिए एक सुखद विरोधाभास। यह फोन लेआउट में प्रमुख गर्म रंग पैलेट को संतुलित करता है।
  • Mist Blue #72a2c5 — म्यूटेड कूल एक्सेंट - ऐप के भीतर अतिरिक्त डेटा लेबल और चार्ट बैकग्राउंड के लिए आसमानी नीले रंग को नरम करता है।
  • Sunset Orange #ff6d00 — मार्केटिंग पेजों पर सेकेंडरी हेडिंग्स और हाइलाइट किए गए टेक्स्ट के लिए एक आकर्षक लहजा।

टाइपोग्राफी

12 से 60px तक · 7 चरण

  • Aquawax Pro Medium — प्रतिस्थापन: Inter · रूपरेखा 500 · एक्वावैक्स प्रो मीडियम - निकाले गए डेटा में पाया गया लेकिन एआई द्वारा इसका वर्णन नहीं किया गया।
  • Aquawax Pro — प्रतिस्थापन: Nunito Sans · रूपरेखा 700, 500, 600 · शीर्षकों और मुख्य पाठ सहित सभी संदर्भों में उपयोग किया जाने वाला प्रमुख ब्रांड फ़ॉन्ट। यह विशेष रूप से डिज़ाइन किया गया फ़ॉन्ट चौड़े अक्षरों, गोल ज्यामितीय आकृतियों और सुविधाजनक अनुपातों से युक्त है। बोल्ड (700) का उपयोग शीर्षकों और अनुभागों के लिए किया जाता है—जो सिस्टम के टाइपोग्राफिक मानक हैं। सेमीबोल्ड (600) का उपयोग उपशीर्षकों और बटन लेबल के लिए 14–1.8 मिमी पर किया जाता है। मध्यम (500) का उपयोग मुख्य पाठ के लिए 17–1.8 मिमी पर किया जाता है, जिसमें आरामदायक पठन के लिए 1.6–1.8 मिमी की पर्याप्त पंक्ति रिक्ति होती है।
  • System sans-serif — प्रतिस्थापन: Inter · रूपरेखा 400, 700 · यूजर इंटरफेस में बहुत छोटे टेक्स्ट और आइकन टेक्स्ट के लिए एक बैकअप विकल्प का उपयोग किया जाता है। माइक्रो साइज में Aquawax Pro का उपयोग नहीं किया जाता है; रेंडरिंग का भार कम करने के लिए सिस्टम फॉन्ट इन साइज को हैंडल करता है।

अंतराल और रूप

उद्देश्यअर्थ
घनत्वविशाल
बुनियादी कदम20px
बटन त्रिज्या26px
कार्ड त्रिज्या26px
छैया छैयानहीं - छाया के बजाय बॉर्डर
अनुभागों के बीच96px
पृष्ठ की चौड़ाई1200px

एआई आपकी वेबसाइट को Foodnoms शैली में बनाएगा और उसमें डेटा भरेगा।

  • इन लिंक के माध्यम से उत्पादों और पोस्ट से भरें - Instagram, TikTok, Facebook ।
  • अपनी पुरानी वेबसाइट से सामग्री स्थानांतरित करें—बस पता निर्दिष्ट करें।
  • सर्वश्रेष्ठ इंजन पर आधुनिक डिजाइन: React ( Next.js) जिसमें सर्वर रेंडरिंग और एसईओ अनुकूलन की सुविधा अंतर्निहित है।
  • खोज परिणामों और न्यूरल नेटवर्क अनुशंसाओं के लिए पूरी तरह से स्वचालित एसईओ अनुकूलन।

समान शैलियाँ

  • Slite — टेराकोटा हैंडल वाली एक गर्म चर्मपत्र नोटबुक—हर सतह मलाईदार कागज की है, हर छोटा सा हिस्सा नारंगी रंग का सूक्ष्म स्पर्श लिए हुए है।
  • Adora — धुंधले कांच के पीछे इंप्रेशनिज़्म संग्रहालय
  • Bento — धूप से जगमगाते लिनोलियम पर एक बेंटो लंचबॉक्स रखा है। चूने, लैवेंडर, कोबाल्ट और बरगंडी रंगों के गोल, स्टिकर जैसे कार्डों की एक ग्रिड, जिनमें से प्रत्येक पर मोटी काली स्याही से आउटलाइन बनी है, एक गर्म, मलाईदार लिनेन पर बोल्ड, ज्यामितीय शीर्षक के नीचे रखी है।
  • Payments — शाही बैंगनी पृष्ठभूमि पर चटख नींबू रंग। गहरा चमकीला बैंगनी रंग रात के आकाश का आभास कराता है, जबकि नींबू पीले रंग की छटा साफ सफेद सतह पर ताजे नींबू के छिलके की तरह चमकती है।
  • Textla — सनी रेट्रो बॉटनिकल पंचांग - मलाईदार पीले रंग का पृष्ठ गहरे हरे रंग में मुद्रित है, जिसमें कैक्टस के चित्र तीक्ष्ण, ऑफसेट छायाओं में दर्शाए गए हैं।
  • AI for Business — गर्म धूसर रंगों में ब्रूटलिस्ट शैली का संपादकीय शोरूम
  • Superhuman — गोल्डन आवर संपादकीय पैनल
  • Visitors — सफेद इंजीनियरिंग ड्राइंग
  • Vercel — सफेद कागज पर छपा टर्मिनल
  • Jeton — वार्म मार्बल पर फिनटेक के बारे में एक संपादकीय
  • Say Briefly — क्रीम रंग के कागज पर बनी क्रिएटिव एजेंसी की स्केचबुक
  • ClickUp — सफेद संगमरमर पर बना एक दमदार डैशबोर्ड। यह पेज एक उत्पादकता उपकरण का उत्पाद ब्रोशर है, इसलिए इसकी दृश्य भाषा उत्पाद से ही ली गई है: सघन सूचियाँ, स्थिति संकेतक, अवतारों के समूह और बोल्ड टाइपोग्राफिक कथन जो प्रदर्शित उत्पाद विनिर्देश की तरह दिखते हैं।