<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Mostafa Ali</title>
    <description>The latest articles on DEV Community by Mostafa Ali (@mostafaali2x).</description>
    <link>https://dev.to/mostafaali2x</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4067197%2F599a5937-b75a-4680-b19a-b17d4e7dd18f.png</url>
      <title>DEV Community: Mostafa Ali</title>
      <link>https://dev.to/mostafaali2x</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/mostafaali2x"/>
    <language>en</language>
    <item>
      <title>أهم خطوة في تصميم تجربة المستخدم UX</title>
      <dc:creator>Mostafa Ali</dc:creator>
      <pubDate>Fri, 07 Aug 2026 09:16:14 +0000</pubDate>
      <link>https://dev.to/mostafaali2x/hm-khtw-fy-tsmym-tjrb-lmstkhdm-ux-4kjd</link>
      <guid>https://dev.to/mostafaali2x/hm-khtw-fy-tsmym-tjrb-lmstkhdm-ux-4kjd</guid>
      <description>&lt;p&gt;&lt;strong&gt;فهم المشروع وأهداف البزنس Project Discovery &amp;amp; Business Goals&lt;/strong&gt;&lt;br&gt;
أول خطوة في عملية تصميم تجربة المستخدم UX مش فتح Figma ولا رسم أول شاشة، لكن فهم المشروع نفسه: المنتج بيقدم إيه، وليه المفروض المستخدم يعتمد عليه، وإيه النتيجة اللي البزنس عاوز يوصل لها. من غير الفهم ده، ممكن نطلع بتصميم منظم بصريًا لكنه بيحل مشكلة غلط، أو يضيف خصائص مش مرتبطة باحتياج حقيقي.&lt;/p&gt;

&lt;p&gt;في المرحلة دي بنحاول نبني صورة مشتركة بين صاحب المشروع، وفريق البزنس، والمصمم، والمطورين. الهدف إن كل الأطراف تكون فاهمة إحنا بنصمم إيه، ولمين، وإيه القيود اللي لازم نراعيها قبل الدخول في التفاصيل.&lt;/p&gt;

&lt;p&gt;– اجتماع انطلاق المشروع Kickoff Meeting&lt;br&gt;
البداية غالبًا بتكون من اجتماع انطلاق المشروع Kickoff Meeting مع أصحاب القرار، علشان نفهم فكرة المنتج، ومرحلة المشروع، وأهدافه، والمشكلة اللي الفريق شايف إنه بيحلها. الاجتماع مش مجرد استلام متطلبات، لكنه فرصة نكتشف الاختلافات بين تصورات الأطراف قبل ما تتحول لمشكلات أثناء التصميم أو البرمجة.&lt;/p&gt;

&lt;p&gt;في المشروعات الكبيرة، بنحتاج كمان نعمل مقابلات أصحاب المصلحة Stakeholder Interviews. كل فريق بيشوف المنتج من زاوية مختلفة؛ المبيعات تعرف اعتراضات العملاء، والدعم يعرف المشكلات المتكررة، والتطوير فاهم القيود التقنية، والإدارة عندها أولويات البزنس وخطة النمو.&lt;/p&gt;

&lt;p&gt;في نظام ERP مثلًا، تجاهل أي طرف من دول ممكن يطلع لنا تدفق شكله منطقي لكنه مش مناسب لطريقة الشغل الفعلية. علشان كده بنجمع وجهات النظر المختلفة، وبعدها نفصل بين احتياجات المشروع الحقيقية، والاقتراحات الشخصية، والطلبات اللي محتاجة دليل أو اختبار.&lt;/p&gt;

&lt;p&gt;– تحديد المشكلة الحقيقية Problem Framing&lt;br&gt;
الطلب اللي بيقوله صاحب المشروع مش دايمًا هو المشكلة اللي محتاجة تتصمم. لو قال: «محتاجين Dashboard»، فده وصف لحل مقترح، لكنه مش بيشرح ليه محتاجها أو مين هيستخدمها.&lt;/p&gt;

&lt;p&gt;هنا بنبدأ نسأل:&lt;/p&gt;

&lt;p&gt;مين المستخدم الأساسي للوحة التحكم؟&lt;br&gt;
إيه القرارات اللي محتاج ياخدها منها؟&lt;br&gt;
إيه البيانات اللي لازم تظهر فورًا؟&lt;br&gt;
هل محتاج متابعة لحظية ولا تقارير دورية؟&lt;br&gt;
هل كل أنواع المستخدمين عندهم نفس الصلاحيات؟&lt;br&gt;
وإيه اللي هيحصل لو البيانات ناقصة أو متأخرة؟&lt;br&gt;
الأسئلة دي بتحول طلب عام إلى مشكلة تصميم Design Problem نقدر نفهمها ونبني لها أكتر من حل، بدل ما ننفذ أول تصور اتقال في الاجتماع.&lt;/p&gt;

&lt;p&gt;– مراجعة متطلبات المشروع Requirements Review&lt;br&gt;
بعد فهم الصورة العامة، بنراجع كل الملفات والمعلومات المتاحة عن المنتج. ممكن تشمل:&lt;/p&gt;

&lt;p&gt;ملخص المشروع — Project Brief.&lt;br&gt;
متطلبات المنتج — Product Requirements.&lt;br&gt;
نطاق العمل — Scope of Work.&lt;br&gt;
القيود التقنية — Technical Constraints.&lt;br&gt;
الخصائص الأساسية — Core Features.&lt;br&gt;
أنواع المستخدمين والصلاحيات — User Roles &amp;amp; Permissions.&lt;br&gt;
الأنظمة أو الإصدارات السابقة — Existing Systems.&lt;br&gt;
ملف متطلبات النظام — SRS.&lt;br&gt;
وجود ملف SRS بيساعد جدًا في المشروعات المعقدة، خصوصًا لو فيها صلاحيات، وعمليات مترابطة، وحالات كثيرة. بيكون مرجع مشترك بين البزنس والتصميم والتطوير، ويقلل إن كل طرف يفهم الوظيفة بطريقة مختلفة.&lt;/p&gt;

&lt;p&gt;لكن الملف مش بيتعامل كأنه حقيقة نهائية. ممكن يكون فيه متطلبات قديمة، أو حالات ناقصة، أو وظائف مكتوبة من منظور النظام من غير ما تراعي طريقة استخدام الأشخاص له. دور المصمم هنا إنه يراجع المتطلبات، ويحدد الأسئلة المفتوحة، ويكشف التعارضات قبل ما تتحول إلى شاشات وكود.&lt;/p&gt;

&lt;p&gt;ولو مفيش ملف متطلبات من الأساس، بنساعد الفريق ينظم الوظائف، وأنواع المستخدمين، والسيناريوهات الأساسية، والقرارات اللي لسه محتاجة حسم قبل بدء التصميم.&lt;/p&gt;

&lt;p&gt;– تحديد نطاق المشروع Project Scope&lt;br&gt;
من المهم كمان نحدد حدود المشروع من البداية. هل المطلوب تصميم منتج كامل، ولا خاصية محددة، ولا تحسين منتج قائم؟ هل العمل يشمل البحث والاختبار، ولا فيه بيانات جاهزة؟ وهل التسليم هيكون واجهات فقط، ولا نموذج تفاعلي ونظام تصميم ومتابعة تنفيذ؟&lt;/p&gt;

&lt;p&gt;تحديد نطاق المشروع Project Scope بيمنع إن الشغل يتحول لمجموعة طلبات مفتوحة، وبيوضح إيه اللي داخل المرحلة الحالية، وإيه اللي ممكن يتأجل لإصدار لاحق. ده بيساعد الفريق يحافظ على الأولويات والميزانية والجدول الزمني.&lt;/p&gt;

&lt;p&gt;– تحديد أهداف البزنس Business Goals&lt;br&gt;
التصميم لازم يخدم هدف واضح للمشروع، مش مجرد تحسين شكل المنتج. علشان كده بنحدد أهداف البزنس اللي المفروض المنتج يساعد على تحقيقها، ونربطها بسلوك يمكن متابعته.&lt;/p&gt;

&lt;p&gt;في متجر إلكتروني، الهدف ممكن يكون:&lt;/p&gt;

&lt;p&gt;زيادة نسبة إتمام الطلب.&lt;br&gt;
تقليل ترك سلة الشراء.&lt;br&gt;
تسهيل الوصول للمنتجات.&lt;br&gt;
زيادة عمليات الشراء المتكررة.&lt;br&gt;
وفي منصة تعليمية، الهدف ممكن يكون:&lt;/p&gt;

&lt;p&gt;زيادة إكمال الدروس.&lt;br&gt;
رجوع المستخدم للمسار التعليمي.&lt;br&gt;
تقليل الانسحاب أثناء التسجيل.&lt;br&gt;
تسهيل الوصول للمحتوى المناسب.&lt;br&gt;
الأهداف دي بتحدد الأولويات. لو هدف المشروع تقليل الانسحاب أثناء الدفع، مش منطقي نستهلك الجزء الأكبر من الوقت في تحسين صفحة جانبية تأثيرها محدود.&lt;/p&gt;

&lt;p&gt;– مؤشرات النجاح Success Metrics&lt;br&gt;
بعد تحديد الأهداف، بنحدد إزاي هنعرف إن الحل نجح. هنا بنستخدم مؤشرات النجاح Success Metrics المناسبة لطبيعة المنتج، زي:&lt;/p&gt;

&lt;p&gt;نسبة إتمام المهمة — Task Completion Rate.&lt;br&gt;
معدل التحويل — Conversion Rate.&lt;br&gt;
نسبة الانسحاب — Drop-off Rate.&lt;br&gt;
الوقت المطلوب لإتمام المهمة — Time on Task.&lt;br&gt;
عدد الأخطاء أو طلبات الدعم.&lt;br&gt;
معدل الرجوع للمنتج — Retention Rate.&lt;br&gt;
مش كل مشروع عنده بيانات كاملة من البداية، لكن لازم يكون فيه تصور واضح للنتيجة اللي الفريق بيحاول يحسنها. غير كده، تقييم التصميم هيفضل قائم على آراء زي: «الشكل حلو» أو «الواجهة محتاجة تبقى أحدث».&lt;/p&gt;

&lt;p&gt;– تحديد الافتراضات والمخاطر Assumptions &amp;amp; Risks&lt;br&gt;
في بداية أي مشروع بيكون فيه معلومات مؤكدة، وحاجات الفريق متوقعها بس. ممكن نفترض إن نوعًا معينًا من المستخدمين محتاج خاصية، أو إن المشكلة سببها صعوبة الخطوات، لكن الافتراض مش بيتحول لحقيقة لمجرد إن الفريق متفق عليه.&lt;/p&gt;

&lt;p&gt;علشان كده بنسجل:&lt;/p&gt;

&lt;p&gt;الافتراضات اللي محتاجة اختبار.&lt;br&gt;
المعلومات الناقصة.&lt;br&gt;
المخاطر التقنية أو التشغيلية.&lt;br&gt;
القرارات اللي معتمدة على أطراف خارجية.&lt;br&gt;
الخصائص اللي تكلفتها عالية أو تأثيرها غير واضح.&lt;br&gt;
الفصل بين الحقيقة والافتراض بيساعدنا نعرف إيه اللي محتاج بحث، وإيه اللي ممكن نتحرك فيه مباشرة، وإيه القرار اللي خطره كبير لو اتبنى على معلومة غير مؤكدة.&lt;/p&gt;

&lt;p&gt;– الإطار الزمني المبدئي Preliminary Timeline&lt;br&gt;
بعد مراجعة نطاق المشروع، والمتطلبات، وعدد المستخدمين والتدفقات، نقدر نحط تصور مبدئي لمراحل الشغل والمدة المتوقعة لكل مرحلة. التقدير هنا بيساعد الفريق يرتب الموارد والمراجعات ومواعيد التسليم، لكنه مش وعد نهائي قبل ما تتضح كل التفاصيل والأسئلة المفتوحة.&lt;/p&gt;

&lt;p&gt;خطوات تصميم تجربة المستخدم UX من بداية المشروع للنهاية&lt;br&gt;
تصور للأطار الزمني للمشروع Preliminary Timeline Project&lt;br&gt;
– مخرجات مرحلة فهم المشروع Discovery Deliverables&lt;br&gt;
مخرجات المرحلة مش لازم تكون ملفًا ضخمًا، لكنها لازم توحّد فهم الفريق. ممكن تشمل:&lt;/p&gt;

&lt;p&gt;ملخص المشروع — Project Overview.&lt;br&gt;
تعريف أولي للمشكلة — Initial Problem Statement.&lt;br&gt;
أهداف البزنس — Business Goals.&lt;br&gt;
مؤشرات النجاح — Success Metrics.&lt;br&gt;
الجمهور المتوقع — Target Users.&lt;br&gt;
نطاق المشروع — Project Scope.&lt;br&gt;
المتطلبات الأساسية — Core Requirements.&lt;br&gt;
أنواع المستخدمين والصلاحيات — User Roles &amp;amp; Permissions.&lt;br&gt;
القيود التقنية والتشغيلية — Technical &amp;amp; Operational Constraints.&lt;br&gt;
الافتراضات اللي محتاجة اختبار — Key Assumptions.&lt;br&gt;
الأسئلة المفتوحة — Open Questions.&lt;br&gt;
المخاطر الأولية — Initial Risks.&lt;br&gt;
النتيجة المطلوبة إن الفريق يدخل مرحلة البحث وهو فاهم إيه اللي محتاج يعرفه، وليه محتاج يعرفه. مش بنبدأ البحث بشكل مفتوح، ومش بنبدأ التصميم بناءً على Brief قصير أو تصور شخص واحد عن المنتج.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://mostafaali.me/ux-design-process-steps-2026/" rel="noopener noreferrer"&gt;https://mostafaali.me/ux-design-process-steps-2026/&lt;/a&gt;&lt;/p&gt;

</description>
      <category>ui</category>
      <category>ux</category>
      <category>webdev</category>
    </item>
    <item>
      <title>إيه هو تصميم تجربة المستخدم UX؟</title>
      <dc:creator>Mostafa Ali</dc:creator>
      <pubDate>Fri, 07 Aug 2026 09:14:05 +0000</pubDate>
      <link>https://dev.to/mostafaali2x/yh-hw-tsmym-tjrb-lmstkhdm-ux-e4i</link>
      <guid>https://dev.to/mostafaali2x/yh-hw-tsmym-tjrb-lmstkhdm-ux-e4i</guid>
      <description>&lt;p&gt;خلينا في الأول نعرف مفهوم ال UX و تصميم تجربة المستخدم عبارة عن أي هو عملية بتبدأ بفهم المستخدم، وهدفه، والسياق اللي بيستخدم فيه المنتج الرقمي، وبعدها تنظيم المحتوى والخطوات والتفاعلات Workflows بشكل يساعده ينجز المهمة بأقل قدر ممكن من الارتباك والمجهود. الهدف مش إن المستخدم يقدر يستخدم المنتج وبس، لكن إنه يفهمه بسرعة، ويتحرك داخله بثقة، ويوصل للنتيجة من غير خطوات غير ضرورية أو مفاجآت تعطل رحلته.&lt;/p&gt;

&lt;p&gt;علشان كده تجربة المستخدم UX أوسع من شكل الشاشة. هي بتشمل كل حاجة بتحصل من أول دخول المستخدم للموقع أو التطبيق، مرورًا بطريقة عرض المعلومات والتنقل بين الخطوات، لحد إتمام المهمة والحصول على رد Response واضح من النظام Loading Time. حتى وقت الانتظار، ورسائل الخطأ، وحالات عدم وجود بيانات، وطريقة الرجوع أو تعديل القرار، كلها أجزاء أساسية من تجربة الاستخدام UX.&lt;/p&gt;

&lt;p&gt;مصمم تجربة المستخدم مش بيسأل بس: هل الواجهة شكلها كويس؟ لكنه بيسأل: هل المستخدم فاهم هو فين؟ وهل الخطوات واضحة؟ وهل المعلومات المهمة بتظهر في الوقت المناسب؟ ولو حصل خطأ، هل النظام بيوضح السبب وطريقة الحل؟ كمان بيراجع هل مسار الاستخدام مبني على طريقة تفكير المستخدم فعلًا، ولا على الطريقة اللي فريق المشروع متخيل إنه لازم يتصرف بيها ورأي شخصي وتقديم رأي صاحب المصلحة Stakeholders على قرارات ومصطلحة المستخدمون.&lt;/p&gt;

&lt;p&gt;خلينا ناخد متجر إلكتروني كمثال. ممكن صفحة المنتج تكون جذابة بصريًا، والصور واضحة، والألوان متناسقة، لكن زر الشراء مش ظاهر، أو تكلفة الشحن بتظهر في آخر خطوة، وإنشاء الحساب إجباري قبل الدفع مع التصفح. هنا واجهة المستخدم UI ممكن تكون جيدة وتفي بالغرض، لكن تجربة المستخدم UX ضعيفة؛ لأن المشكلة موجودة في ترتيب المعلومات وشروط إتمام الطلب، مش في الشكل فقط.&lt;/p&gt;

&lt;p&gt;ونفس الفكرة في تطبيق حجز. لو المستخدم اختار الخدمة والفرع والموعد، وكتب بياناته، وبعدها اكتشف إن الموعد غير متاح، فالمشكلة مش مجرد رسالة خطأ سيئة. المشكلة إن النظام سمح له يضيع وقتة ويكمل رحلة مبنية على اختيار غير متاح من البداية، وده بيزود الإحباط ويقلل ثقته في المنتج.&lt;/p&gt;

&lt;p&gt;مصمم تجربة المستخدم UX لا يفكر في السيناريو دي وغيرها من السنريوهات اللي مينفعش يستنتجها لوحدة من غير أبحاث مستخدمية User Research قبل تصميم الواجهة المقصور أن في سنريوهات وأحتمالات كتير داخل أي تطبيق أو موقع في منها البسيط والمعقد لازم تراعي في تصاميمك كل الأحتمالات وتكون نتيجة أبحاث حقيقية خصوصا مع الأحتمالات المعقدة ولازم تخرج منها بإجابات حقيقية ترد بيها على: إمتى تظهر المواعيد المتاحة؟ إزاي يتم تحديثها؟ إيه اللي يحصل لو الموعد اتغير أثناء الحجز؟ وإزاي نعرض بدائل قريبة من غير ما نطلب من المستخدم يبدأ من الأول؟ الأسئلة دي بتحول التصميم من مجموعة شاشات إلى نظام واضح بيتعامل مع الحالات الحقيقية والمتوقعة.&lt;/p&gt;

&lt;p&gt;علشان كده تصميم تجربة المستخدم UX للمواقع والتطبيقات بيجمع بين بحث المستخدمين، وتحليل احتياجاتهم وسلوكهم، وتنظيم المعلومات Information Architecture، وبناء تدفقات الاستخدام، وتصميم المخططات الأولية Prototyping، ثم اختبار الحل قبل اعتماده. تجربة المستخدم مش مرحلة شكلية تسبق تصميم واجهة المستخدم UI، لكنها الأساس اللي بيحدد محتوى الواجهة، وترتيبها، وطريقة تفاعل المستخدم معاها.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://mostafaali.me/ux-design-process-steps-2026/" rel="noopener noreferrer"&gt;https://mostafaali.me/ux-design-process-steps-2026/&lt;/a&gt;&lt;/p&gt;

</description>
      <category>ui</category>
      <category>ux</category>
    </item>
    <item>
      <title>Brand Identity and UI/UX Designer</title>
      <dc:creator>Mostafa Ali</dc:creator>
      <pubDate>Fri, 07 Aug 2026 09:09:28 +0000</pubDate>
      <link>https://dev.to/mostafaali2x/brand-identity-and-uiux-designer-368f</link>
      <guid>https://dev.to/mostafaali2x/brand-identity-and-uiux-designer-368f</guid>
      <description>&lt;p&gt;I’m Mostafa Ali, a Brand Identity and UI/UX Designer from Ismailia, Egypt, with around eight years of experience.&lt;/p&gt;

&lt;p&gt;I’ve worked across advertising and software companies, including Index Group and Iraq Soft, where I designed complete visual identities and digital products ranging from simple websites and mobile apps to complex platforms and ERP systems.&lt;/p&gt;

&lt;p&gt;Combining branding with product design has taught me to see a brand as a complete experience—from its strategy and visual identity to the way people interact with its digital products. I also enjoy writing and sharing practical insights from my experience and projects.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://mostafaali.me/blogs" rel="noopener noreferrer"&gt;https://mostafaali.me/blogs&lt;/a&gt; &lt;/p&gt;

</description>
      <category>design</category>
    </item>
  </channel>
</rss>
