The Expected (and Unexpected) Benefits of Building with Block Kit

أدى Block Kit الجديد من Slack إلى تجربة أكثر كفاءة لكل من مستخدمي تطبيق Guru وفريق Guru. الآن، أصبح استخدام تطبيق Guru لـ Slack أسهل من أي وقت مضى. اكتشف كيفية استفادة فريقنا في Guru من عرض Block Kit من Slack.
جدول المحتويات

تم كتابة هذه المقالة لمدونة منصة Slack. اقرأ الإدخال الأصلي هنا.

بدأت تكامل Guru مع Slack في الأيام الأولى من الروبوتات، حيث كانت التجربة تعتمد في الغالب على النص، وقد نمت في الوظائف مع إدخال Slack لميزات أكثر — مثل الرسائل التفاعلية وإجراءات التطبيقات. رأينا على الفور فوائد Block Kit، وهي فرصة لبناء تجارب عميقة وغنية يتوقعها مستخدمونا، مع أنماط واجهة مستخدم/تجربة مستخدم أكثر شيوعًا ومحتوى تفاعلي. ومع ذلك، ما لم نتوقعه هو كيف سيغير Block Kit طريقة تعاون فرق التطوير والتصميم لدينا.

slack-and-guru.png

بناء تجربة إدخال أفضل

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

  • من خلال استخدام الفواصل، قمنا بتصميم ذلك الجدار من النص المعلوماتي عن طريق تجميع المحتوى المماثل - مما جعله أكثر سهولة في الاستيعاب وأسهل قراءة.
  • سمحت الأزرار المتداخلة وقوائم التدفق بتجربة إدخال تفاعلية وموجهة نحو الإجراءات. الآن لا يحتاج المستخدمون إلى كتابة الأوامر الرئيسية؛ يمكنهم ببساطة اختيار الزر واتخاذ إجراء بسرعة.
Guru%20help%20menu%20in%20Slack.png

كانت قائمة المساعدة هي مكان واحد فقط حيث يرتقي Block Kit بتجربة تطبيق Guru. تجلب الأزرار المتداخلة في واجهة تغذية الأنشطة دعوة للعمل أقرب إلى المعلومات المقابلة. تخفي قوائم التدفق الآن الأفعال التي تستخدم بشكل أقل، وتساعد المستخدم على التركيز على المعلومات ذات الأولوية. لقد بدأنا فقط في اكتشاف السطح - لا تزال هناك طرق لا حصر لها يمكن أن تجعل Block Kit التطبيقات أكثر تفاعلية.

التحدث بنفس اللغة

في Guru، يعد بناء تجارب متسقة عبر جميع الواجهات (تطبيق الويب، وظيفة المتصفح، وتطبيق Slack) أمرًا صعبًا. بينما يعمل التصميم والتطوير بلا كلل لضمان تجارب سلسة لمستخدمينا، فإنها عملية تعاونية تتطلب الكثير من الذهاب والإياب. في السابق، بدأ فريق التصميم لدينا (الذي ليس معتادًا عادةً على البناء على Slack) بفراغ ثم واجه حتماً قيودًا فنية - خاصة عندما انتقلت تصاميمهم إلى التطوير، مما تطلب العديد من التكرارات قبل الوصول إلى التصميم النهائي.

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

بالنسبة لـ Guru، جسر منشئ Block Kit الفجوة بين التصميم والهندسة - مما يمكّن مصممينا من نمذجة تجربة المستخدم المثالية بسهولة، بينما ينتج أيضًا JSON الدقيق اللازم للتطوير لتنفيذ رؤيتهم. لم يعد يحتاج فريق التصميم لدينا إلى البدء من ورقة بيضاء، يسألون: أين يمكنني وضع هذا الزر؟ أو ما النص الذي أستخدمه؟ الآن، أصبح الأمر سهلاً مثل إنشاء التخطيط، ومشاركة الرابط، ثم التكرار بين الطرفين.

Slack%20Block%20Kit.png

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

الكفاءة في أفضل حالاتها

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

فضولي؟ تحقق من تطبيق Guru الجديد المحدث الذي تم تشغيله بواسطة Block Kit في دليل تطبيقات Slack على slack.com/apps.

تم كتابة هذه المقالة لمدونة منصة Slack. اقرأ الإدخال الأصلي هنا.

بدأت تكامل Guru مع Slack في الأيام الأولى من الروبوتات، حيث كانت التجربة تعتمد في الغالب على النص، وقد نمت في الوظائف مع إدخال Slack لميزات أكثر — مثل الرسائل التفاعلية وإجراءات التطبيقات. رأينا على الفور فوائد Block Kit، وهي فرصة لبناء تجارب عميقة وغنية يتوقعها مستخدمونا، مع أنماط واجهة مستخدم/تجربة مستخدم أكثر شيوعًا ومحتوى تفاعلي. ومع ذلك، ما لم نتوقعه هو كيف سيغير Block Kit طريقة تعاون فرق التطوير والتصميم لدينا.

slack-and-guru.png

بناء تجربة إدخال أفضل

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

  • من خلال استخدام الفواصل، قمنا بتصميم ذلك الجدار من النص المعلوماتي عن طريق تجميع المحتوى المماثل - مما جعله أكثر سهولة في الاستيعاب وأسهل قراءة.
  • سمحت الأزرار المتداخلة وقوائم التدفق بتجربة إدخال تفاعلية وموجهة نحو الإجراءات. الآن لا يحتاج المستخدمون إلى كتابة الأوامر الرئيسية؛ يمكنهم ببساطة اختيار الزر واتخاذ إجراء بسرعة.
Guru%20help%20menu%20in%20Slack.png

كانت قائمة المساعدة هي مكان واحد فقط حيث يرتقي Block Kit بتجربة تطبيق Guru. تجلب الأزرار المتداخلة في واجهة تغذية الأنشطة دعوة للعمل أقرب إلى المعلومات المقابلة. تخفي قوائم التدفق الآن الأفعال التي تستخدم بشكل أقل، وتساعد المستخدم على التركيز على المعلومات ذات الأولوية. لقد بدأنا فقط في اكتشاف السطح - لا تزال هناك طرق لا حصر لها يمكن أن تجعل Block Kit التطبيقات أكثر تفاعلية.

التحدث بنفس اللغة

في Guru، يعد بناء تجارب متسقة عبر جميع الواجهات (تطبيق الويب، وظيفة المتصفح، وتطبيق Slack) أمرًا صعبًا. بينما يعمل التصميم والتطوير بلا كلل لضمان تجارب سلسة لمستخدمينا، فإنها عملية تعاونية تتطلب الكثير من الذهاب والإياب. في السابق، بدأ فريق التصميم لدينا (الذي ليس معتادًا عادةً على البناء على Slack) بفراغ ثم واجه حتماً قيودًا فنية - خاصة عندما انتقلت تصاميمهم إلى التطوير، مما تطلب العديد من التكرارات قبل الوصول إلى التصميم النهائي.

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

بالنسبة لـ Guru، جسر منشئ Block Kit الفجوة بين التصميم والهندسة - مما يمكّن مصممينا من نمذجة تجربة المستخدم المثالية بسهولة، بينما ينتج أيضًا JSON الدقيق اللازم للتطوير لتنفيذ رؤيتهم. لم يعد يحتاج فريق التصميم لدينا إلى البدء من ورقة بيضاء، يسألون: أين يمكنني وضع هذا الزر؟ أو ما النص الذي أستخدمه؟ الآن، أصبح الأمر سهلاً مثل إنشاء التخطيط، ومشاركة الرابط، ثم التكرار بين الطرفين.

Slack%20Block%20Kit.png

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

الكفاءة في أفضل حالاتها

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

فضولي؟ تحقق من تطبيق Guru الجديد المحدث الذي تم تشغيله بواسطة Block Kit في دليل تطبيقات Slack على slack.com/apps.

تجربة قوة منصة Guru بشكل مباشر - قم بجولة تفاعلية في المنتج
قم بجولة