الموقع المقنع لخدمة ذكاء اصطناعي يحتاج أكثر من واجهة رئيسية جميلة؛ يحتاج شرحًا واضحًا للمزايا، وطريقة لاستكشاف الخدمة ومقارنة الباقات والوصول إلى الخطوة التالية. تجمع حزمة حنين AI Studio Pro هذه العناصر في قالب Bootstrap قابل للتعديل، بأربع هويات للرئيسية ومكتبة صفحات داخلية مشتركة بالعربي والإنجليزي.
سعر الحزمة الكاملة في العرض الحالي 7 دولارات، والسعر الأساسي 17 دولارًا. تشمل عملية الشراء اللغتين والعروض الأربعة والصفحات المشتركة والمصدر والتوثيق وترخيص مشروع نهائي واحد. العروض الأربعة خيارات تصميم ضمن منتج واحد؛ لا تعني أربعة تراخيص لمشاريع مستقلة.
اختر الاتجاه البصري المناسب
الاستوديو الإبداعي
ألوان بنفسجية داكنة ولمسات لافندر وشامبين، مع تصور لمحرر بصري ومعرض أعمال وأقسام لعرض المزايا الإبداعية. يناسب هذا الاتجاه علامة تركز على الصور أو المحتوى وتريد انطباعًا بصريًا قويًا. واجهة المحرر وعرض الصور محتوى توضيحي في الواجهة الأمامية؛ لا ترتبط بمحرك توليد صور فعلي.
الوكلاء والأتمتة
هوية جرافيت وزمردية تضع سير العمل في مركز الواجهة. يوضح المخطط العلاقة بين المدخلات والوكيل والموافقة والتسليم، ليكون أساسًا مناسبًا لموقع استشارات أتمتة أو منتج تشغيلي. زر تشغيل سير العمل ينفذ محاكاة محلية، ولا يرسل طلبات إلى أنظمة خارجية.
المحادثة والمساعد
خلفيات عاجية وألوان زرقاء تمنح الواجهة طابعًا خفيفًا وواضحًا، مع مساحة محادثة تستقبل النص وتعرض ردودًا تجريبية مكتوبة مسبقًا. يصلح الاتجاه لتقديم مساعد دعم أو منتج معرفي أو خدمة محادثة، بعد ربط الواجهة بالنظام الخلفي المناسب.
الوكالة والاستشارات
كحلي داكن ولمسات نحاسية وتكوين بصري تحريري يساعد على تقديم العمل الاستشاري بصورة مرتبة. يمكن ربطه بصفحات الشركة والفريق ودراسات الحالة وموجز المشروع والتواصل لشرح طريقة العمل. ينبغي استبدال الادعاءات والصور والبيانات النموذجية بمحتوى يعبر عن النشاط الحقيقي.
ماذا تستلم داخل الحزمة؟
- 68 صفحة إنجليزية LTR و68 صفحة عربية RTL؛ أربع رئيسيات و64 نوعًا من الصفحات الداخلية المشتركة في كل لغة.
- صفحة لاختيار الديمو وقالب بداية Bootstrap صغير إضافي.
- Bootstrap 5.3.6 محلي، وملفات أنماط وJavaScript وصور ومولّد صفحات Python قابل للتعديل.
- صفحات للمزايا والحلول والتكاملات والأدوات والأوامر الذكية والمعرض والشركة والأسعار والمساعدة والحسابات التجريبية والنماذج القانونية.
- كتالوج توضيحي من 12 عنصرًا: تسع خدمات لمرة واحدة وثلاث باقات اشتراك نموذجية.
- سلة وكميات ودورات فوترة وكوبون DEMO10 وطلب محلي وسجل طلبات وفاتورة وإدارة اشتراك تجريبية.
- تصدير موجز مشروع وتقدير تكلفة إلى ملفات نصية، والتحقق من حقول التواصل وإعداد طلب دعم منظم.
- ترخيص مشروع واحد باللغتين، وتراخيص المكتبات، ودليل استخدام وصور فعلية للرئيسيات.
أربع رئيسيات ونظام صفحات مشترك
يمنح كل عرض انطباعًا أول مختلفًا، بينما تستخدم الصفحات الداخلية بنية وهوية مشتركتين. يمكنك اختيار رئيسية وإعادة استخدام أقسام من العروض الأخرى داخل مشروعك المرخص، ثم تكييف الصفحات الداخلية مع علامتك. اختيار رئيسية مختلفة لا يغيّر ألوان جميع الصفحات الداخلية تلقائيًا؛ تضبط الهوية المشتركة من متغيرات الأنماط وفئات الثيم.
المزايا والحلول والمكتبات الإبداعية
تغطي صفحات المزايا الصور والفيديو والصوت والكتابة والمحادثة والأتمتة. وتعرض صفحات الحلول الاستخدام حسب الفرق وصنّاع المحتوى والوكالات والتجارة الإلكترونية والتسويق. توجد مكتبات للأدوات والأوامر والتكاملات والأعمال الإبداعية، مع أمثلة للبحث والتصفية والنسخ والمقارنة والجولة التعريفية. أسماء التكاملات المعروضة أمثلة تقديمية؛ لا تتضمن الحزمة مفاتيح API أو اتصالات حية بهذه الخدمات.
رحلة السلة والطلب من البداية للنهاية
ابدأ من صفحة الخدمات، وافتح تفاصيل خدمة ثم أضفها إلى السلة. يمكنك تعديل كمية الخدمة الفردية، واختيار الفوترة الشهرية أو السنوية للاشتراك، وتجربة الكوبون DEMO10. تتحقق صفحة إتمام الطلب من الحقول محليًا دون حفظ بيانات الاتصال الشخصية، ثم تنشئ سجل طلب تجريبيًا غير شخصي. تعرض صفحات الطلب والفاتورة الإجماليات النموذجية، وتوضح صفحة الاشتراك خيارات التجديد. لا تخصم هذه الواجهات أموالًا ولا تُصدر فواتير حقيقية. أسعار الخدمات داخل الديمو أمثلة منفصلة عن سعر حزمة القالب البالغ 7 دولارات.
أدوات عملية للتخطيط والتواصل
تجمع حاسبة التكلفة الساعات وسعر الساعة والتعقيد والهامش الاحتياطي لإنتاج تقدير تخطيطي وملف نصي محلي. وينظم منشئ موجز المشروع الهدف والجمهور والمخرجات والمدخلات الأخرى في مسودة قابلة للتنزيل. تتحقق صفحات التواصل والدعم من البيانات أو تجهز نصًا للنسخ؛ إرسال الطلبات الفعلية يحتاج ربطًا بخادم أو مزود مراسلة، لأن الديمو لا يرسل بريدًا ولا يفتح تذاكر دعم حقيقية.
العربية والإنجليزية من البداية
تأتي اللغتان في مجلدين مستقلين مع اتجاه الصفحة ووسوم اللغة والمحتوى المترجم. يحافظ زر اللغة على معرف الخدمة أو الطلب أو الفاتورة المفتوحة. بعد التصحيح، تبقى السلة واللغة والقائمة ضمن رأس الصفحة في المقاسات الصغيرة التي جرى اختبارها، وتستخدم قائمة الجوال Bootstrap Collapse. بعد إضافة نصوصك الطويلة ومكوناتك الخاصة، أعد فحص الاتجاهين على الأجهزة المستهدفة.
الألوان والمظهر الفاتح والداكن
تعطي لوحات الألوان الأربع كل رئيسية شخصيتها، ويتيح زر المظهر استكشاف العرض الفاتح والداكن. تتجمع ألوان الخلفيات والأسطح والحدود والمسافات في ملف أنماط مشترك لتسهيل التخصيص. الاسم والشعار والمحتوى والصور والمكونات قابلة للتعديل، ولا تحتاج إلى الاشتراك في منشئ صفحات مستضاف.
ما الذي لا تتضمنه الحزمة؟
هذا منتج واجهات أمامية HTML وCSS وJavaScript. لا يتضمن نموذج ذكاء اصطناعي حيًا أو نظام حسابات آمنًا أو خدمة استعادة كلمات مرور أو بوابة دفع أو قاعدة بيانات طلبات أو إرسال بريد أو استضافة. صفحات الحسابات والسياسات نماذج قابلة للتعديل. عند إطلاق خدمة فعلية، جهز النظام الخلفي والحماية والمحتوى والسياسات المناسبة لنشاطك.
الفحص والتحسينات في الإصدار 1.1.1
عولج تجاوز رأس الصفحة على الجوال، وفقدان السلة داخل الديمو، وضياع معرف الخدمة عند تبديل اللغة، وظهور تعبيرات برمجية في صفحة الخدمة. فُحصت الصفحات المحلية عند عرضي 320 و1440 بكسل، وفُحصت الرئيسيات الثماني أيضًا عند 390 و768 و1024 بكسل: 296 حالة عرض دون تجاوز أفقي مسجل. وشملت التجربة داخل الإطار المعزول الخصم والطلب والتأكيد بالعربية والفاتورة، إضافة إلى ستة اختبارات لحالة البيانات. هذه نتائج بيئة Chromium المختبرة، وليست ادعاءً بالتوافق مع كل متصفح أو بشهادة وصول رسمية.
التثبيت والتخصيص خطوة بخطوة
- نزّل ملف المشتري وفك الضغط مع الحفاظ على ترتيب المجلدات. افتح index.html لاختيار الديمو، ويفضّل استخدام خادم HTTP محلي أثناء الاختبار.
- اختر index.html أو index-1.html أو index-2.html أو index-3.html داخل en أو ar. وللبداية بصفحة أبسط استخدم starter/index.html.
- عدّل الهوية والعناوين ووصف الخدمات والصور، وحافظ على اتساق اللغتين وحدّث النصوص البديلة للصور.
- اضبط متغيرات التصميم من assets/css/studio.css. ولإعادة توليد الصفحات المشتركة استخدم source/build.py وsource/commerce_extension.py، مع حفظ نسخة من تعديلات HTML المباشرة قبل البناء.
- عدّل source/create_commerce_catalog.py وشغّله لتوليد catalog.json وcommerce-data.js معًا. المتصفح يقرأ ملف JavaScript، لذلك لا يكفي تعديل JSON وحده.
- شغّل فاحص الملفات واختبارات حالة البيانات المرفقة، ثم افحص التنقل والنماذج على أجهزتك واربط الوظائف الحقيقية بالنظام الخلفي.
- ارفع الملفات القابلة للتشغيل إلى الاستضافة، واضبط النطاق الحقيقي وروابط canonical وhreflang وبيانات المشاركة وخريطة الموقع، واستبدل المحتوى التجاري والقانوني النموذجي.
جميع الصفحات المرفقة
الواجهات الرئيسية
- استوديو الإبداع الذكي —
index.html: مساحة إبداعية جديدة للأفكار الاستثنائية. - الوكلاء الذكيون والأتمتة —
index-1.html: حوّل سير العمل إلى عمليات ذكية متصلة. - المساعد الذكي والمحادثات —
index-2.html: محادثات ذكية تتمحور حول الناس. - وكالة الذكاء الاصطناعي —
index-3.html: أفكار واستراتيجيات وحلول ذكاء اصطناعي للأعمال.
عرض المميزات
- جميع المميزات —
features.html: اكتشف إمكانات الإبداع والمحادثة والأتمتة في مكان واحد. - مساحة المحادثة الذكية —
feature-chat.html: خطط ولخص واستكشف الإجابات في مساحة عمل مصممة بعناية. - إنشاء الصور بالذكاء الاصطناعي —
feature-image.html: حوّل الفكرة الأولى إلى اتجاهات بصرية ملهمة. - استوديو الفيديو الذكي —
feature-video.html: اصنع قصة متكاملة من لوحة المشاهد إلى الإطار الأخير. - استوديو الصوت الذكي —
feature-voice.html: تجارب صوتية تجمع الوضوح والشخصية وسهولة الوصول. - استوديو الكتابة الذكي —
feature-writing.html: من الصفحة البيضاء إلى محتوى متقن يحافظ على هويتك. - أتمتة سير العمل —
feature-automation.html: اربط المشغلات والإجراءات والموافقات في سير عمل واضح.
الحلول حسب القطاع
- الحلول حسب القطاع —
solutions.html: اكتشف مسارات ذكاء اصطناعي عملية تناسب كل فريق. - الذكاء الاصطناعي للتسويق —
solution-marketing.html: ابتكر أفكار الحملات والنصوص والتوجهات البصرية بشكل أسرع. - الذكاء الاصطناعي لصنّاع المحتوى —
solution-creators.html: وقت أكبر للإبداع ووقت أقل للمهام المتكررة. - الذكاء الاصطناعي للوكالات —
solution-agencies.html: انتقل بسلاسة من ملخص العميل إلى الفكرة ثم التسليم. - الذكاء الاصطناعي للتجارة الإلكترونية —
solution-ecommerce.html: اصنع قصص منتجات أقوى في مختلف قنوات البيع. - الذكاء الاصطناعي للفرق —
solution-teams.html: اجمع المعرفة والتعاون وسير العمل في بيئة واحدة.
التكاملات
- مكتبة التكاملات —
integrations.html: اكتشف كيف يمكن ربط أدوات فريقك وأنظمته. - تكامل Slack —
integration-details.html: نظّم المحادثات وتسليم المهام بين فرق العمل.
الأدوات والأوامر والمعرض
- مكتبة أدوات AI —
tools.html: تصفّح أدوات متخصصة لكل مهمة إبداعية. - تفاصيل الأداة: المصمم البصري —
tool-details.html: استكشف نموذج مساحة عمل لإنتاج التصاميم. - مكتبة الأوامر الذكية —
prompts.html: ابدأ بأوامر مصممة لسيناريوهات إبداعية حقيقية. - أمر ذكي: بناء قصة العلامة —
prompt-details.html: اصنع قصة علامة تجارية مميزة بخطوات مدروسة. - معرض القوالب الإبداعية —
templates.html: اكتشف توجهات إبداعية وهياكل حملات قابلة لإعادة الاستخدام. - تفاصيل القالب: إطلاق منتج —
template-details.html: اتجاه بصري متكامل لإعلان إطلاق منتج مميز.
الشركة والمحتوى
- عن الاستوديو —
about.html: نؤمن بالفضول والإتقان والابتكار المسؤول. - تعرّف على الفريق —
team.html: تعرّف على التخصصات التي تقف خلف منتجات AI المدروسة. - انضم إلى فريقنا —
careers.html: اكتشف فرص العمل التي تساهم في بناء منتجات أفضل. - تفاصيل وظيفة: مصمم منتجات —
career-details.html: صمّم تجارب رقمية مدروسة لفرق طموحة. - اتصل بالاستوديو —
contact.html: أسئلة أو أفكار أو تعاون؟ ابدأ من هنا. - الأمان والذكاء الاصطناعي المسؤول —
security.html: كيف نعرض الثقة والشفافية وإجراءات الحماية.
الأسعار والتواصل
- كيف يعمل؟ —
how-it-works.html: طريق واضح من فكرتك إلى نتيجتك التالية. - جولة تفاعلية في المنتج —
product-tour.html: جرّب جولة إرشادية للتعرّف على واجهات المنتج. - أسعار واضحة وبسيطة —
pricing.html: باقات تناسب نمو طموحك الإبداعي. - قارن جميع الباقات —
compare-plans.html: تعرّف على المزايا والحدود واختر ما يناسب فريقك. - احجز عرضًا توضيحيًا —
book-demo.html: تعرّف كيف يمكن للتجربة أن تناسب عمل فريقك. - تواصل مع فريق المبيعات —
contact-sales.html: احكِ لنا عن أهدافك لنختار الخطوة المناسبة. - قصص العملاء وحالات الاستخدام —
case-studies.html: اطلع على طرق عملية للتعامل مع التحديات الإبداعية. - دراسة حالة: ملخص إبداعي أسرع —
case-study-details.html: نموذج توضيحي لفريق إبداعي أكثر تنظيمًا.
المساعدة والموارد
- المدونة والمقالات —
blog.html: أفكار حول التصميم ومنتجات AI وأساليب التنفيذ. - تصميم تجارب أفضل بين الإنسان والذكاء الاصطناعي —
blog-details.html: دليل تحريري عملي لتصميم تجارب موثوقة وسهلة. - الأسئلة الشائعة —
faq.html: إجابات عن الأسئلة التي تطرحها الفرق أولًا. - المساعدة والتوثيق —
documentation.html: تصفّح أدلة واضحة وأمثلة لسير العمل. - دليل: أول مشروع إبداعي —
documentation-article.html: خطوات عملية من الفكرة إلى معاينة قابلة للمشاركة.
الحسابات والصفحات المساعدة
- مرحبًا بعودتك —
sign-in.html: واجهة معاينة لتسجيل الدخول إلى منتجك المستقبلي. - أنشئ حسابك —
sign-up.html: واجهة تسجيل جاهزة لربطها بخادمك. - استعادة الحساب —
forgot-password.html: واجهة واضحة لاستعادة كلمة المرور. - تعيين كلمة مرور جديدة —
reset-password.html: نموذج جاهز للربط بمنظومة الحسابات الحقيقية. - انضم لقائمة الوصول المبكر —
waitlist.html: كن أول من يعرف عند إطلاق الجديد. - الصفحة غير موجودة —
404.html: الرابط المطلوب غير موجود أو تم نقله. - شيء مميز قادم قريبًا —
coming-soon.html: صفحة إطلاق قريب فاخرة لمشروعك القادم.
نماذج السياسات
- نموذج سياسة الخصوصية —
privacy.html: هيكل مبدئي لسياسة خصوصية تراجعها قانونيًا. - نموذج الشروط والأحكام —
terms.html: نقطة انطلاق منظمة لإعداد شروط استخدام خدمتك. - نموذج سياسة ملفات الارتباط —
cookies.html: اشرح ملفات الارتباط والموافقة عليها بوضوح للزوار. - نموذج سياسة الاسترداد والإلغاء —
refund-policy.html: وضّح التسليم الرقمي والتجديد والاسترداد وآلية الاعتراض قبل البيع.
التجارة والتخطيط للمشروعات
- الخدمات والمنتجات الرقمية —
services.html: تصفح باقات نموذجية وقارن نطاق العمل وأضف الخدمات إلى السلة. - تفاصيل الخدمة —
service-details.html: راجع المخرجات ونطاق الخدمة والمراحل والسعر النموذجي. - سلة المشتريات —
cart.html: راجع المنتجات والكميات ودورات الفوترة والكوبونات قبل الدفع. - معاينة إتمام الطلب —
checkout.html: تجربة إتمام طلب أمامية متكاملة دون خصم مالي أو جمع بيانات بطاقات. - تأكيد الطلب التجريبي —
order-confirmation.html: راجع الطلب التجريبي وتعرف على الخطوة التالية. - طلباتي —
my-orders.html: تابع طلبات العرض المحفوظة محليًا وحالاتها. - تفاصيل الطلب —
order-details.html: اطلع على الخدمات والإجماليات والتسلسل الزمني للطلب التجريبي. - فواتيري —
invoices.html: اعرض سجلات فوترة توضيحية أنشئت داخل متصفحك. - تفاصيل الفاتورة —
invoice-details.html: فاتورة تجريبية قابلة للطباعة مع مبالغ وعلامات توضيحية واضحة. - إدارة الاشتراكات —
subscriptions.html: عاين ملخص الاشتراك ودورة التجديد والإيقاف. - حاسبة عرض سعر المشروع —
quote-estimator.html: قدّر تكلفة مشروع إبداعي حسب نطاق العمل وصدّر مسودة. - إنشاء موجز مشروع —
project-brief.html: حوّل الطلب غير الواضح إلى موجز مشروع منظم قابل للتنزيل. - مركز طلبات الدعم —
support-center.html: اعثر على إجابات وجهّز طلب دعم واضحًا للفريق.
الترخيص والاستخدام
يغطي الترخيص مشروعًا نهائيًا واحدًا، بما يشمل العربية والإنجليزية وأيًا من العروض الأربعة. يمكنك تخصيص القالب لك أو لمؤسستك أو لعميل واحد، ومشاركة المصدر بشكل خاص مع فريق المشروع. لا يجوز إعادة بيع الملفات أو توزيعها مجانًا أو نشرها كمنتج قوالب منافس قابل لإعادة الاستخدام. كل مشروع مستقل إضافي يحتاج إلى ترخيص آخر. راجع LICENSE.txt وإشعارات المكتبات للاطلاع على الشروط الكاملة.
استكشف الحزمة الكاملة
تصفّح صفحة المنتج والديموهات واحصل على الحزمة العربية والإنجليزية كاملة بسعر 7 دولارات.