Studio Live: تصميم تجربة جوال لاكتشاف الموسيقى

نصل الجمهور بالموسيقى التي يحبها.

تصميم تجربة تطبيق موسيقي·تطبيق جوال لتفاعل الجمهور·تصميم منصة اكتشاف الموسيقى·تصميم واجهات الجوال لقطاع الموسيقى

iOS + Android

المنصات

UX/UI Design

النطاق

5 core flows

المسارات المصممة

FigmaIOSAndroidMobile UI

Studio Live

نصل الجمهور بالموسيقى التي يحبها.

القطاع: الترفيه والموسيقى | المنظومة التقنية: ⁨Figma, iOS, Android⁩ | النطاق: تصميم تجربة المستخدم وواجهته


ما هو Studio Live#

Studio Live تطبيق جوال يصل عشّاق الموسيقى مباشرة بالفنانين والمنتجين. يحصل الجمهور على مكان واحد لمتابعة الفنانين، واكتشاف موسيقى جديدة، والوصول إلى محتوى حصري. ويحصل الفنانون والمنتجون على خط مباشر مع جمهورهم، بلا خوارزمية منصة تقرر من يرى ماذا.

كان هذا تكليف تصميم تجربة وواجهة. صممت Silverthread Labs تجربة المستخدم والواجهة كاملتين لـ iOS وAndroid معاً: التهيئة الأولى، واكتشاف الفنانين، وتدفقات المحتوى، وآليات المتابعة، ومسارات الوصول الحصري.


مشكلة التصميم#

اكتشاف الموسيقى تهيمن عليه خوارزميات تخدم المنصات لا الجمهور#

قُدِّرت قيمة سوق تطبيقات الموسيقى عالمياً بـ 35.59 مليار دولار في 2025، ويُتوقع أن تبلغ 76.42 مليار دولار في 2035 (Business Research Insights, 2025). ونحو 62% من المستهلكين حول العالم يفضّلون قوائم التشغيل المنسّقة (Mordor Intelligence, 2025). وتلك الأرقام ليست مفاجئة، وليست مفيدة كثيراً. وما تؤكده أن حفنة من المنصات تملك نفوذاً هائلاً على ما يسمعه الناس فعلاً، وتستخدمه لتحسين زمن الجلسة، لا لأي شيء قد يعدّه المستمع صلة حقيقية.

فـ ⁨Spotify, Apple Music, YouTube Music⁩ مبنية لتبقيكم مستمعين. وليست مبنية لتساعدكم على تتبع مسيرة فنان، أو اكتشاف من يتعاون معهم، أو الوصول إلى جلسات الاستوديو والأعمال غير المُصدَرة التي يهتم بها الجمهور المخلص. فمصلحة المنصة ومصلحة المستمع تفترقان، والمنصة تنتصر دائماً. وقد صُمم Studio Live حول الجانب الآخر من ذلك.

التصميم لأجل صلة شعورية في مساحة مزدحمة#

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

وتتمحور اتجاهات تجربة المستخدم السائدة في الجوال لعام 2025 حول التخصيص، والتنقل السلس، والواجهات المقتصدة (Fuselab Creative, 2025; SPDLoad, 2025). ويتبع Studio Live تلك المبادئ، لكن مشكلة التصميم الأصعب لم تكن التنقل ولا التخطيط. كانت جعل المحتوى الحصري يبدو وصولاً لا جداراً مدفوعاً، وجعل الاكتشاف يبدو شخصياً لا خوارزمياً. وهذان أمران يسهل قولهما ويصعب فعلاً إتقانهما عملياً.


ما الذي صممناه#

مسار اكتشاف الفنانين#

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

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

آليات المتابعة والتدفق#

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

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

الوصول إلى المحتوى الحصري#

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

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

التهيئة الأولى ومعايرة الذوق#

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

تصميم عابر للمنصات (iOS وAndroid)#

يغطي نظام التصميم iOS وAndroid بأنماط تناسب كلاً منهما. فالتنقل يتبع أعراف iOS (شريط التبويبات، وإيماءات التمرير) على iPhone، وأنماط Material Design (التنقل السفلي، وأزرار الإجراء العائمة) على Android. وتبقى الهوية البصرية متسقة عبر المنصتين مع احترام توقعات التفاعل المختلفة في كل منهما.


القدرات الأساسية#

المسارات الخمسة الجوهرية المصممة لـ Studio Live:

  • اكتشاف الفنانين عبر مختارات منسّقة، وتصفح حسب النوع، وتوصيات من الرسم البياني الاجتماعي
  • تدفق يقدّم الجمهور ولا يقمع الفنانين المتابَعين خلف ترتيب خوارزمي
  • تجربة محتوى حصري للمقطوعات غير المُصدَرة، وجلسات الاستوديو، والتواصل المباشر بين الفنان وجمهوره
  • أنظمة تصميم كاملة لـ iOS وAndroid بأنماط تفاعل أصيلة لكل منصة
  • معايرة ذوق في أقل من 60 ثانية تقود مباشرة إلى اكتشاف مخصص

النطاق والصراحة#

كان هذا تكليف تصميم، لا بناءً متكاملاً. سلّمت Silverthread Labs بحثاً في تجربة المستخدم، ومخططات أولية، ونماذج عالية الدقة، ومواصفات تفاعل، وأنظمة تصميم للمنصتين. أما التنفيذ الهندسي فجرى على حدة.

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


كيف يعكس هذا عملنا#

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

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


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

آخر تحديث: March 20, 2026

[ كيف يعمل الأمر ]

تدقيق أتمتة مجاني

نعثر على 20% من عملك اليدوي الأكثر كلفة عليك، ثم نُريك بالضبط كيف تتخلص منه.

الخطوة 1.0
أخبرنا بما يُرهقك

أخبرنا بما يُرهقك

مكالمة من 30 دقيقة. اشرح لنا عملياتك اليومية وسنرصد الاختناقات التي لم تعد تلاحظها.

الخطوة 2.0
نُرتّب المكاسب

نُرتّب المكاسب

نُقيّم كل فرصة بالأثر والجهد، لترى أين يوفّر الذكاء الاصطناعي أكبر قدر من الوقت والمال.

الخطوة 3.0
تحصل على خطة العمل

تحصل على خطة العمل

خارطة طريق مرتبة بالأولوية يمكنك التحرك بها. نفّذها معنا أو بمفردك. تبقى لك في الحالتين.