আসুন ফটোশপ দিয়েই ইমেজ স্লাইড বানিয়ে ফেলি!!! (ওয়েব ডিজাইনারদের বেশি কাজে দিবে)

এবার ফটোশপ ব্যাবহার করেই কিভাবে ইমেজ স্লাইড বানানো যায় আজ তা আমরা শিখবো।। যেহেতু ফটোশপ দিয়ে বানানো হবে তাই পরিশ্রম মনে হয় একটু বেশিই হবে কিন্তু ভাল ফল পাওয়া যাবে।।

যারা ওয়েব ডিজাইন করে থাকেন তাদের মনে হয় বেশি কাজে লাগবে।। তবে চলুন আসল কাজে নামা যাক>>>

উপরের ছবিটি দেখুন, এখন আমরা কিভাবে এটা বানাতে পারি ফটোশপ ব্যাবহার করে সেটাই দেখব ধাপে ধাপে >>>

ধাপ ১

ফটোশপ ওপেন করে file হতে new তে ক্লিক করলে নিচের মত বক্স আসবে।। ছবির মত সব কিছু ঠিক করে ওকে করে নতুন পেজ বানিয়ে নিন।।

ধাপ ২

এবার আপনাকে স্লাইড এর মূল ফ্রেম বানাতে হবে।। সেজন্য আপনাকে foreground color নির্বাচন করতে হবে।। এখানে কালার কোড #06d0fb দেয়া হল, তাতে নিচের মত রঙ আসবে।। আপনি ইচ্ছা মত দিতে পারেন।। ছবিটা দেখেন তাহলে ক্লিয়ার হতে পারবেন।।

ধাপ ৩

এবার আপনাকে লেয়ার ওপেন করতে হবে।। সেজন্য বাম দিকের মেনু গুল হতে rectangle layer এ ক্লিক করে “Layer Style” window ওপেন করেন।।

এবার নিচের ছবির মত সেটিং গুলো পরিবর্তন করুন।।

ধাপ ৪

এবার নতুন rectangle বানাতে হবে 926px width ও 270px height দিয়ে ।। আর কালার দিতে হবে #08a2c3 ।।

rectangle বানাতে new এ ক্লিক করলেই হবে।।

এবার নতুন rectangle এর জন্য নিচের ছবির মত সেটিং গুলো ঠিক করে নিন।।

ধাপ ৫

আবার 912px width ও  252px height দিয়ে rectangle বানাতে হবে আর color কোড হবে #222222

ধাপ ৬

এবার ফটোশপ এর file হতে open এ ক্লিক করে একটা ইমেজ সিলেক্ট করে তা ড্রাগ করে এবং রিসাইজ করে লেয়ারের মধ্যে নিতে হবে।। সংক্ষেপে (Ctrl + “T”) চাপলে ফ্রী ত্রান্সফের করা যায়।।

ইমেজের লেয়ারের উপর ডবল ক্লিক করে সেটিং গুলো নিচের মত পরিবর্তন করে নিতে হবে।।

ধাপ ৭

এখন টেক্সট এর জন্য নতুন লেয়ার সিলেক্ট করতে হবে।। আমি এখানে Androgyne ফন্ট ইউজ করেছি, আপনি ইচ্ছা মত করতে পারেন।।

ধাপ ৮

এবার আমরা বাটন বানাবো পরের ইমেজ দেখার জন্য।। সেজন্য আপনাকে rounded rectangle ব্যাবহার করতে হবে।।  সেটিং গুলো নিচের মত পরিবর্তন করতে পারেন।। কালার কোড #e32121

ধাপ ৯

বাটনের জন্য লেয়ার স্টাইল ওপেন করে  সেটিং গুলো নিচের ছবির মত করে নিন।।

ধাপ ১০

এখন আমরা কিছু টেক্সট অ্যাড করবো।। তার আগে drop shadow এর সেটিং ঠিক করে নিন।।

লাল বাটনের উপর Right- ​​click করে টেক্সট লেয়ার থেকে “Copy Layer Style.” সিলেক্ট করতে হবে ।। এবার right-​​click করতে হবে “Description” এর উপর, “Paste Layer Style” সিলেক্ট করে সেটিং গুলো পরিবর্তন করে নিতে হবে।।

ধাপ ১১

এখন আমরা স্লাইড এর কন্ট্রোল বানাবো।। সেজন্য pen tool ব্যাবহার করতে হবে ।। নিচের মত shape shown ড্র করতে হবে।। আর সেটিং গুলো ইমেজ দেখে ঠিক করে নেন।।

এখন লাল বাটন হতে লেয়ার স্টাইল কপি করে নতুন drawn shape layer এ পেস্ট করতে হবে।।

এখন ব্যাক সাইড এ নতুন shape অ্যাড করতে হবে।। ২ টি rounded rectangle বানাতে হবে কালার হবে #2e2e2e , (Ctrl + “T”). চেপে ফ্রী ত্রান্সফের করে ড্রাগ করে বসাতে হবে নিচের ইমেজের মত করে।।

ধাপ ১২

এখন ellipse tool থেকে “Shape” tool ড্র করে লেয়ারের উপরে ellipse বসাতে হবে।।  fill color হবে #313131  এবং #c1c1c1 হবে 2px stroke এর জন্য ।।

ছবির মত সেটিং পরিবর্তন করুন।।

ধাপ ১৩

এখন  #57fff5 কালার foreground এর জন্য  এবং  একটা arrowhead আকাতে হবে  pen tool. ব্যাবহার করে।।

ধাপ ১৪

এখন অনেকটা ফ্রেম হয়ে গেছে।। এখন আমরা যেটা করবো তা হল নিচে ক্লিক বাটন বানাবো।। জেন পরের ইমেজ এ ইচ্ছা মত যেতে পারি সেজন্য frontmost parts হতে লেয়ার এ   “Edit” > “Transform” > “Flip Horizontal” এ গিয়ে right side এ পরিবর্তন করতে হবে।। তাহলে নিচের মত পরিবর্তন আসবে।।

ধাপ ১৫

এখন slider navigation বানাতে হবে।।  এটা   pen tool ব্যাবহার করে বানাতে হবে।। color #d1d1d1.

এখন লাল অংশের বাটন টুকু লেয়ার কপি করে নতুন navigation layer এ পেস্ট করতে হবে।। আঙ্গেল করে ২ টি নতুন rectangles বানাতে হবে।।

ধাপ ১৬

navigation complete হলে নিচের ছবির মত দেখাবে।।

একটি inner shadow অ্যাড করতে হবে নিচের মত ভেলু দিয়ে।।

ধাপ ১৭

আমাদের স্লিদের এখন অনেকটাই রেডি।। এখন আমরা কিছু আইটেম যুক্ত করবো তা যেন দেখতে সুন্দর হয় সেজন্য।। ছবির দিকে খেয়াল করুন

লাল অংসর অবজেক্ত টুকু অ্যাড করবো ।।

ধাপ ১৮

এখন একটা একটা করে অবজেক্ট বানিয়ে নিতে হবে আর তা নিদিষ্ট স্থানে লাগাতে হবে।।

ধাপ ১৯

রিবনের সেটিং গুলো নিচের মত হবে।।

ধাপ ২০

রিবনের মধ্যে কোন টেক্সট ও লিখে দেয়া যাবে।। ছবিতে তা দেখান হয়েছে।।

ধাপ ২১

সব শেষে আমরা একপাসের রিবনকে Transform করে সব কনায় বসাতে পারি।। সেজন্য rectangle বানিয়ে “Edit” > “Transform” > “Distort.” এখান থেকে ইচ্ছা মত স্থানে বসাতে পারবো।।

ধাপ ২২

এখন  shadow layer এ right-​​click করে option থেকে “Rasterize Layer,” and go to “Filter” > “Blur” > “Gaussian Blur.”  তে গিয়ে তা ৪০% করে দিতে হবে।। নিচের ছবির মত করে।।

কাজ শেষ।।

অনেক গুলো ধাপ পার হতে হয়েছে তাই লেখা গুলো খুব ই সংক্ষেপ হয়ে গেছে।।

এমন অনেক সফট আছে যেগুলো দিয়ে এই কাজ ২ মিনিটে করা যায়।। যেহেতু ফটোশপ দিয়ে করছি তাই জিনিস যেমন ভাল হবে কাজ টাও একটু কঠিন হবে ।। আজ এই পর্যন্তই।। ভাল থাকেন সবাই।।