freeCodeCamp/guide/arabic/miscellaneous/design-resources-for-front-.../index.md

11 KiB

title localeTitle
Design Resources for Front End Developers موارد التصميم لمطوري الواجهة الأمامية

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

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

هنا الحاجة…

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

إذن، أين تبدأ؟ إلى أين تذهب للتعرف على التصميم؟ لحسن الحظ ، لست بحاجة إلى دفع المال لتعلم أساسيات التصميم الأساسية. هناك العديد من الموارد المتاحة بنسبة 100٪ مجانًا. إليك 10 موارد (معظمها مجانية) تساعدك على أن تكون مطورًا أماميًا مستقلاً أفضل لأنها ستساعدك على أن تكون مصممًا أفضل. إستمتع!

1. Hackdesign.org

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

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

2. تصميم للقراصنة

تم تلخيص سبب ديفيد كادفي لكتابة الكتاب بشكل جيد في هذا الاقتباس:

"يمكننا إنشاء منشورات وبطاقات بريدية وعروض PowerPoint التقديمية مع رسوم متحركة. يمكننا إنشاء مدونات وملصقات وحتى أكواب قهوة ... لكن القليل منا لا يعرفون القراءة والكتابة."

الشيء نفسه ينطبق على إنشاء مواقع الويب. لا يعني مجرد إنشاء موقع ويب يعمل أنه يمكنك إنشاء موقع ويب جميل جيد التصميم. هذا لا يعني أنه يمكنك إنشاء موقع ويب يبدو احترافيًا. أنا متأكد من أنك تعرف ما أعنيه. تصميم جيد يبدو المهنية. فترة. لذلك ، قراءة هذا الكتاب. لدى Kadavy أيضًا موقعًا على الويب في designforhackers.com ، حيث يمكنك الاشتراك في دورة عبر البريد الإلكتروني تسمى "Design Pitfalls".

3. دورة UX Crash Course: 31 أساسيات

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

يعد "مسار التحطم" هذا من تأليف جويل مارش أمرًا رائعًا لتعلم أساسيات UX. يقول: "القائمة التالية ليست كل ما يمكنك تعلمه في UX. إنها نظرة عامة سريعة ، لذا يمكنك الانتقال من الصفر إلى البطل في أسرع وقت ممكن". ماذا تنتظر؟ البدء!

4. UX Crash Course: User Psychology

الجزء الثاني من دورة UX Crash Course الرائعة لـ Joel Marsh: 31 أساسيات. يلخص لماذا هذا مهم:

"... كلما فهمت مشاعر المستخدمين وأفكارهم وتصرفاتهم ، كلما كان المصمم أفضل".

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

5. لوحة المواد

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

6. أساسيات Adode Photoshop

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

7. أساسيات Adobe Illustrator

قد تفكر أنه بما أنك لست فنانًا تصويريًا ، فلا داعي لمعرفة كيفية استخدام Adobe Illustrator. خطأ! بالتأكيد ، ربما لن تقوم بإنشاء عمل فني خاص بك من البداية. ومع ذلك ، ماذا لو كنت تريد استخدام فن ناقلات شخص آخر؟ لنفترض أنك عثرت على صورة جميلة للمتجهات على iStock والتي تريد استخدامها. ومع ذلك ، فإن اللون غير صحيح أو كنت ترغب في حذف جزء من الصورة. ليس هناك أى مشكلة. تعلم أساسيات Illustrator وقم بإنجاز المهمة في أي وقت من الأوقات!

8. عناصر أسلوب الطباعة المطبقة على شبكة الإنترنت

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

9. لا تجعلني أفكر ستيف كروج

أنت تبني مواقع سيستخدمها الأشخاص الحقيقيون. لا تريد أن تؤدي مواقعك إلى تعقيد الحياة وإحباط الناس. تريد أن تجعل مواقعك حياتك أكثر سهولة. حسنًا ، ستحتاج إلى معرفة شيئًا عن قابلية استخدام الويب ، وهذا هو الكتاب الكلاسيكي حول قابلية الاستخدام على الويب. يقول جيفري زيلدمان ، مؤسس مجلة A List Apart ، "إذا قمت بتصميم ، أو كتابة ، أو برمجة ، أو امتلاك ، أو إدارة مواقع ويب ، يجب عليك قراءة هذا الكتاب." احسنت القول. اقرأ هذا الكتاب.

10. The Creativity Challenge by Tanner Christensen

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