تصميم واجهات وتجربة المستخدم للمواقع والتطبيقات

ما تستلمه في نهاية مشروع التصميم#

تستلم ثلاثة أشياء: ملف Figma كاملاً باسمك وبملكيتك، ونموذجاً قابلاً للنقر تتنقل فيه كما لو كان المنتج جاهزاً، وتوثيقاً للألوان والخطوط والمكوّنات بحجم يناسب مشروعك.

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

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

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

كيف نصمم عربياً قبل أن نصمم جميلاً#

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

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

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

المدة والتكلفة وما نعدك به#

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

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

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

متى ننصحك بألا تشتري تصميماً#

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

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

تريد تصميماً الآن وتأجيل البرمجة سنة. التصميم يتقادم بسرعة: منصات الجوال تغيّر قواعدها، وتوقعات المستخدم تتغير معها، وملف يبقى في الدرج سنة يُعاد نصفه قبل التنفيذ.

مثال: موقع شركة البكري للمحاماة#

المكتب لم يكن له موقع أصلاً، والقرار التصميمي الحاسم فيه لم يكن لوناً ولا خطاً، بل ما لا يطلبه النموذج.

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

وصفحات التخصصات كُتبت بالمفردة التي يبحث بها صاحب المشكلة لا بالمفردة التي يستخدمها المكتب في مذكراته، فصار للقانون الطبي صفحته الخاصة بدل سطر بين عشرة عناوين. القرارات كاملة في دراسة حالة البكري للمحاماة.

أسئلة شائعة#

هل تصممون في Figma فقط؟#

نعم، ونسلّم الملف بملكيته لك. هذا يعني أن أي مصمم أو مطوّر بعدنا يفتح المصدر نفسه ويكمل منه، لا من صور مصدَّرة تُعاد رسمتها من جديد.

هل تصممون لمنتج سيبنيه فريقنا الداخلي؟#

نعم، وهي حالة متكررة عندنا. نسلّم الملف والنموذج والتوثيق، ونبقى متاحين لأسئلة فريقك أثناء التنفيذ ضمن فترة الدعم المتفق عليها.

هل تبدؤون بشعار وهوية بصرية إن لم تكن لدينا؟#

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

هل التصميم يشمل النصوص داخل الشاشات؟#

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