> ## Documentation Index
> Fetch the complete documentation index at: https://docs.flowstep.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# إنشاء شاشات واجهة المستخدم من موجهات نصية باستخدام Flowstep

> استخدم Flowstep لإنشاء شاشة واحدة أو حتى 6 شاشات في المرة الواحدة من موجّه نص واحد — مثالي لإدراج واجهات المستخدم بسرعة واستكشاف التدفقات الكاملة.

<iframe src="https://www.youtube.com/embed/hHNwjKz_264" title="YouTube video player" frameborder="0" className="w-full aspect-video rounded-xl" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen />

Flowstep ينشئ شاشات واجهة المستخدم من موجهات اللغة الطبيعية، مما يتيح لك الانتقال من الفكرة إلى التصميم البصري في ثوان. سواء كنت بحاجة إلى شاشة واحدة للتحقق من صحة مفهوم ما أو مجموعة كاملة من الشاشات التي تغطي رحلة المستخدم بأكملها، فإن موجّه مكتوب جيدًا هو كل ما تحتاجه للبدء.

## إنشاء تصميم

<Steps>
  <Step title="فتح مشروع جديد">
    من لوحة Flowstep الرئيسية، أنشئ مشروعًا جديدًا أو افتح مشروعًا موجودًا حيث تريد إضافة شاشات.
  </Step>

  <Step title="اكتب موجّهك">
    اكتب وصفًا للشاشة أو الشاشات التي تريدها. كن محددًا بشأن نوع التطبيق والهدف الذي يريده المستخدم والمحتوى الذي تتوقع أن تراه.
  </Step>

  <Step title="حدد عدد الشاشات التي تريدها">
    بشكل افتراضي، Flowstep ينشئ شاشة واحدة. إذا كنت تريد عدة شاشات، اذكر ذلك بوضوح في موجّهك — يمكن لـ Flowstep إنشاء ما يصل إلى 6 شاشات من موجّه واحد.
  </Step>

  <Step title="إنشاء">
    أرسل موجّهك. Flowstep ينشئ شاشاتك ويعرضها في المحرر، جاهزة للمراجعة أو التحسين.
  </Step>
</Steps>

## شاشة واحدة مقابل عدة شاشات

يمكنك إنشاء شاشة واحدة أو حتى 6 شاشات من موجّه واحد. كلا الأسلوبين مناسب لمراحل مختلفة من عمل التصميم.

* **شاشة واحدة** — الأفضل لاستكشاف حالة واجهة مستخدم محددة أو مكون أو مفهوم مركّز.
* **عدة شاشات** — الأفضل لرسم خريطة التدفقات أو مقارنة خيارات التخطيط أو تغطية رحلة المستخدم كاملة بسرعة.

عندما تريد عدة شاشات، كن صريحًا في موجّهك. Flowstep يستخدم صيغة موجّهك لتحديد عدد الشاشات المراد إنتاجها، لذا الموجهات الغامضة عادة ما تُرجع شاشة واحدة. يتم تسمية الشاشات المُنتجة **Screen 1** و **Screen 2** وما إلى ذلك — استخدم هذه الأسماء للإشارة إلى شاشة محددة في الموجهات اللاحقة.

## طرق أكثر للموجهات

النص ليس المدخل الوحيد. يمكنك أيضًا:

* **إرفاق ملفات** — أضف صورًا (JPG أو PNG أو WEBP) أو مستندات (PDF أو MD أو TXT) بحجم يصل إلى 3 ميغابايت لكل منها إلى الموجّه، عبر السحب والإفلات أو منتقي الملفات أو بالعصق. ارجع إلى صورة مرفقة في موجّهك وسيدمجها Flowstep في الشاشات المُنتجة. انظر [استخدام المراجع](/ar/design-references).
* **إملاء موجّهك** — انقر فوق زر الميكروفون في شريط الموجّه (أو اضغط على **Cmd+Shift+V** على Mac أو **Ctrl+Shift+V** على Windows) وتحدث لمدة تصل إلى 60 ثانية. يتم إضافة النسخة المحررة إلى أي شيء كتبته بالفعل.
* **دع Flowstep تبحث على الويب** — عندما يتطلب موجّهك ذلك (على سبيل المثال، "استنساخ صفحة تسعير Stripe")، يمكن لـ Flowstep البحث على الويب وقراءة علامات التميز الخاصة بالصفحة — الألوان والخطوط والشعار ومكونات واجهة المستخدم — واستخدامها في الشاشات المُنتجة. Flowstep يقرر بمفردها ما إذا كانت ستبحث، لذا لن تؤدي بالضرورة إلى تفعيل كل موجّه؛ لاحظ أن المواقع المعاد إنشاؤها تستخدم صورًا وتنقلًا مختلفًا عن الأصلي.
* **تعيين إرشادات التصميم** — حدد قواعد الأسلوب الدائمة التي تنطبق على كل جيل في الملف. انظر [إرشادات التصميم](/ar/design-guidelines).

## كتابة موجهات فعالة

<Tip>
  **مثال موجّه شاشة واحدة:** "صمم شاشة تسجيل دخول للجوال لتطبيق تتبع اللياقة البدنية يحتوي على حقول البريد الإلكتروني وكلمة المرور وزر تسجيل الدخول ورابط نسيان كلمة المرور."
</Tip>

<Tip>
  **مثال موجّه متعدد الشاشات:** "أنشئ عدة شاشات لسير العمل الخاص بتطبيق توصيل الطعام — غطِّ اختيار تفضيلات المطبخ وإدخال عنوان التوصيل وتأكيد الطلب الأول."
</Tip>

<Tip>
  **مثال موجّه الرحلة الكاملة:** "غطِّ رحلة المستخدم الكاملة في تطبيق الإبلاغ عن النفقات، من إرسال الإيصال إلى موافقة المدير."
</Tip>

ضع هذه المبادئ في الاعتبار عند كتابة الموجهات:

* سمِّ المنصة (الجوال أو سطح المكتب أو الجهاز اللوحي) حتى يقيّس Flowstep الشاشات بشكل صحيح.
* صف هدف المستخدم، وليس فقط عناصر واجهة المستخدم — يستنتج Flowstep التخطيط من القصد.
* قم بتضمين المحتوى الرئيسي مثل التسميات أو الإجراءات أو البيانات إذا كانت تهم التصميم.
* استخدم عبارات مثل "إنشاء عدة شاشات" أو "تغطية رحلة المستخدم الكاملة" لتفعيل مخرجات متعددة الشاشات.