البناء
اللوحة
المعاينة والتعليمات البرمجية، وعرض الجوال والجهاز اللوحي، والإصدارات، والتراجع والإعادة، وشريط المقارنة بين قبل وبعد، والمعاينة بلغات أخرى.
اللوحة هي المسودة الحية التفاعلية. انقر واكتب ومرّر فيها كما تفعل في صفحة حقيقية. ويضم الشريط أعلاها الأدوات الواردة في هذه الصفحة.
المعاينة والتعليمات البرمجية
- تعرض المعاينة الشاشة العاملة.
- تعرض التعليمات البرمجية تعليمات React البرمجية للإصدار الموجود على اللوحة. وهي للقراءة فقط؛ اختر نسخ التعليمات البرمجية لنسخها.

عرض سطح المكتب والجهاز اللوحي والجوال
استخدم أزرار الأجهزة الثلاثة لعرض المسودة بالعرض الكامل، أو بعرض 768 بكسل (جهاز لوحي)، أو 390 بكسل (جوال). وتظهر عندما تتسع اللوحة لها.

يعرض كل المقاسات، وهو الزر التالي لزر الجوال، المسودة بعرض الجوال والجهاز اللوحي وسطح المكتب جنبًا إلى جنب، وكل منها صفحة حية مصغّرة لتتسع. ينطبق الوضع الفاتح أو الداكن ولغة المعاينة على الثلاثة، فتتحقق من لغة ما بكل العروض في آن واحد. للتحديد أو القياس أو إضافة تعليق توضيحي، عُد إلى عرض واحد.

قياس المسافات
اختر قياس المسافات (أيقونة المسطرة) لتتحقق من المسافات كما تفعل في أداة تصميم. ويمكنك أيضًا الضغط مطولًا على Alt (أو Option على Mac) فوق اللوحة دون تشغيل الميزة.
- مرِّر المؤشر فوق عنصر لترى مساطر حمراء على جوانبه الأربعة، مع المسافات بالبكسل. فإلى الأعلى والأسفل واليسار واليمين، تصل كل مسطرة إلى أقرب عنصر على امتدادها، أو إلى حافة الحاوية التي تضمه إن لم يكن بينهما شيء. ويعرض العنصر أيضًا عرضه وارتفاعه.
- انقر عنصرًا للقياس منه، ثم مرِّر المؤشر فوق عنصر آخر لترى المسافات بينهما. ومرِّر المؤشر فوق الحاوية التي تضمه لترى الهوامش الداخلية الأربعة.
- على شاشة اللمس، اضغط عنصرًا ثم عنصرًا آخر.
- اضغط Esc لإفلات العنصر الذي نقرته، ثم اضغطه مرة أخرى لإيقاف القياس.
المسافات هي وحدات بكسل CSS في المسودة، بما فيها الحدود، لذلك لا يغيّرها حجم اللوحة. وفي أثناء القياس، لا تضغط النقرات على الأزرار ولا تفتح الروابط.

إعادة التحميل
بعد التنقل داخل مسودة، يعيدها زر إعادة تحميل اللوحة إلى شاشتها الأولى. ويظل معطّلًا حتى تتفاعل مع المسودة.
الإصدارات
تُحفظ كل مسودة في الجلسة بوصفها إصدارًا. وعند وجود أكثر من إصدار، يعرض الشريط عدّادًا مثل 2/2 مع زري التراجع والإعادة.
- يعرض تراجع الإصدار السابق، وإعادة الإصدار التالي. ويمكنك أيضًا الضغط على ⌘+Z و⌘+Shift+Z (Ctrl في Windows) عندما لا تكتب في حقل. يتبدّل الإصدار دون إعادة تحميل مساحة العمل.
- يعدّل طلبك التالي الإصدار الموجود على اللوحة أيًّا كان، لذا يمكنك الرجوع واتخاذ اتجاه مختلف.
- يحتفظ النموذج الأولي المحفوظ بما يصل إلى أحدث 20 إصدارًا منه.
مقارنة الإصدارات
اختر مقارنة الإصدارات لعرض إصدارين جنبًا إلى جنب مع شريط تمرير بينهما. ويُمرَّر الجانبان معًا.

- اختر أي إصدارين من قائمتي قبل وبعد.
- اسحب الفاصل، أو ضع التركيز عليه واستخدم مفاتيح الأسهم (اضغط باستمرار على Shift لخطوات أكبر، وHome وEnd للوصول إلى الحافتين).
- يضع العودة إلى «قبل» إصدار «قبل» على اللوحة، ليعدّله طلبك التالي.
- اختر تم أو اضغط Esc للخروج.
المعاينة الفاتحة والداكنة
عندما تستخدم المسودة إحدى سمات الألوان لديك، يظهر زر الوضع الداكن لتتحقق من الوضعين. ولا يغيّر هذا سوى المسودة، وليس Vibr.
المعاينة بلغة أخرى
يعرض زر لغة المعاينة (أيقونة الترجمة) المسودة بلغة أخرى، لترى مدى صمود تصميمك قبل أن يترجمه أحد فعليًا. اختر من بين أكثر من 40 لغة، منها العربية والعبرية اللتان تُقرآن من اليمين إلى اليسار. يتغير نص المسودة والنصوص النائبة والتسميات، وتضبط الصفحة لغتها واتجاهها بما يطابقها. لا تتغير تعليماتك البرمجية، وتظل اللغة مفعّلة في أثناء البناء.
- نموذجك يتولى الترجمة. يرسل Vibr النص المرئي في المسودة إلى النموذج الذي اخترته، باستخدام مفتاحك، بضع عشرات من السلاسل النصية في كل مرة. ويُترجم النص الجديد، مثل عدّاد يتزايد، فور ظهوره. وتُترجم كل سلسلة نصية مرة واحدة في كل جلسة.
- من اليمين إلى اليسار. تستخدم المسودات الجديدة خصائص منطقية، مثل
marginInlineStart، تنعكس تلقائيًا. وعند تفعيل العربية أو العبرية، تبحث مراجعة التصميم أيضًا عن الأنماط التي تستخدم اليسار أو اليمين وعن الأسهم التي لن تنعكس، ويصلحها «الإصلاح» قبل عرض المسودة. أما المسودة التي أُنشئت قبل التبديل فيظهر لها إشعار بدلًا من ذلك، مع زر إصلاح للاتجاه من اليمين إلى اليسار. - لا يحتاج خيار زائفة إلى نموذج. فهو يضيف علامات إلى كل حرف ويجعل النص أطول بنحو 40%، كما يحدث غالبًا في الألمانية أو الفنلندية، فتظهر التسميات المقصوصة والعروض الثابتة فورًا.
- النماذج لا تحتاج إلى مفتاح. تأتي النماذج بكل لغات Vibr، لذا تعمل معاينة أحدها بأي منها، ومنها العربية والعبرية، دون مفتاح. أما اللغات الأخرى والنص الذي تضيفه إلى نموذج فيترجمها نموذجك.
- التصدير بتلك اللغة. عند تفعيل لغة، تضيف قائمة «تصدير» الخيار تطبيق باللغة المختارة. تُفتح الصفحة المُصدَّرة بتلك اللغة وباتجاهها، وتترجم أيضًا بقية نصوص المسودة، مثل علامات التبويب ومربعات الحوار الأخرى. أما عمليات التصدير الأخرى فتحتفظ بالنص الأصلي للمسودة.
- الخطوط. إذا كان خط استوردته لا يحتوي على حروف اللغة، يذكر إشعار بعض الحروف الناقصة ويقترح خطوطًا مشابهة من Google Fonts تحتويها. يضيف استخدام… أحدها إلى سلّم خطوط الخط بديلًا، فتحمّله اللوحة والتطبيقات المصدّرة.
- اختر النص الأصلي للمسودة للعودة.

الروابط في اللوحة
لا تغادر الروابط اللوحة، لذا لا يمكن أن تفقد مسودتك بالنقر على أحدها. بدلًا من ذلك، يخبرك Vibr بوجهة الرابط. أما التطبيق المُصدَّر فيتبع روابطه. وتعمل الأزرار التي تفتح شاشة محفوظة أخرى مع تشغيل؛ راجع التدفقات.
على الجوال
على الشاشات الصغيرة، يعرض Vibr المحادثة والمعاينة كعلامتي تبويب. وتعني النقطة على «المعاينة» وجود مسودة جديدة لم ترها بعد. وتنتقل الأدوات التي لا تتسع أعلى اللوحة إلى قائمة الإجراءات. وإذا لم تتسع كل الأدوات أعلى اللوحة، فاسحبها جانبًا.