ساعدونا في اختبار إعادة تصميم Composer

[chapoi]

الأهداف

لقد قمنا بالتسريع في إجراء تغييرات تحضيرية صغيرة مثل نقل مفتاح معاينة، دمج اقتراحات الذكاء الاصطناعي، إضافة صور GIF إلى شريط الأدوات، والآن نحن مستعدون لمحاولة التغيير الأكبر الذي يمكن تجربته كتغيير تجريبي قادم.

أهدافنا الرئيسية هي:

1. تحديث محرر النصوص (Composer) بما يتماشى مع تغييراتنا العامة لتحديث مظهرنا وشعورنا

2. تحسين تجربة الكتابة على الأجهزة المحمولة

نحب أن نساعدنا في اختباره قبل أن يتقدم أكثر.

كيفية تجربته

1. انتقل إلى الإدارة → التغييرات القادمة في /admin/config/upcoming-changes
2. ابحث عن إعادة تصميم المحرر وقم بتفعيله
3. افتح المحرر (رد، موضوع جديد، أو رسالة جديدة) وجربه على كل من سطح المكتب والجوال

يمكنك إيقافه في أي وقت من نفس المكان. هنا على Meta يمكنك الانضمام إلى مجموعة الاختبار الجديدة composer-testers.

---

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

ما الذي تغير

التخطيط والهيكلية

عام

• تم دمج العنوان في المحتوى، مما يجعله يبدو أكثر مثل عنوان المستند (يجب أن يجد مستخدمو Notion هذا مألوفاً)
• تم نقل شريط الأدوات إلى التذييل. سيستغرق هذا بعض التعديل في الذاكرة العضلية (لقد أزعجني أيضاً في الأيام الأولى )
• إعادة تصميم مدخلات الفئة والوسوم (بما في ذلك أيقونة الوسم وعرض اختيار بسيط)
• حدود أقل، وشعور أكثر اتساعاً

Markdown

• العنوان والفئة والوسوم الآن موجودة في منطقة بيانات كاملة العرض فوق لوحة التحرير + المعاينة، بدلاً من أن تكون مقيدة بالعمود الأيسر.

الجوال

عامل دافع كبير جداً لهذا المشروع هو محاولة تحسين تجربة الجوال. كانت هناك وفرة من الشكاوى المبررة حول هذا الأمر على Meta على مر السنين ^{[1] [2] [3]}.

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

هذا يضاعف مساحة الكتابة المتاحة أكثر من مرة، من 103 بكسل إلى 212 بكسل (عند الاختبار على جهازى – قد تختلف النتائج الفعلية).

أخرى

• تم إزالة مفتاح تبديل شريط الأدوات في التخطيط الجديد
• اسحب للأسفل لإغلاق لوحة المفاتيح وطي المحرر مرة أخرى إلى الوضع الطبيعي
• الوسوم المختارة مرئية فقط عند فتح القائمة. يتم تلوين الأيقونة للإشارة إلى أن الاختيار قد تم.

الملاحظات

هذا لا يزال تجريبياً للغاية وأنا مهتم بشكل رئيسي بمعرفة كيف يعمل على أحجام الشاشات العادية (سطح المكتب والجوال) على Foundation. لم يتم تحسين الأجهزة اللوحية، والهواتف القابلة للطي، والسمات الأخرى، وما إلى ذلك بعد.

دعوة مؤلفي السمات والإضافات

إذا كنت تتصل بفتحات إضافات المحرر أو تنسق المحرر، يرجى الاختبار مع تمكين إعادة التصميم. تم نقل DOM، وقد تحتاج بعض التخصيصات إلى تعديل:

• كتلة حقول المحرر الآن تُعرض كـ طفل كامل العرض لحاوية المحرر، لم يعد داخل عمود نص المحرر
• المحتوى المُحقن في فتحة composer-fields يظهر الآن فوق العنوان (بين مجموعة الفئة/الوسوم والعنوان)، كامل العرض
• حقل العنوان يُعرض كصف خاص به، منفصل عن مجموعة الفئة/الوسوم وتحتها بدلاً من فوقها

لم يتم إعادة تسمية أو إزالة أي فتحات (على الرغم من أنه قد يتم ذلك لاحقاً للتعديل الدلالي للتغييرات) — ستظل متصلاتك متصلة. ما تغير هو أين و كم عرضاً يظهر محتواك.

إذا لاحظت شيئاً معطلاً في سماتك أو إضافتك، يرجى الرد هنا باسم المكون/الإضافة ولقطة شاشة. هذه الملاحظات هي بالضبط ما تهدف إليه مرحلة الاختبار هذه.

التصميم

إليك بعض المقايضات أو قرارات التصميم المحددة التي أتردد فيها بنفسي والتي يمكن أن تحتاج إلى بعض المدخلات. كل شيء آخر مرحب به أيضاً بالطبع.

أ) لماذا مدخل العنوان كبير جداً؟

فكرة الأمر هي أنه مُرفع إلى حجم أكبر من H1 المضاف يدوياً، لضمان أنه دائماً العنوان المرئي في المستند. أحياناً أنظر إليه وأفكر “قبيح”، وأحياناً أخرى أقول “نعم، هذا يعمل”.

فكرة أخرى هي تصغير العناوين الحالية قليلاً، لتحقيق نفس التأثير.

ب) هل الوسوم المخفية مشكلة…

…كبيرة بما يكفي لتكون غير تستحق المقايضة على الجوال (مساحة أكبر للفئة).

إذا كان الأمر كذلك، لماذا؟

ج) كيف تعمل الرسوم المتحركة للمحرر القابل للتوسع على جهازك؟

هل هو متعثر؟ جيد بما يكفي؟ تحسين؟ أفكار بديلة أو تعديلات لجعله أفضل؟

د) ماذا عن زر اقتراح العنوان بالذكاء الاصطناعي؟

أنا لا أحب بشكل مفرط كيف يطفو وحيداً هناك. كيف يشعر الآخرون (الذين يستخدمونه)؟ منفتح جداً لسماع أفكار التصميم.

---

شكراً لمساعدتنا في جعل هذا صحيحاً قبل أن يُطلق على نطاق أوسع.

---

1. New Topic Editor Too Small iOS 26.5 Safari Web - #4 by fearlessfrog ↩︎

2. Creating/Editing a post on mobile: let's discuss the 2026 Discourse experience ↩︎

3. Such a tiny window to edit here on a cell phone ↩︎

[darkpixlz (Pyx)]

@chapoi

أ) لماذا حقل إدخال العنوان كبير بهذا القدر؟

نعم، بصراحة، لا أرى أن وضعه قرب منطقة النص وعدم جعله صندوقًا منفصلًا في الوقت الحالي فكرة جيدة… نظريًا يبدو الأمر جيدًا، لكنني ببساطة لا أحب مظهره الحالي، فهو يبدو وكأنه جزء من حقل إدخال النص الذي بدأته، خاصة في المحرر المرئي. كنتُ أفضل إبقائه في مكانه المعتاد، ربما مع بعض المساحة الأفقية الإضافية. قد يكون هذا رد فعل مبدئيًا على مجرد رؤيته متغيرًا لأنه كان جيدًا بما فيه الكفاية ولم يكن بحاجة حقيقية إلى التغيير، لكن بناءً على ما رأيته، ما زلت غير متأكد مما إذا كنتُ أعجبه أم لا.

@chapoi

ماذا عن زر اقتراح العنوان بالذكاء الاصطناعي؟

لقد كنتَ محقًا تمامًا في أنه يبدو وحيدًا الآن. ربما ينبغي أن يثبت نفسه مباشرة حيث ينتهي العنوان، أو إذا تم التراجع عن التصميم كما اقترحت، فإن الطريقة القديمة تعمل بشكل جيد.

أنا بالتأكيد من المعجبين بهذا. يبدو التصميم رائعًا (حدود أقل!) وأنا متحمس لأن تجربة الهاتف المحمول أصبحت أخيرًا قابلة للاستخدام، حتى لو كنتُ لا أزال أستخدم الكمبيوتر المكتبي بشكل أساسي.

[Don]

مرحباً

هذا عمل رائع حقاً! أحببته. يبدو وكأنه أسلوب أكثر حداثة وأناقة للتأليف. كما حاولتُ في الماضي نقل شريط الأدوات إلى الأسفل، وأعتقد أن هذا الأسلوب أكثر راحة.

بشكل عام، يبدو التصميم نظيفاً جداً. ملاحظة واحدة لاحظتها: عندما يختفي العنوان وتصبح منطقة النص هي التي تركز، قد يكون من المربك كيفية إعادة قسم العنوان والفئة وما إلى ذلك إلى الواجهة. نظراً لأن منطقة النص بأكملها قابلة للسحب في هذه الحالة، أعتقد أن إضافة مقبض بصري يمكن أن يساعد في توضيح ذلك للمستخدمين.

[NateDhaliwal]

هل كان هذا مستوحى من العمل على مُركب الرسائل الذكي المثبت؟ يذكرني بذلك.

يبدو أن هذا متاح فقط على “Meta Branded”؟

أعجبني أن الأيقونات أصغر (أعتقد؟) وتصميمها أكثر بساطة.

لكن أعتقد أن الأمر هو أنني الآن مضطر للنظر إلى أعلى لرؤية ما أكتبه، لأن الشريط يعترض الطريق. ماذا لو كان شريط الأدوات في الأعلى؟ هل يمكن أن يعمل ذلك؟ (أستخدم هاتفي الآن لذا لا يمكنني تحريكه لأرى النتيجة)

[chapoi]

@NateDhaliwal

هل كان هذا مستوحى من العمل على محرر الرسائل المثبت لرسائل الذكاء الاصطناعي؟ يذكرني بذلك.

ليس حقاً

@NateDhaliwal

يبدو أن هذا متاح فقط على Meta Branded؟

لا، يجب أن يكون مستقلاً عن السمة. ألا تراه على السمات الأخرى؟

[NateDhaliwal]

حسنًا، بعد البحث قليلاً أكثر، هل من الممكن إخفاء محرر محتوى الموضوع عند إغلاق لوحة المفاتيح؟ وإلا فسيكون ذلك يتطلب ضغطتين (واحدة على زر لوحة المفاتيح، وأخرى للسحب).

كما أجد أيقونات الفئات عديمة الألوان غريبة بعض الشيء. هل هذا مقصود؟

ونعم، فإن ميزة اقتراح عناوين الذكاء الاصطناعي تجعل المكان يبدو مزدحمًا قليلاً، لكنني لست متأكدًا من أين يمكن وضعها بدلاً من ذلك.

@chapoi

لا تراها على السمات الأخرى؟

كان يحدث ذلك لفترة قصيرة في البداية. يبدو أنه يعمل الآن.

بشكل عام، ليس سيئًا للغاية على الهاتف المحمول حتى الآن!

[chapoi]

@NateDhaliwal

هل من الممكن إخفاء محرر محتوى الموضوع عند إغلاق لوحة المفاتيح؟ وإلا، فسيحتاج الأمر إلى ضغطين (واحد على زر لوحة المفاتيح، وواحد للسحب).

هل يمكنك توضيح ذلك أكثر؟ كيف تقوم بإغلاق لوحة المفاتيح؟ يجب أن يكون الاتجاه الآخر تلقائيًا: تصغير المحرر → إغلاق لوحة المفاتيح تلقائيًا، لذا يتطلب ذلك إجراءً واحدًا فقط.

[NateDhaliwal]

أوه! هل تقصد السحب للأسفل لإغلاق مُكوّن المحتوى و لوحة المفاتيح؟ ههه…

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

[chapoi]

فهمت ذلك، أعتقد أنه سيكون من الآمن توصيل الأسلاك.

[chapoi]

@NateDhaliwal

أجد أيضًا أن أيقونات الفئات عديمة اللون غريبة بعض الشيء. هل هذا مقصود؟

خطأ غير مقصود، شكرًا! سيتم إصلاحه قريبًا

[asa]

لقد لاحظت أنه عند إنشاء مسودة، تظهر دائمًا عند الدخول إلى موضوع، بينما لا يحدث ذلك مع محرر النصوص. هل هذا متعمد؟ (هذا يزعجني بعض الشيء)

[chapoi]

أنا لست متأكدًا من فهمي. هل تقصد أنه عندما يكون لديك مسودة لموضوع معين، وعند دخولك إلى ذلك الموضوع، يفتح محرر النصوص؟ إذا كان الأمر كذلك، فهذا كان الحال منذ فترة طويلة (أو دائمًا، لست متأكدًا)؛ لم يتم تغيير أي سلوك (عن قصد) في أي حال.

أم أنك تقصد شيئًا آخر؟

[asa]

لقد أخطأت قليلاً. في الواقع، المكوّن الحالي (Composer) مفتوح، لكنه يبقى إلى حد ما في الخلفية، بينما المكوّن الجديد “يحجب الرؤية”.

لكنني اكتشفت الآن أنه يمكن تحريك هذا المكوّن

[Canapin (Coin-coin le Canapin)]

أعجبني، لكنني نشرت من سطح المكتب فقط حتى الآن.

لا أحب عنوان H1 الذي يبدو وكأنه جزء من مربع النص. وجدت نفسي أنقر في نهاية العنوان، ثم أضغط على ↓ للانتقال إلى السطر التالي، وبطبيعة الحال لم ينجح الأمر.

يمكن إخفاء العناوين الكبيرة جزئيًا:

على الهاتف المحمول، تكون شريط الأدوات ضيقًا جدًا. طريقة تحرك الإبهام بشكل طبيعي من اليسار إلى اليمين على شاشة الهاتف الذكي ليست خطًا أفقيًا مستقيمًا. بل هي منحنية قليلاً من الزاوية اليمنى السفلية إلى الزاوية اليمنى العلوية، وقد يزداد هذا التأثير إذا كانت منطقة الهدف عالية على الشاشة.

هذا يميل إلى جعلني أخطئ في زر سحب الشريط الجانبي.

لست متأكدًا من كيفية تحسين ذلك. يبدو أن جعل شريط الأدوات أعلى ليس أفضل حل.

ربما يمكن أن تكون منطقة الكشف أكبر قليلاً من شريط الأدوات، بنفس الطريقة التي يسمح فيها مطورو ألعاب المنصات للشخصية بالقفز من حافة أو الهبوط عليها حتى لو كانت بضع وحدات بكسل بعيدة جدًا وكانت من المفترض أن تسقط عادةً.

[Shauny (Shaun Robinson)]

ما هو سبب نقل الأزرار إلى الأسفل؟

يبدو أن هذا سيُشكّل مشكلة كبيرة للذاكرة العضلية، ولكن لأية غاية؟

إضافةً إلى ذلك، فهي قريبة من زري «تجاهل» و«رد» على الأجهزة المحمولة، مما سيؤدي إلى منشورات غير مقصودة.

ببساطة، لا أرى أي فائدة تُبرّر حجم المشكلات التي سيُسببها هذا التغيير.

[satonotdead]

@Shauny

ما هو سبب نقل الأزرار إلى الأسفل؟

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

أنا معجب بهذه التغييرات، وأعتقد أننا بحاجة إلى بعض الوقت للتأقلم معها. أعني، تجربة التغيير لمدة أسبوع أو أسبوعين على الأقل، لأن الأشياء التي نفعلها تلقائيًا تميل إلى التفاعل بشكل سلبي عند مواجهة تغيير مفاجئ، ولكن بمجرد أن نتعود على النظام الجديد، قد تكون النتيجة الإجمالية إيجابية.

كملاحظة جانبية، كنتُ أحد الأشخاص الذين لم يريدوا شاشة لمس في هاتفي الخلوي

[David_Ghost]

مثير للاهتمام. كنت في الواقع أستخدم TC لوضع القائمة في الأسفل. تغيير رائع.

[Don]

@Shauny

ما هو السبب وراء نقل الأزرار إلى الأسفل؟

بالنسبة لي، أحد الأسباب الرئيسية لنقل شريط الأدوات إلى الأسفل.

@Don

تغطي قائمة السياق شريط أزرار المحرر.

[Canapin (Coin-coin le Canapin)]

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

أعتقد أنه منطقي أيضاً على أجهزة الكمبيوتر: المحتوى (مربع النص) هو الأولوية، يليه التنسيق (شريط الأدوات)، لذا فإن الترتيب مناسب.

[Heliosurge (Dan DeMontmorency)]

المظهر والشعور به ليسا سيئين على الهاتف المحمول. ومع ذلك، يمكن ربما تكبير أيقونة العلامة عند إنشاء موضوع قليلاً، إذ إنها تبدو صغيرة بعض الشيء على الأقل في هاتفي Google Pixel 9 XL.