ما هو UI Developer وما هو Front-End Developer وما الفرق بينهما؟
هناك اعتقاد خاطئ وشائع عن وظيفة مطور واجهة المستخدم أو ما يطلق عليه ب UI developer ووظيفة مطور الواجهة الأمامية أو ما يطلق عليه ب Front-End developer فهناك من يعتقد أن Front-End developer و UI developer يقومان بنفس المهمة بشكل أساسي.
للآسف فهذه المغالطات لا أسمعها فحسب من المبتدئين في مجال البرمجة والمعلوميات ولكن أيضا من الأشخاص العاملين في صناعة تكنولوجيا المعلومات. ولتسوية الأمر مرة واحدة وإلى الأبد، قررت أن أقوم بتحديد الخط الفاصل بين هاتين الوظيفتين اللتين تتمتعان بنفس الدرجة من الأهمية والإهتمام، ولكنهما مختلفتان تماما.
سأبدأ بتعريف واجهة المستخدم في الصناعة الرقمية، تعني واجهة المستخدم أو User Interface كل التفاصيل التي يمكن للمستخدم التحكم فيها أو التفاعل معها (الشاشة ولوحة المفاتيح والماوس ووحدات التحكم الإضافية وما إلى ذلك) عبر أجهزة مختلفة - أجهزة الكمبيوتر المكتبية وأجهزة الكمبيوتر المحمولة والأجهزة اللوحية والهواتف المحمولة.
تطوير الواجهة أو Interface development ، سواء أكانت تطبيقات أو مواقع ويب أو ألعاب أو حتى أجهزة محاكاة (في الواقع، خصوصا أجهزة المحاكاة أو simulators) ، هي عملية معقدة تحمل في طياتها عناصر التصميم والهندسة.
الهدف الرئيسي لمطور الواجهة أو interface developer هو إنشاء واجهة مريحة تلبي احتياجات المستخدم. يجب عليك فهم وتحديد حاجيات المستخدم وأهدافه وأنماط سلوكه وسيناريوهات نموذج تفاعل المستخدم. كلما زاد عدد المجالات التي تتقنها في مجال هذه الصناعة (التحليلات وعلم النفس والتسويق وتجربة المستخدم) ، كلما كنت قادرا على رسم معالم الحلول الأفضل لتلبية ما يريده المستخدم بالضبط.
وظيفة مطور واجهة المستخدم أو UI Developer
بالنسبة لمطور واجهة المستخدم أو UI Developer ، فإن أداة العمل الرئيسية هي برنامج Adobe Illustrator أو برنامج مشابه له لرسم الرسومات وإعداد مواد الغرافيك ويُعد Illustrator جيدًا في التعامل مع رسومات المتجهات، مما يمكّن من تحجيم واجهات المفاهيم وضبطها لمختلف مقاسات الشاشة.
أما بالنسبة للأدوات المساعدة، فقد يستخدم مطور واجهة المستخدم أو UI Developer أيضًا Microsoft Expression Design و Expression Blend وأخيرًا وليس آخرًا، يجب على المصمم أن يتعمق في إرشادات واجهة المستخدم الخاصة بأنظمة التشغيل ذات الصلة، والتي يرغب المستخدم في ضبط الواجهة الخاصة بها.
السمة الحاسمة لمطور واجهة المستخدم أو UI Developer هي التفكير المنطقي، وهذا هو السبب في أن هؤلاء الأشخاص ليسوا أبدًا فنانين محترفين بالمعنى الأدق. مصمم واجهة المستخدم هو فني 100 ٪ ويعتبر النهج الرياضي ضروري للجمع بين الأدوات القياسية من أجل حل مشاكل المشروع أما بالنسبة للإبداع الذي نقدره كثيرًا - لا يُسمح به إلا عندما لا تتمكن الأدوات القياسية من توفير الحل المرضي.
مطور واجهة المستخدم أو UI Developer لديه مجموعة واضحة من الأولويات في الإعتبار.
أولاً، يجب أن تكون الواجهة وظيفية.
ثانياً، يجب أن تكون مريحة إلى الحد الذي لا يزعج المستخدم في العمل المتكرر.
وأخيراً فقط، يجب أن تكون الواجهة جميلة، إذا كنا نعني بالجمال جذب العين.
البرامج التي يستخدمها بشكل شائع مطور واجهة المستخدم أو UI Developer هي:
Adobe XD
Sketch
Adobe Photoshop
Adobe Illustrator
Zeplin
Invision App
يعد مطور واجهة المستخدم أو UI Developer الجيد عبارة عن مزيج من مهارات التصميم والدراية الفنية، ومسؤوليته هي الإدراك البصري لواجهات المستخدم.
ماذا عن مطور الواجهة الأمامية أو Front-End Developer، إذن؟ يعد مطور الواجهة الأمامية أو Front-End Developer مسؤولاً عن تشغيل الواجهة ونظامها، على عكس المظهر المرئي الذي صممه مطور واجهة المستخدم أو UI Developer.
إذا أردنا رسم أوجه متوازية مع الوسائط المطبوعة، فسيقوم مطور واجهة المستخدم أو UI Developer بإنشاء التصميم العام، وسيقوم مطور الواجهة الأمامية أو Front-End Developer بعمل تدقيق للصفحة حتى يمكن طباعة هذا التخطيط بالفعل.
يحتاج مطور الواجهة الأمامية أو Front-End Developer إلى معرفة مهارات البرمجة أكثر بكثير من مصمم واجهة المستخدم أو UI Developer ويتعين عليهم فهم بروتوكول HTTP ومبادئ عمل الخوادم والمتصفحات وخصائص عرض الويب على مختلف الأجهزة الموجودة حاليًا في السوق.
يتمثل التحدي المرتبط بتطوير الواجهة الأمامية في أن الأدوات والتقنيات المستخدمة لإنشاء الواجهة الأمامية لموقع ويب تتغير باستمرار ولذا يحتاج المطور إلى أن يدرك باستمرار كيف يتطور السوق.
اليوم، هناك ثلاثة أعمدة يبني عليها مطور الواجهة الأمامية أو Front-End Developer تصاميم الواجهة الأمامية: HTML ،CSS وجافا سكريبت وكمبرمج، يجب أيضًا على مطور الواجهة الأمامية أو Front-End Developer التعلم في مجالات الخوارزميات وهيكلة البيانات وأنماط الترميز والبرمجة الموجهة للكائنات أو object-oriented والنهج الوظيفي.
التقنيات أو لغات البرمجة أو لغات الترميز أو البرامج التي يستخدمها بشكل شائع مطور الواجهة الأمامية أو Front-End Developer هي:
HTML
CSS
Java Script
Php
Angular.js
Sublime Text
React
Chrome Developer Tools
jQuery
GitHub
Twitter Bootstrap
Sass
Ajax
Polymer
Foundation
EmberJS
في كثير من الأحيان، يجب على مطور الواجهة الأمامية أو Front-End Developer إيجاد حلول لمشاكل مطور واجهة المستخدم أو UI Developer في مرحلة تطوير المنتج. وهذا هو السبب في أنها ميزة مهمة بالنسبة لمطور الواجهة الأمامية أو Front-End Developer لأنه يملك بعض المهارات الأساسية لمطور واجهة المستخدم أو UI Developer.
للآسف فهذه المغالطات لا أسمعها فحسب من المبتدئين في مجال البرمجة والمعلوميات ولكن أيضا من الأشخاص العاملين في صناعة تكنولوجيا المعلومات. ولتسوية الأمر مرة واحدة وإلى الأبد، قررت أن أقوم بتحديد الخط الفاصل بين هاتين الوظيفتين اللتين تتمتعان بنفس الدرجة من الأهمية والإهتمام، ولكنهما مختلفتان تماما.
سأبدأ بتعريف واجهة المستخدم في الصناعة الرقمية، تعني واجهة المستخدم أو User Interface كل التفاصيل التي يمكن للمستخدم التحكم فيها أو التفاعل معها (الشاشة ولوحة المفاتيح والماوس ووحدات التحكم الإضافية وما إلى ذلك) عبر أجهزة مختلفة - أجهزة الكمبيوتر المكتبية وأجهزة الكمبيوتر المحمولة والأجهزة اللوحية والهواتف المحمولة.
تطوير الواجهة أو Interface development ، سواء أكانت تطبيقات أو مواقع ويب أو ألعاب أو حتى أجهزة محاكاة (في الواقع، خصوصا أجهزة المحاكاة أو simulators) ، هي عملية معقدة تحمل في طياتها عناصر التصميم والهندسة.
الهدف الرئيسي لمطور الواجهة أو interface developer هو إنشاء واجهة مريحة تلبي احتياجات المستخدم. يجب عليك فهم وتحديد حاجيات المستخدم وأهدافه وأنماط سلوكه وسيناريوهات نموذج تفاعل المستخدم. كلما زاد عدد المجالات التي تتقنها في مجال هذه الصناعة (التحليلات وعلم النفس والتسويق وتجربة المستخدم) ، كلما كنت قادرا على رسم معالم الحلول الأفضل لتلبية ما يريده المستخدم بالضبط.
وظيفة مطور واجهة المستخدم أو UI Developer
بالنسبة لمطور واجهة المستخدم أو UI Developer ، فإن أداة العمل الرئيسية هي برنامج Adobe Illustrator أو برنامج مشابه له لرسم الرسومات وإعداد مواد الغرافيك ويُعد Illustrator جيدًا في التعامل مع رسومات المتجهات، مما يمكّن من تحجيم واجهات المفاهيم وضبطها لمختلف مقاسات الشاشة.
أما بالنسبة للأدوات المساعدة، فقد يستخدم مطور واجهة المستخدم أو UI Developer أيضًا Microsoft Expression Design و Expression Blend وأخيرًا وليس آخرًا، يجب على المصمم أن يتعمق في إرشادات واجهة المستخدم الخاصة بأنظمة التشغيل ذات الصلة، والتي يرغب المستخدم في ضبط الواجهة الخاصة بها.
السمة الحاسمة لمطور واجهة المستخدم أو UI Developer هي التفكير المنطقي، وهذا هو السبب في أن هؤلاء الأشخاص ليسوا أبدًا فنانين محترفين بالمعنى الأدق. مصمم واجهة المستخدم هو فني 100 ٪ ويعتبر النهج الرياضي ضروري للجمع بين الأدوات القياسية من أجل حل مشاكل المشروع أما بالنسبة للإبداع الذي نقدره كثيرًا - لا يُسمح به إلا عندما لا تتمكن الأدوات القياسية من توفير الحل المرضي.
مطور واجهة المستخدم أو UI Developer لديه مجموعة واضحة من الأولويات في الإعتبار.
أولاً، يجب أن تكون الواجهة وظيفية.
ثانياً، يجب أن تكون مريحة إلى الحد الذي لا يزعج المستخدم في العمل المتكرر.
وأخيراً فقط، يجب أن تكون الواجهة جميلة، إذا كنا نعني بالجمال جذب العين.
البرامج التي يستخدمها بشكل شائع مطور واجهة المستخدم أو UI Developer هي:
Adobe XD
Sketch
Adobe Photoshop
Adobe Illustrator
Zeplin
Invision App
يعد مطور واجهة المستخدم أو UI Developer الجيد عبارة عن مزيج من مهارات التصميم والدراية الفنية، ومسؤوليته هي الإدراك البصري لواجهات المستخدم.
ماذا عن مطور الواجهة الأمامية أو Front-End Developer، إذن؟ يعد مطور الواجهة الأمامية أو Front-End Developer مسؤولاً عن تشغيل الواجهة ونظامها، على عكس المظهر المرئي الذي صممه مطور واجهة المستخدم أو UI Developer.
إذا أردنا رسم أوجه متوازية مع الوسائط المطبوعة، فسيقوم مطور واجهة المستخدم أو UI Developer بإنشاء التصميم العام، وسيقوم مطور الواجهة الأمامية أو Front-End Developer بعمل تدقيق للصفحة حتى يمكن طباعة هذا التخطيط بالفعل.
يحتاج مطور الواجهة الأمامية أو Front-End Developer إلى معرفة مهارات البرمجة أكثر بكثير من مصمم واجهة المستخدم أو UI Developer ويتعين عليهم فهم بروتوكول HTTP ومبادئ عمل الخوادم والمتصفحات وخصائص عرض الويب على مختلف الأجهزة الموجودة حاليًا في السوق.
يتمثل التحدي المرتبط بتطوير الواجهة الأمامية في أن الأدوات والتقنيات المستخدمة لإنشاء الواجهة الأمامية لموقع ويب تتغير باستمرار ولذا يحتاج المطور إلى أن يدرك باستمرار كيف يتطور السوق.
اليوم، هناك ثلاثة أعمدة يبني عليها مطور الواجهة الأمامية أو Front-End Developer تصاميم الواجهة الأمامية: HTML ،CSS وجافا سكريبت وكمبرمج، يجب أيضًا على مطور الواجهة الأمامية أو Front-End Developer التعلم في مجالات الخوارزميات وهيكلة البيانات وأنماط الترميز والبرمجة الموجهة للكائنات أو object-oriented والنهج الوظيفي.
التقنيات أو لغات البرمجة أو لغات الترميز أو البرامج التي يستخدمها بشكل شائع مطور الواجهة الأمامية أو Front-End Developer هي:
HTML
CSS
Java Script
Php
Angular.js
Sublime Text
React
Chrome Developer Tools
jQuery
GitHub
Twitter Bootstrap
Sass
Ajax
Polymer
Foundation
EmberJS
في كثير من الأحيان، يجب على مطور الواجهة الأمامية أو Front-End Developer إيجاد حلول لمشاكل مطور واجهة المستخدم أو UI Developer في مرحلة تطوير المنتج. وهذا هو السبب في أنها ميزة مهمة بالنسبة لمطور الواجهة الأمامية أو Front-End Developer لأنه يملك بعض المهارات الأساسية لمطور واجهة المستخدم أو UI Developer.
اترك تعليقك