10 ملحقات جوجل كروم للمصممين

إذا كنت مصمم ويب يتبع عملية التصميم القياسية ، فإن مهامك تتضمن أشياء مثل:

• البحث
• إطارات سلكية
• اختيار نظام الألوان
• اختيار الخط الصحيح
• اختبار العديد من الاختلافات
• التعاون مع العملاء والزملاء

وبعض أكثر…

هل تعلم أنه يمكنك القيام بكل هذه الأشياء وأكثر من خلال متصفحك؟ نعم ، إذا كنت من محترفي Google Chrome ، فيمكنك القيام بكل هذه المهام من خلال ملحقات Chrome. معظمهم بنقرتين فقط.

لذا ، وفر الكثير من الوقت وجرب هذه الإضافات العشرة من Google Chrome للمصممين.

1. اختبار تصميم الويب سريع الاستجابة

بعد تحديث Google المتوافق مع الجوّال ، فإن الاستجابة هي الكلمة الطنانة! إذن ، إليك امتداد يتيح لك اختبار موقع الويب الخاص بك عبر جميع أجهزة Android و Apple المحمولة الرئيسية.

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

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

2. TypeWonder

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

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

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

3. علامة التبويب الرابط

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

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

لحسن الحظ ، ليس عليك العمل بجد. يتيح لك Tab Packager حزم جميع علامات التبويب المفتوحة. وبعد ذلك يمكنك الإرسال عبر رابط الحزمة بنقرة واحدة فقط. يمكنك المشاركة عبر البريد الإلكتروني و Twitter والعديد من الخدمات الأخرى.

4. TrackDuck

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

الآن قد يبدو هذا نوعًا من المبالغة ، لكن TrackDuck يشبه Asana المصغر ، حصريًا للمصممين.

TrackDuck هي أداة تعاون مرئية تتيح لك إضافة مواقع ويب كمشاريع. بمجرد إضافة مشروع ، يمكنك دعوة زملائك في الفريق إليه. كلما تركت تعليقًا على هذا المشروع (أو موقع الويب - وهو ما يمكنك القيام به بمجرد النقر على أيقونة الامتداد) ، يتم إنشاء مهمة حول التعليق. يمكنك تعيين هذه المهمة لزملائك في الفريق وإضافة المرفقات ولقطات الشاشة ودمجها مع الكثير من أدوات التعاون مثل Trello و Basecamp.

5. ColorZilla

أنت لا تعرف أبدًا متى سترى لونًا جميلًا يلهم لوحة ألوان مشروع الويب التالي.

إذن ، كيف يمكنك التقاط أي لون على الويب؟

حسنًا ، ها هي ColorZilla - إنها هدية Chrome المفضلة لكل مصمم بسهولة. الميزة الأساسية والأكثر شيوعًا هي الحصول على رمز لأي لون على صفحة ويب.

ميزة أخرى هي أنه يتيح لك الحصول على مخطط الألوان لأي موقع ويب. سيتعين عليك النقر فوق خيار Webpage Color Analyzer ، وستظهر لوحة تعرض جميع الألوان على صفحة الويب هذه.

6. WhatFont

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

لكن ليس عليك اتباع مسار Inspect Element بعد الآن - يقوم WhatFont بتشريح أي خط على صفحة ويب بنقرة واحدة.

ما عليك سوى النقر فوق رمز الامتداد وتحريك مؤشر الماوس فوق قسم النص الذي تهتم به. ينتج WhatFont نوع الخط وحجمه وطوله ولونه وعائلته.

7. إطار سلكي فوري

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

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

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

8. الصفحة المسطرة

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

تعد Page Ruler أسهل طريقة للقيام بذلك. تتيح لك Page Ruler رؤية ارتفاع العنصر وعرضه وموضعه النسبي. يمكنك أيضًا تحليل عناصر div-wise.

وهو ممتاز لإنشاء لافتات بكسل مثالية وصور مميزة ومواد تسويقية أخرى.

9. لوحة للكروم

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

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

كنت سأحبها أكثر إذا كانت هناك طريقة لتصدير نظام الألوان. لكن التمديد لا يزال ضروريًا.

10. تمديد موزلي - إفطار التصميم

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

تم تصميم ExtensionMuzli للتعويض عن ذلك. يقوم برعاية القصص من حوالي 12 إلى 15 من موارد التصميم الأعلى. يوجد أيضًا قسم وظائف تصميم الويب إذا كنت تبحث عن التبديل.

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

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