একজন ওয়েব ডিজাইনার হিসেবে, আপনার কম্পিউটারে অবশ্যই কী সফটওয়্যার থাকতে হবে? সম্ভবত ফটোশপ এবং ইলাস্ট্রেটর। আর যেই টুলগুলো আপনার ডিজাইন ওয়র্কফ্লোর জরুরি, সেগুলোর পাশাপাশি কিছু ছোট টুল রয়েছে যা আপনি প্রয়োজন হয় বলেও জানেন না।
সর্বোত্তম খবর হলো, সেগুলো ডাউনলোড করতেও হবে না—শুধু এই ক্রোম এক্সটেনশনগুলো ইনস্টল করুন এবং কাজ শুরু। পেজে ফন্ট শনাক্ত করার থেকে ওয়েব এলিমেন্টের মাঝপথের দূরত্ব মাপার পর্যন্ট, এই ওয়েব ডিজাইন ক্রোম এক্সটেনশনগুলো আপনার জীবন সহজ করবে।
১. Dropbox for Gmail
Dropbox ফাইল হোস্টিং সার্ভিস হিসেবে শুরু করেছিল, কিন্তু দ্রুত খুঁজে পায় তাদের প্রধান শ্রোতা ডিজাইনাররা, যারা এই সার্ভিস ব্যবহার করে সহকর্মীদের সাথে কাজ শেয়ার করে। ডিজাইন ফাইলগুলো সাধারণত ইমেইল অ্যাটাচমেন্টের জন্য বড় হয়, তাই Dropbox লিংক পাঠানো সহজ।
Dropbox for Gmail প্রক্রিয়াটি আরও সুবিধাজনক করে দিয়েছে। নতুন ইমেইল উইন্ডোর নিচে Dropbox বাটন দিয়ে ফাইল লিংক করলে রিসিপিয়েন্টকে আপনি কী পাঠাচ্ছেন সেটির একটি ঝলক মেলে। ইমেজ ফাইলের লিংক ইমেইলে সরাসরি আপলোড হবে, এবং অন্যান্য ফাইলের লিংক একটি হ্যান্ডি প্রিভিউ জেনারেট করবে।
ইনস্টল: Dropbox for Gmail
২. FontFace Ninja
হাজার হাজার ফন্ট থাকায় আপনার টাইপোগ্রাফির সম্ভাবনা অসীম। বিশেষ করে যদি আপনি কहीं সুন্দর একটি ফন্ট শনাক্ত করে সেটি আপনার প্রজেক্টের জন্য,uধার নিতে পারেন।
FontFace Ninja হলো একটি ক্রোম এক্সটেনশন যা আপনাকে সেটি করতে সাহায্য করে। ইমেজ থেকে ফন্ট খুঁজে বের করার টুলের মত এটি আপনাকে অনলাইনে দেখা ফন্ট শনাক্ত করতে সাহায্য করে। একমাত্র পার্থক্য হলো FontFace Ninja পেজের CSS-এ কোড করা ফন্ট পড়ে—যেমন হেডিং এবং বডি টেক্সটের টাইপফেস।
FontFace Ninja লঞ্চ করলে আপনি যেই ফন্টের দিকে নির্দেশ করবেন তার ইনফো দেখাবে—শুধু টাইপফেস নয়, বরং ওয়েট, সাইজ, হাইট, উইডথ এবং কালারও। সেই ফন্ট বুকমার্ক করতে চাইলে FontFace Dojo-এ অ্যাকাউন্ট লাগবে।
ইনস্টল: FontFace Ninja
৩. ColorPick Eyedropper
আপনার চোখ কতটোকু চমৎকার কালার সেন্স রাখে, অনলাইনে দেখা একটি নির্দিষ্ট শেড রিক্রিয়েট করা কঠিন যদি না জেন তার RGB বা HTML ভ্যালু। خوشবর, ColorPick Eyedropper থাকলে অনুমান করতে হবে না।
ম্যাকের সেরা কালার পיקר অ্যাপের মত ColorPick Eyedropper আপনাকে যেকোনো কালারের ভ্যালু দেখাবে যেটি আপনি পয়েন্ট করবেন। পার্থক্য হলো এটি সবসময় আপনার ব্রাউজারে থাকে এবং কিছু আপলোড করতে হয় না—শুধু আইকনে ক্লিক করুন এবং টার্গেটকে সঠিক জায়গায় নিন।
এক্সটেনশন টেক্সট, ইমেজ, এবং ওয়েব পেজে দেখা প্রায় যেকোনো জিনিস থেকে কালার পড়ে (বিজ্ঞাপনও)। একবার কালার ক্যাপচার করলে সেটি আপনাকে HTML, RGB, এবং HSL ভ্যালু দেখাবে।
ইনস্টল: ColorPick Eyedropper
৪. Dimensions
এই ওপেন সোর্স এক্সটেনশন ওয়েব ডিজাইনারদের জন্য একটি খুঁজে পাওয়া, বিশেষ করে যদি আপনি ছোট ব্যবসায়ের জন্য এককালীন গিগ করেন। যখন একটি ক্লায়েন্ট আপনাকে কোনো প্রিভিয়াস ফাইল বা ডকুমেন্টেশন ছাড়া একটি ওয়েবসাইট দিয়ে বলে "এটার মত একটি পেজ ডিজাইন করুন, কিন্তু別の টেক্সট এবং ইমেজ দিয়ে," লেআউট ফিগার আউট করা কষ্টসাধ্য।
Dimensions আপনাকে পেজের যেকোনো এলিমেন্টের হাইট এবং উইডথ সহজে মাপতে দেয়, সাথে সেগুলোর মাঝপথের মার্জিনও। এতে বিদ্যমান পেজ রিক্রিয়েট করা এবং প্রোডাকশনে যাওয়ার পর নিজের ডিজাইন ডাবল-চেক করা সহজ হয়।
ইনস্টল: Dimensions
৫. Visual Inspector
Visual Inspector হলো ডিজাইন টিমের জন্য একটি পাওয়ারফুল ফিডব্যাক এবং কলাবোরেশন টুল, যা আগের তিনটি এক্সটেনশনের ফিচার কম্বাইন করে এবং আরও অনেক কিছু যোগ করেছে।
Inspect ট্যাবে, পেজের যেকোনো এলিমেন্ট পিক করে সেটির পূর্ণ তথ্য পাওয়া যায়—ডাইমেনশন থেকে ফাইল নাম পর্যন্ত। Colors এবং Typography সাব-ট্যাবগুলোতে কালার প্যালেট এবং সকল ফন্ট এক নজরে দেখতে পাবেন, Assets পেজের সকল ইমেজ এক জায়গায় সংগ্রহ করে।
Collaborate ট্যাবে আপনি টিমের সাথে ফিডব্যাক দিতে ও আলোচনা করতে পারেন, এবং পেজের যেকোনো এলিমেন্টে ক্লিক করে কমেন্ট ছেড়ে দিতে পারেন।
অন্য অ্যাডভান্সড টুলের মত Visual Inspector-ও দামসহ আসে: কমেন্ট যোগ করতে এবং চেঞ্জ সিঙ্ক করতে মাসিক $9/ইউজার দিতে হবে। তবে এর বেসিক ফিচার যেন কালার, ফন্ট, ইমেজ ইনস্পেক্ট করা, সেগুলো ফ্রি ব্যবহার করা যায়।
ইনস্টল: Visual Inspector
৬. Easy Screen Capture
স্ক্রিন ক্যাপচার এক্সটেনশন অপ্রয়োজনীয় মনে হতে পারে, কারণ ম্যাকেও স্ক্রিনশট নেওয়া বিৎহীন, এবং উইন্ডোজেও একটু বেশি ঝামেলা। কিন্তু Easy Screen Capture-এর বেশ কিছু সেলিং পয়েন্ট রয়েছে।
সর্বোপরি, এটি আপনাকে পুরো ওয়েব পেজ ক্যাপচার করতে দেয়, শুধু স্ক্রিনে যা দেখাচ্ছে সেটি নয়। এটি অমূল্য যখন আপনাকে একটি লম্বা পেজের একাধিক ইস্যু রিপোর্ট করতে হয়, এবং সেগুলো ক্যাপচার করতে তিন-চার স্ক্রিনশট লাগত।
একটি সুন্দর ট্রিক হলো স্ক্রিনশট ক্লিপবোর্ডে কপি করে চ্যাট বা ইমেইলে সরাসরি পেস্ট করা, কম্পিউটারে বেকার ইমেজ ফাইল জমা না করে।
ইনস্টল: Easy Screen Capture
৭. Muzli 2
শেষে, একটা অত্যন্ত গুরুত্বপূর্ণ কাজ আছে যা আপনাকে প্রতিবিহাং সকালে করতে হয়: ঘুমের অবশেষ্ত দিয়ে বের হয়ে গ্রোভে ঢুকা। InVision-এর Muzli 2 আপনার সকালের নিউজপেপার হবে আর্ট, ডিজাইন, UX, এবং টেকনোলজি বিষয়ক কিউরেটেড আর্টিকেলসহ।
Muzli আপনার ডিফল্ট ক্রোম ট্যাব রিপ্লেস করে এবং আপনি সেখানে কী দেখবেন সেটি কাস্টমাইজ করতে দেয়। আপনার ইন্টারেস্ট অনুযায়ী Muzli ফিড পিক করবে, Dribble এবং Behance থেকে 99designs এবং Creative Bloq পর্যন্ত ওয়েবসাইটের রেঞ্জ। প্রথম কফি পান করার সময় স্ক্রল করার জন্য 충분 ইন্সপিরেশন!
আপনি যদি মনে করেন পুরো ব্রাউজার ট্যাব ডিজাইন কন্টেন্ট দিয়ে প্যাক করা অনেক intense, Muzli-র একটি Lite ভার্সনও রয়েছে। এটি আপনার ডিফল্ট ট্যাব ওভাররাইড করবে না, এবং আপনি এক্সটেনশন আইকনে ক্লিক করলে যখন ইচ্ছে ফিড অ্যাক্সেস করতে পারবেন।
ইনস্টল: Muzli 2
সকল ডিজাইন টাস্কের জন্য ক্রোম এক্সটেনশন পান
এই তালিকার ক্রোম এক্সটেনশনগুলো আপনার ডিজাইন সফটওয়্যারের সম্মুখে টিকতে পারবে না, কিন্তু ডিজাইনার হওয়ার সাথে আসা সব ছোট ছোট জিনিস কভার করে—হোক টাইপোগ্রাফি ইন্টেল বা কলিগদের সাথে কলাবোরেশন।
একবার আপনি বুঝতে পারলে যে Chrome Web Store টুলে ভরপুর, নতুন এক্সটেনশন যোগ করা বন্ধ করা কঠিন হয়ে যায়। তাই ক্রোম এক্সটেনশন ম্যানেজ করা শিখুন যাতে সেগুলো আউট অফ কন্ট্রোল না হয়।