مقال مهم جدا لكل الى عايز يفهم ايه ال UI/UX، بسم الله توكلنا على الله .... الفترة الى فاتت لقيت ناس كتير بيسألوا عن ايه هما ال ui/ux و فى ناس منكم كانوا منزلين تصاميم هما عاملنها وانا كنت بحط عليها تقييم من 10 و كنت بجاوب على اغلب الأسئلة وأقول ايه المشاكل ف كل تصميم لكن بردوا السؤال كان بيتكرر كتير طيب تعالوا نفهم الحوار ايه ....
أولا يا سيدى عالم البرمجة ينقسم الي اثنين ( عدد 2 شئ ) وهما الطالب و المطلوب واكيد حضرتك كا مبرمج محترم لكن احنا هنركز على الحجتين دول و هم الى بنهتم بيهم ... طيب ( الطالب ) وده بيبقى العميل الى انته بتقعد معاه و بيقولك على مواصفات الموقع او ال app الى هو عايزه و المطلوب بيبقى الخدمه الى انته هتعملها عشان تساعده يعمل ال App و الى ف المقابل هتاخد عليها تمن او لو انته بتشتغل free وده مش عيب ولا حرام تمام ....
-
طيب تعالوا نمسك كل حاجه بقى فيهم لواحدها ونفصلها :
1 - اولا : الطالب ( customer ) :
-
ده ياسيدى بيبقى كل همه الوحيد انه يدفع اقل فلوس و ياخد اعلى خدمه عايزك تحقق احلامه و احلام العيله بتاعته من الاخر .... بيبقى عايز موقع شكله حلو و مترتب وبيعرض الخدمات المطلوبه منه وبتوصل لأكبر عدد من المستخدمين و بأعلى درجات الامان .. ومش هكتر ف الكلام عنه عشان مهواش موضوعنا ...
-
نيجى بقى للموضوع المهم وهو
-
2 - ثانيا : المطلوب ( Application ) :
بص ياسيدى عشان تعرف تعمل تطبيق محترم وفيه كل المواصفات وميبقاش فيه غلطات كتير و ياخد 10 / 10 انته محتاج تقسم نفسك لحجتين ( عدد 2 شئ ) وهما انك تبقى فنان ( UI ) و انك تبقى محلل ( UX ) طيب تعال نمسك ال ( UI ) ....
-
ال ( UI ) دى يا سيدى اختصار ل User interface وهى الواجهة الى بتظهر للمستخدم ( الشكل الى بيظهر للمستخدم ) ( الشاشه الى بيشوفها البنى أدم الى هيفتح الموقع ) و دى لازم تبقى مراعى فيها حجات كتير هلخصهم ف شوية نقط
-
1 - شكل العناصر
( متبقاش مأفور اوى ف الاشكال ياعنى متملاش الصفحه كلها curves او تملها نجوم و لا تبقى كبيره جدا بحيث انها لو صغيره هتبقى اشيك واحسن و لا تبقى صغيره جدا عشان متجلوش عما حاول تكون وسط ف وضع شكل العناصر )
-
2 - الالوان
( ودى اهم شئ ياهندسه ليه بقى لانها هى الى بتدى الطابع الاول عن الموقع لو الالوان فاقعه اوى ممكن تتعب عين المستخدم و ده هيخليه يطفش من الموقع و مش هيفكر يدخله تانى و لا تبقى مستخدم الوان داكنه جدا هتريح عينه بس ممكن يكون هو مش بيحب الغوامق ف انته بتفكر ف الألوان بأكتر من سيناريوا بحيث انك ترضى كل الاذواق و الشخصيات انا واحد من الناس بعمل ميقلش عن 10 ثيمات عشان محدش يبقالوا حجه عندى ف نصيحه حاول تلعب بالالوان بحيث انك توصل لمرحلة ال color balance )
-
3 - حجم ولون الخط
( وده الى بيسبب المشاكل ف كل المواقع بشكل عام دايما حاول تراعى شكل الخط يكون كويس و مقروء مش يبقى خط مشبك فى بعضه ولا يبقى خط كل حرف منه يملى الشاشه حاول برضوا ان احجام الخطوط يكون ف Range من 16px ل 24px وده بيبقى مناسب مع اغلب الشاشات و بيبقى كويس مع معظم العناصر ف الصفحه و لو هتعمل اسم الموقع بخط معين فخليه ف Range ال 35px ل 48px مش القى بعض الناس عامله الخط حجمه 100 و 150px تمام لون الخط بقى لازم تراعيه متحط لون غامق على الخط وانته على خلفيه غامقه و لا تحت لون خط فاتح على لون فاتح حاول يكون عندك ذوق ف اختيار اللون ياعنى خط غامق على خلفيه فاتحه و خط فاتح على خلفيه غامقه سهله واللهى )
-
4 - الصور :
خلى بالك حذارى تملى الصفحة صور و خاصة لو حجمهم بيبقى كبير كده انته بتدمر الموقع ليه بقى الصور الكتير بتحتاج انها تتحط على server و بتحتاج عند التشغيل انها تتبعت لصفحه بتاعته التصميم وده بيبطأ الموقع و اوقات على servers ضعيفه ممكن الموقع ميحملش خالص فخلى بالك استخدم الصور على قدر احتياجك فقط وانا بتكلم عن الصور الثابته مش الصور الى بتيجى من ال Database ده موضوع تانى ... لكن خلى الصور برضوا تكون الوانها نفس ألوان الموقع او متماشيه معاه ياعنى ايه ياعنى مثلا لو اللون المميز للصفحة هيبقى اللون الاحمر فخلى الصورة يبقى فيها اللون الاحمر و الى بيحصل اصلا ايه انك بتختار الصور الى هتستعملها الاول و تشوف الالوان الى فيها و بعدين تبدأ تحدد الالوان الى هتستخدمها من خلال الصوره عشان تراعى توازن الاوان بين الصور و ألوان الموقع نفسه تمام .... انواع الصور المستحسن استخدامها ف المواقع ال jpg و ال svg ودول كفايه جدا جدا جدا
-
كفايه كده على ال UI نروح بقى لل UX
-
بص ياسيدى هنا بتبقى وظيفتك انك تبقى محلل ياعنى بتقعد تسأل نفسك شوية اسأله تعال اقولك شويه منهم
-
1 - هو عناصر الصفحه مترتبه صح؟
ده اهم سؤال ياعنى مثلا ال navbar ضرورى انه يبقى فين فأعلى نقطه ف الصفحه طيب هل الاحسن انوا يبقى ثابت فوق ولا ينزل معاك وانته بتعمل scroll سؤال مهم جدا ده نيجى مثلا لل side bar هتسأل نفسك هل الاحسن انه يظهر فوق ال body ولا يعمله ازاحه من على الجنب ولا يظهر ب fade او slide down ... وغيره من العناصر بتقف عند كل عنصر وتسأل نفسك هو مكانه ده صح ولا محتاج يتعدل
-
2 - هو اتجاه العناصر صح ؟
وده بقى الغلط الى معظم الناس فيكم كان بيقع فيه بس ياريس لو الصفحه اللغه بتاعتها هتبقى عربى يبقى لازم تراعى ان اتجاه العناصر يبقى من اليمين لشمال و لو انجليزى يبقى اكيد من الشمال لليمين على حسب اتجاه كتابة اللغة المستخدمه ياعنى مثلا عندك side bar لو انته موقع عربى يبقى الصح انه يظهر من على اليمين و الكلام الى فيه يبدأ من اليمين بس خلى بالك ميبقاش على اليمين و الموقع عربى وانته عامل كل العناصر الى فيه بلغه تانيه تمام ولو انته موقع انجليزى يبقى يظهر على شمال الصفحه لان ده الطبيعى عشان اتجاه حركة كتابة اللغه تمام.
-
3 - هو الموقع الى انا عملته ده حقق الغرض المطلوب منه ولا لاء ؟
( وده بقى لازم تراعيه انته مطلوب منك تعمل موقع لمطعم الراجل قالك انا عايز صفحه يبقى فيها الطلبات الى لسه هتطلع والطلبات الى طلعت و شاشة تسجيل دخول ياعنى 3 صفحات يبقى تصب كل تركيزك انك تعمل ال 3 صفحات دول على أكمل وجه وبعدين تروح تحط البهارات مش تروح تعمله 120 صفحه وفى الاخر تلقيك معملتش المطلوب ولا الى بيخدمه او ينفذله طلبه و النوعيه دى انا قابلتها كتير على مدار 7 سنين .... خلى بالك
-
4 - هل الصفحه smooth ؟
ده سؤال مهم ... لازم يبقى فى نعومه فى حركة الصفحه و تكون مريحه للعين مش حركة مفاجأه ولا تكون حركة مبالغ فيها.
-
5 - هل ال animations مناسبه للموقع ولا لاء ؟
فى ناس كتير بتحب تعمل animations بس نيجى ندور نلقى ال animation مع انه كويس الا انه ملهوش لزمه او تلقيه بيتسب ف انه يبطئ الصفحه لانك ممكن تبقى مستدعى مكتبات خاصه عشان يتنفذ ال animation ده
-
6 - هل الى انا عملته ده مناسب لسعر الى انا هاخده ؟
( متقللش من سعر شغلك الا لو انته لسه في البداية يعنى لسه جديد ف المجال اهم شئ انك تسب العميل و تكون صادق معاه بس دايما حط حد ادنى لشغلك وقول لنفسك انا اقل موقع هعمله مش هبيعه بأقل من 10$ مثلا تمام بس متخليش الفلوس هى ال target رقم واحد من شغلك )
-
فى نقطه اخيره ال salary الى بيقبضه ال UI/UX Designer بيوصل من 75000$ ل 105000$ فى السنه وده طبقا لمواقع عالميه مش كلامى ف الوطن العربى بيبقى من 25000$ ل 40000$ ف السنه بس بيبقى ف الشركات المتخصصه او ال freelancer المحترفين جدا تمام .... وسورى ان انا طولت عليكم بس حبيت اتكلم معاكم شويه عشان الناس تستفاد ولو حد شايف ان انا غلط ف نقطه انا تحت امره يجى ويعدلها و انا متقبل جدا لكل الاراء تمام يا شباب و متنساش
بواسطة: البشمهندس / Youssef Pro
أهم العناوين البحثية حول هذا المقال:
ui/ux ماهو
ماهو ui
ماهو ux
ما هو ui ux
ux ماهو
ماهو ui ux
ui ux ماهو
