আজ আমরা দেখবো কিভাবে ফটোসপে ব্যানার বানানো যায়। পর্যায়ক্রমে আমরা শিখব অ্যানিমেটেড ব্যানার, 125×125 ব্যানার অ্যানিমেটেড ব্যানার, 728×90 ব্যানার, 250×250 ব্যানার, 160×600 ব্যানার ইত্যাদি।
যদিও এই টিউটোরিয়ালটি পড়ার পর কেউ কেউ বলবে যে, এটা সফটওয়ার দিয়ে তৈরি করা যায় তবুও আমি দিচ্ছি যারা সফটওয়ার ব্যবহার না করে মাথা খাটিয়ে ফটোসপ দিয়ে তৈরি করতে চান।
যারা এই ফালতু পোস্টটি পড়ে বিরক্ত হতে চান না তারা কিবোর্ড থেকে Ctrl+F4 চাপুন। আমি অদৃশ্য হয়ে যাব।
এই অংশের পরেও যারা পড়ছেন তারা ঝটপট ফটোসপ ওপেন করে ফেলুন। আজ আমরা শিখব 468×60 সাইজের ব্যানার তৈরি। তাই এই সাইজের একটি নতুন ফাইল নিন।
আজ আমরা পেন টুল দিয়ে কাজ করব। পেনটুল দিয়ে প্রথমে চিত্রের মত করে এঁকে নিন। যারা পেনটুল নিয়ে কাজ করতে পারে না তাদের চুপি চুপি বলছি পেনটুল দিয়ে দারুন গ্রাফিক্স করা যায়।
কিবোর্ড থেকে p চাপলেই পেনটুল সক্রিয় হবে। তারপর জায়গামত ক্লিক, ড্র্যাগ করে কাজ করতে হবে। যেখান থেকে শুরু করবেন সেখানে গিয়ে শেষ করবেন। আমি প্রথমে গাঢ় লাল রং নিয়ে পেন টুল দিয়ে নিচের মত ব্লক করলাম
তারপর আবার হলুন রং নিয়ে নিচের মত ব্লক করলাম
এরপর ইমেজটাকে ফ্ল্যাটেন করতে হবে। এর আগের আমরা Flatten Image করা শিখেছি। পারা দেখেন নি তারা দেখেনিন কিভাবে ফ্ল্যাটেন করতে হয়
এরপর সাদা অংশ ম্যাজিক টুল দিয়ে ব্লক করে ফেলুন। কিবোর্ড থেকে w চাপলে ম্যাজিক টুল সক্রিয় হয়।
কালার প্যালেটে কমলা রং সিলেক্ট করে কিবোর্ড থেকে Alt+backspace দিন।
ওয়েব লিংক দেওয়ার জন্য ডানের শেষের দিকে একটি বক্স আঁকতে হবে। কালার প্যালেটে থেকে কালার সিলেক্ট করার পর rounded rectangle tool সিলেক্ট করুন
আমি নিচের রঙে দিলাম।
ওখানে আপনার কাংখিত ওয়েব লিংকটা টাইপ টুলের সাহায্যে দিন। কিবোর্ড থেকে t চাপলে টাইপটুল সক্রিয় হবে
আপনি যে বিষয়ের উপর ব্যানার বানাচ্ছেন তার শিরোনাম বড় করে দিন
সেই শিরোনামের স্লোগান দিন
আপনি চাইলে লোগেও ধরে এনে এখানে বসাতে পারেন ঘাড় ধরে
দেখুন তো ব্যানারটি কেমন হল!!
সোর্স ফাইল চাইলে এখান (৪৮ কিলোবাইট) থেকে ডলো করতে পারেন।
আমাকে পাবেন
এনিমেটেড ব্যানার বানানোর পদ্ধতি
আমরা দেখবো কিভাবে ব্যানারকে সিম্পল অ্যানিমেটেড করা যায়। এই ধাপে আপনাকে ফটোসপ এবং ইমেজরেডি ব্যবহার করতে হবে।যারা শিখতে চান তারা ফটোসপ ওপেন করুন। নতুন একটি ফাইল নিন 468×60 সাইজের। রেজুলেশন দিন ৭২।
কালার প্যালেটে আকাশি রং সিলেক্ট করে পেন টুল দিয়ে চিত্রের মত স্থান সিলেক্ট করে নিন (কিবোর্ড থেকে p চাপলেই পেনটুল সক্রিয় হবে)
তারপর কালার প্যালেট থেকে লাল রং সিলেক্ট করে rounded rectangle tool সিলেক্ট করে বামে নিচের দিকে নিচের মত সিলেক্ট করুন।
আপনি চাইলে লাল রঙের এই অংশটুকু হাইলাইট করার জন্য ব্লেন্ডিং অপশন ব্যবহার করতে পারেন। এজন্য এই অংশের লেয়ারের উপর রাইট ক্লিক করুন। (লেয়ার প্যালেট আনতে কিবোর্ড থেকে F7 চাপুন)
এখান থেকে Blending Options এ ক্লিক করুন। এবং চিত্রের মত স্ট্রোক দিন
বাকী থাকা সাদা অংশ ম্যাজিক টুলের সাহায্যে ব্লক করুন (কিবোর্ড থেকে w চাপলে এটি সক্রিয় হবে)
এখানে গ্রেডিয়েন্ট দিন। (কিবোর্ড থেকে g চাপলে এটি সক্রিয় হবে) আমি চিত্রের মত দিলাম
এরপর আপনার সাইটের শিরোনাম দিন। আমি টিউটোবিডি কে নিচের মত দুই রঙে দিলাম
নিচের লাল অংশে সাইটের ঠিকানা দিন
এরপর ডান পাশের ফাকা স্থানে আপনার সাইট সম্পর্কে লিখতে পারেন।
এখানে একটা ব্যাপার লক্ষনীয় যে, যেহেতু আমরা একাধিক টেক্সট দিব তাই আমরা একটি টেক্সট দেওয়া শেষ হয়ে গেলেই লেয়ার প্যালেট থেকে টেক্সটকে অদৃশ্য/hide করে রাখব। নিচের চিত্রের স্থানে ক্লিক করে টেক্সট লেয়ার বা যে কোন লেয়ার হাইড করে রাখা যায়
এরপর আরেকটি টেক্সট দিন। এভাবে যতগুলো ইচ্ছ ততগুলো দিন
অনেকগুলো টেক্সট দেওয়ার পর আমাদের ফটোসপের কাজ শেষ। এরপর আমরা ইমেজরেডিতে শিফট করব। এজন্য চিহ্নিত স্থানে ক্লিক করুন
ইমেজরেডিতে গেলেই অ্যানিমেশন নামে একটি টুলবার পাবেন। এটা না থাকলে উইন্ডোমেন্যু থেকে এনে নিন। এখান থেকে আপনার যতটি টেক্সট ততটি ফ্রেম কপি করুন। ফ্রেম কপি করতে চিত্রের স্থানে ক্লিক করুন
আমি লেখায় তিনটি টেক্সট দিয়েছি বলে তিনটি ফ্রেম তৈরি করেছি
খেয়াল রাখবেন প্রতিটি ফ্রেমের উপর ক্লিক করলে যেন আপনার প্রতিটি টেক্সট দেখা যায়। এটা আপনি লেয়ার প্যালেট থেকে করতে পারবেন। শুধুমাত্র এখান থেকে Show/Hide এ ক্লিক করে করা যায়। এখান থেকে চোঁখ চিহ্নিত স্থানে ক্লিক করে শো বা হাইড করতে পারবেন।
এরপর আপনাকে প্রতিটি ফ্রেমের অ্যানিমেশন এর সময় দিতে হবে। সবগুলো ফ্রেম সিলেক্ট করে চিত্রের স্থানে ক্লিক করে নিচের মত সময় নির্ধারণ করে দিন
একটা জিনিস এখানে খেয়াল রাখবেন যেন, বামপাশে Once এর স্থলে Forever করা থাকে। এখানে Once থাকলে অ্যানিমেশন একবার হবে এবং Forever থাকলে অ্যানিমেশন চলতেই থাকবে।
তারপর এটি সেভ করার পালা। এটিকে সেভ করতে File>Save Optimized As এ ক্লিক করুন
এরপর একটি নাম দিয়ে সেভ করুন। আমি উপরোক্ত ইমেজটি সেভ করলাম। দেখুন কেমন হল
এই টিউটোরিয়ালটি লিখতে ১৮ টি ইমেজ ব্যবহার করা হয়েছে যার সাইজ মাত্র ৩২০ কিলোবাইট এবং এই ইমেজগুলো আমার নিজস্ব সার্ভার থেকে স্ট্রিমিং করা হয়েছে। ইমেজগুলোর মান অক্ষুণ্ণ রেখে সাইজ বিশেষ ব্যবস্থায় কমানো হয়েছে যাতে টিউটোরিয়ালটি তাড়াতাড়ি ওপেন হয় এবং আপনাদের ব্যান্ডউইডথ কম ফুরোয়।
আশাকরি কিছুটা হলেও শিখতে পেরেছেন। ধন্যবাদ মনযোগসহকারে পড়ার জন্য।
খুবই সুন্দর কাজ করেছেন রাসেল ভাই। আমি চিন্তা করছি টিউটরিয়ালবিডির একটি বিজ্ঞাপন বানাবো। আপনার সহযোগিতা দরকার।
সুন্দর উপস্থাপনা! কাজটি খুব সহজ কিন্তু আউটপুট অসাধারণ।
ধন্যবাদ রাসেল ভাই।
@ashim : অনেক দিন পরে অসীম ভাইকে মতামতে পেলাম। আপনার নিয়মিত উপস্থিত কামনা করছি। রাসেলের টিউটরিয়ালটি আসলেই দারুন।
আমি আমার বন্ধুর পিসিতে এনিমেশনটি করে ছিলাম। কিন্তু আমার পিসিতে সেভ করার পর এনিমেশন হয় না। আমি পুরাতন ভারসন ফটোশপ ০৭ ব্যবহার করেছি। দয়া করে সহযোগিতা করলে খুশী হবো। ধন্যবাদ।
nikolai কে: একই ভার্শণের ফটোশপ ব্যবহার করে দেখেন। জিআইএফ ফরমেটে সেভ করলে আপনার পিসিতেও সমস্যা করবে না। ধন্যবাদ।
কি বলেন ভাই আমি তো এই টিউনে ৫-৬ F5 এর কাজ করছিলাম………………………………
@ইমরান, একটা জিনিস বুঝতেছি না। আমাদের টিউটরিয়াল বিডির টিউটোরিয়ালকে(পোস্ট) সবাই টিউন বলে কেন? টিউন টেকটিউনস এর জন্য প্রজয্য। টিউটরিয়াল বিডির পোস্টকে টিউটোরিয়াল বলতে হবে।
অন্যথায় আমি তার নামে মান হানির মামলা করবো!
@শিবলী,
এ দুটোর মধ্যে পার্থক্য কী?
অন্যথায় আমি তার নামে কমেন্ট হানির মামলা করবো!। 🙂
নাকি বিষয়টা এ রকমঃ
টেকটিউনস=টিউন (উদাঃএই টিউন জোস)
টিউটেরিয়ালবিডি=টিউটেরিয়াল (এই টিউটেরিয়াল জোস)
blogger-shibly.blogspot=শিবলি(উদাঃএই শিবলি জোস)
imrantalukder.blogspot= তালুকদার(উদাঃএই তালুকদার জোস)
ফেসবুক=বুক (উদাঃএই বুক জোস)
গুগল=গুল (উদাঃএই গুল জোস)
🙂 🙂 ,-)
বিষেশ দ্রবষ্টঃ এ কমেন্ট শুধুই মজার জন্য………………কেউ মাইন্ড করবে না। প্রকৃত পক্ষে আমি বুঝতে পেরিছি এবং এই ভুল আর হবেনা ইনশাআল্লাহ………….
অনেক ধন্যবাদ ভাই।
@ মামু এটা কি ফটোসপ7 তৈরী করা যাবে?