Students Save 30%! Learn & create with unlimited courses & creative assets Students Save 30%! Save Now
Advertisement
  1. Design & Illustration
  2. Icon Design
Design

কিভাবে Adobe Illustrator এ অ্যান্ড্রয়েড লঞ্চার আইকন একটি প্যাক তৈরি করবেন

by
Difficulty:BeginnerLength:LongLanguages:

Bengali (বাংলা) translation by Zakaria Hossain (you can also view the original English article)

Final product image
What You'll Be Creating

আজকের টিউটোরিয়ালে আমরা আমাদের নিয়মিত প্রোগ্রামে কিছুটা পরিবর্তন করতে যাচ্ছি এবং এমন একটি বিষয় মোকাবেলা করছি যা আমি দীর্ঘদিন ধরে করতে চেয়েছিলাম। আপনি যদি শিরোনাম থেকে এটি ছদ্মবেশিত না করে থাকেন তবে ভাল, আমরা পাঁচটি সহজ আইকন তৈরি করতে যাচ্ছি যা আপনি ভবিষ্যতের কোনও অ্যাপ্লিকেশনের জন্য অ্যানড্রয়েড লঞ্চার আইকনে পরিণত হতে পারেন যা আপনি তৈরি বা তৈরি করতে জড়িত হতে পারেন।

প্রসেসের জন্য, আমরা আপনার মৌলিক মৌলিক নির্বাচনকে সমন্বয়কারী প্যানেল এবং অন্য কিছু সরঞ্জামগুলির সাথে মিলিত করব যা আপনি সম্ভবত প্রতিদিনের সাথে কাজ করেন।

যে বলেন, কফি একটি নতুন ব্যাচ ধরুন এবং এর শুরু করা যাক

ওহ, এবং ভুলবেন না যে আপনি সবসময় GraphicRiver এর উপর শিরোনাম দ্বারা প্রকল্পের প্রসারিত করতে পারেন, যেখানে আপনি টন প্রচুর অসাধারণ অ্যানড্রয়েড ডিজাইন আইকন প্যাক পাবেন, শুধু ক্লিক করা অপেক্ষা করুন

১. কিভাবে একটি নতুন নথি সেট আপ করুন

যেহেতু আমি অনুমান করছি যে আপনি ইতিমধ্যেই Illustrator আপ এবং পটভূমিতে চলমান আছেন, এটি তুলে আনুন এবং নিম্নলিখিত সেটিংস ব্যবহার করে একটি নতুন ফাইল (File > New or Control-N) সেট আপ করুন:

  • আর্টবোর্ড সংখ্যা: ১
  • প্রস্থ: 800 পিএক্স
  • উচ্চতা: 600 পিএক্স
  • ইউনিট: পিক্সেল

এবং Advanced ট্যাব থেকে:

  • রঙ মোড: আরজিবি
  • রাস্টার প্রভাব: পর্দা (72ppi)
  • প্রিভিউ মোড: ডিফল্ট
setting up a new document

কুইক টিপ: আপনি কিছু লক্ষ্য করেছেন যে পিক্সেল গ্রিড বিকল্পের জন্য Align New Objects to Pixel Grid অনুপস্থিত, কারণ আমি সফ্টওয়্যারের নতুন সিসি 2017 সংস্করণটি চালাচ্ছি, যেখানে ইলাস্ট্রেটর পদ্ধতিটি পরিচালনা করার উপায় হিসেবে মহান পরিবর্তনগুলি তৈরি করা হয়েছে অন্তর্নিহিত পিক্সেল গ্রিডে স্ন্যাপের আকার।

২. কিভাবে একটি কাস্টম গ্রিড সেট আপ করুন

যেহেতু আমরা একটি পিক্সেল-নিখুঁত কর্মপ্রবাহ ব্যবহার করে আইকন তৈরি করতে যাচ্ছি, আমরা একটি চমৎকার সামান্য গ্রিড সেট আপ করতে চাই যাতে আমরা আমাদের আকারের উপর সম্পূর্ণ নিয়ন্ত্রণ রাখতে পারি-যেহেতু আমরা পুরোনো সংস্করণটি চালাচ্ছি সফটওয়্যার.

ধাপ ১

Edit > Preferences > Guides & Grid সাবমেনুতে যান এবং নিম্নোক্ত সেটিংস সামঞ্জস্য করুন:

  • গ্রিডলাইন প্রতি: ১ পিএক্স
  • সাবডিভিশন:
setting up a custom grid

দ্রুত টিপ: কিভাবে গ্রাস্ট সিস্টেমের মাধ্যমে অঙ্কিত গ্রিড সম্পর্কে আরও জানতে পারেন কিভাবে ইলাস্ট্রেটর এর এর গ্রিড সিস্টেম কাজ করে।

ধাপ ২

একবার আমরা আমাদের কাস্টম গ্রিড সেট আপ করার পরে, আমাদের আকারগুলি ক্রিস্প দেখায় তা নিশ্চিত করার জন্য আমাদের যা করতে হবে তা হলো View মেনুর Snap to Grid এনাবল করা, যা প্রত্যেকবার আপনার পিক্সেল প্রিভিউতে প্রবেশ করলে Snap to Pixel মধ্যে রূপান্তরিত হবে।

এখন, যদি আপনি পুরো "pixel-perfect workflow"-তে নতুন হয়ে থাকেন তবে আমি দৃঢ়ভাবে আপনাকে কিভাবে পিক্সেল-নিখুঁত আর্টওয়ার্ক তৈরি করতে হয় টিউটোরিয়াল দেখার পরামর্শ দিচ্ছি, যা আপনাকে আপনার প্রযুক্তিগত দক্ষতা বাড়ানোর জন্য কোনও সময়ে সাহায্য করবে না।

৩. স্তরগুলি সেট আপ কিভাবে

নতুন দস্তাবেজ তৈরির সাথে, কয়েকটি স্তর ব্যবহার করে আমাদের প্রকল্পটি গঠন করার জন্য এটি একটি ভাল ধারণা হবে, যেহেতু এই সময়ে আমরা এক সময়ে একটি আইকনকে ফোকাস করে একটি নিয়মিত ওয়ার্কফ্লো বজায় রাখতে পারি।

বলা হচ্ছে যে, Layers প্যানেল আনুন, এবং মোট ছয় স্তর তৈরি করুন, যা আমরা নিম্নরূপ নাম পরিবর্তন করব:

  • লেয়ার ১: রেফারেন্স গ্রিডগুলি
  • লেয়ার ২: ব্যাটারি
  • লেয়ার ৩: সেটিংস
  • লেয়ার ৪: বার্তা প্রেরণ
  • লেয়ার ৫: এলার্ম
  • লেয়ার ৬: ফটো
setting up the layers

৪. রেফারেন্স গ্রিডগুলি যেভাবে তৈরি করবেন

Reference Grids (বা বেজ গ্রিড) সঠিকভাবে সীমাবদ্ধ রেফারেন্স পৃষ্ঠার একটি সেট, যা আমাদের আকার ও দৃঢ়তার উপর মনোযোগ কেন্দ্রীভূত করে আমাদের আইকন নির্মাণের অনুমতি দেয়।

সাধারণত, গ্রিডগুলির আকার প্রকৃত আইকনের আকার নির্ধারণ করে, এবং আপনি সর্বদা আপনার একটি নতুন প্রকল্প শুরু করার সিদ্ধান্তটি নিতে হবে, যেহেতু আপনি সর্বদা ছোট আকারের সম্ভাব্য আকার থেকে শুরু করতে এবং এটিকে নির্মাণ করতে চান।

এখন, আমরা আসল অ্যানড্রয়েড ওএস এর মধ্যে ব্যবহার করার অভিপ্রায় দিয়ে আইকন তৈরি করতে যাচ্ছি, আমরা তাদের রিকমেন্ডেড সাইজ এবং ফরম্যাট গাইডলাইন অনুসরণ করতে হবে, এবং 96 x 96 px এর একটি কাস্টম গ্রিড সেট আপ করতে হবে একটি প্রায় 4 px প্যাডিং।

ধাপ ১

রেফারেন্স গ্রিড স্তরটি লক করা শুরু করে এবং তারপর রেক্টাঙ্গেল টুল (M) ধরুন এবং 96 x 96 পিএক্স কমলা (# F15A24) বর্গক্ষেত্র তৈরি করুন, যা আমাদের আইকনের সামগ্রিক আকার নির্ধারণে সাহায্য করবে।

creating the main shape for the reference grid

ধাপ ২

আরেকটি ছোট 88 এক্স 88 পিএক্স এক (#FFFFFF) যোগ করুন যা আমাদের সক্রিয় অঙ্কন এলাকা হিসাবে কাজ করবে, এইভাবে আমাদের চারপাশে 4 পিএক্স প্যাডিং প্রদান করে।

creating the main shape for the active drawing area

ধাপ ৩ 

Control-G কীবোর্ড শর্টকাট ব্যবহার করে রেফারেন্স গ্রিড রচনা করে দুইটি স্কোয়ার গ্রুপ করুন, এবং তারপর একে অপরের থেকে পিক্সের 24 পিক্সের দূরত্বে তিনটি অনুলিপি তৈরি করুন, যাতে তারা তাদের আর্টবোর্ডের কেন্দ্রে সংযুক্ত করতে পারে।

একবার আপনি সম্পন্ন হয়ে গেলে, বর্তমান স্তরটি লক করুন এবং পরবর্তীতে যান যেখানে আমরা আমাদের প্রথম আইকনটিতে কাজ শুরু করব।

creating and positioning all the reference grids

৫. কিভাবে ব্যাটারি আইকন তৈরি করতে হবে

আমরা ব্যাটারি আইকনটি তৈরি করে প্রকল্পটি বন্ধ করতে যাচ্ছি, এটি একটি শক্তি সংরক্ষণের অ্যাপ্লিকেশনের জন্য ব্যবহার করা যেতে পারে, এমনকি এটি একটি সুবিন্যস্ত সূচক যা থেকে এটি বেশ মৌলিক।

বলা হচ্ছে যে, আপনি ডান স্তর (যে দ্বিতীয় এক হতে হবে) নিশ্চিত করুন এবং তারপর প্রথম রেফারেন্স গ্রিডে জুম যাতে আমরা শুরু করতে পারেন।

ধাপ ১

একটি 88x88 px বৃত্ত ব্যবহার করে আইকন এর ব্যাকগ্রাউন্ড তৈরি দ্বারা শুরু করুন, যা আমরা # 00C853 ব্যবহার করে রং করব, এটি পরে অন্তর্নিহিত সক্রিয় অঙ্কন অংশে সংযুক্ত করবে।

creating and positioning the main shape for the battery icons background

দ্রুত টিপ: যেহেতু Google রঙের জন্য একটি ম্যাটেরিয়াল ডিজাইন নির্দেশিকা তৈরি করে ছিল, তাই আমি ব্যাকগ্রাউন্ডগুলির জন্য আমি কয়েকটি মান মিশ্রিত এবং মিলিত হয়েছি, যা আমি ব্যবহার করেছি।

ধাপ ২

একটি 24 x 40 পিক্স আয়তক্ষেত্র ব্যবহার করে ব্যাটারি এর প্রধান শরীরটি তৈরি করুন, যা আমরা সাদা (#FFFFFF) ব্যবহার করে রং করব এবং তারপর বাম দিকের প্রান্ত থেকে ২0 পিক্সেলের দূরত্বের মধ্যে বৃহত্তর চেনাশোনাতে সেন্স করি।

creating and positioning the main shape for the battery icons body

ধাপ ৩

স্ট্রোক প্যানেলের মধ্যে থেকে সমস্তটি, আমরা স্ট্রোক (Shift-X) দিয়ে তার Fill ফ্লিপ করা এবং তারপর তার ওয়েইটকে 4 পিক্স এবং তার কোণ থেকে বৃত্তাকার যোগদান, সেটিং করে, পুরো শেপটিকে আউটলাইন করে ফেলুন।

turning the battery icons body into an outline using the stroke panel

ধাপ ৪

একটি 4 পিক্স ওজন সঙ্গে একটি 12 x 4 পক্স আয়তক্ষেত্র (#FFFFFF) বা একটি 12 পক্স প্রশস্ত স্ট্রোক (#FFFFFF) ব্যবহার করে প্রথম রাষ্ট্র নির্দেশক বার তৈরি করুন, যা আমরা একটি 4 পয়সা ফাঁক রেখে, ব্যাটারি এর শরীরের সাইন ইন করবে অতার চারপাশে.

creating and positioning the battery icons first state indicator bar

পদক্ষেপ 5

দুটি আরো ইঙ্গিতকারী বার যুক্ত করুন, যা আমরা একে অপরের থেকে 4 পিএক্সের দূরত্বের মধ্যে উল্লম্ব ভাবে স্ট্যাক করব, পরে তাদের একত্রিত করে (কন্ট্রোল-জি) পরে

adding the remaining state indicator bar to the battery icon

ধাপ 6

উপরের টুপিটি যুক্ত করে আইকনটি বন্ধ করুন, যা আমরা একটি ছোট 8 x 4 পিক্স আয়তক্ষেত্র (#FFFFFF) ব্যবহার করে তৈরি করবো যা আমরা 6 পিএক্স (প্যাডিং + 4 প্যাডিং + 2) এর ব্যাসে ব্যাটারিটির শরীরের সাথে সংযুক্ত থাকব। স্ট্রোক উপরের অর্ধেক জন্য px)।

একবার আপনি সম্পন্ন হলে, নির্বাচন করুন এবং গ্রুপ (কন্ট্রোল-জি) সব ব্যাটারি এর কম্পোজিশন আকার ভুলবেন না, আইকন এর কম্পোজিশন বিভাগের জন্য একই জিনিস একই হিসাবে করছেন।

finishing off the battery icon

6. কিভাবে সেটিংস আইকন তৈরি করবেন

ধরুন আপনি প্রথম আইকনটি শেষ করতে পরিচালিত করেছেন, তার স্তরটি লক করুন এবং তারপর পরবর্তীতে (যেটি তৃতীয়টি হবে) সরে যান এবং সেটিংস একের উপর কাজ শুরু করা যাক।

ধাপ 1

আমরা আগের আইকনের সাথে করলে, 88x88 px বৃত্তের সাহায্যে ব্যাকগ্রাউন্ড তৈরি করে শুরু করে, যা আমরা # 2196F3 ব্যবহার করে রং করব, এটি পরে অন্তর্নিহিত সক্রিয় অঙ্কন অংশে সংযুক্ত করবে।

creating and positioning the main shape for the settings icons background

ধাপ ২

একটি 4 x 32 পক্স আয়তক্ষেত্র তৈরি করে বা 4 পিক্সে ওজন দিয়ে একটি 32 পিক্স লম্বা স্ট্রোক তৈরি করে কেন্দ্রের স্লাইডারের কাজ শুরু করুন, যা আমরা সাদা (#FFFFFF) ব্যবহার করে রং করব এবং তারপর কেন্দ্রটি বৃহত্তর বৃত্তের সংখ্যার দিক দিয়ে তার উপরের প্রান্ত থেকে 18 পিএক্স

creating and positionign the main shape for the settings icons center slider

ধাপ 3

একটি 12 x 4 পিক্স আয়তক্ষেত্র (#FFFFFF) ব্যবহার করে স্লাইডারের রাষ্ট্র নির্দেশক তৈরি করুন যা আমরা পূর্ববর্তী তৈরি আকৃতির মধ্যবর্তী সারণি থেকে 4 পিক্সের দূরত্ব থেকে তার নীচে প্রান্ত থেকে সন্নিবেশ করব।

creating and positioning the main shape for the center sliders state indicator

ধাপ 4

4x12 px আয়তক্ষেত্র (#FFFFFF) ব্যবহার করে স্লাইডার নীচের অংশটি যুক্ত করুন যা আমরা স্টেট ইন্ডিকেটর বারের নিচে অবস্থান করব, পরবর্তীতে একসাথে তিনটি আকারের (কন্ট্রোল-জি) নির্বাচন এবং গোষ্ঠীভুক্ত করব।

creating and positioning the main shape for the center sliders lower section

পদক্ষেপ 5

একটি ছোট 4 x 12 px আয়তক্ষেত্র (#FFFFFF) ব্যবহার করে বাম স্লাইডারের জন্য উপরের বিভাগটি তৈরি করুন, যা আমরা কেন্দ্রের স্লাইডারের উপরের প্রান্তে সংযুক্ত করব, এটি এটি থেকে 1২ পিক্সের দূরত্বের মধ্যে অবস্থান করবে।

creating and positioning the main shape for the left sliders upper section

ধাপ 6

একটি 12 x 4 পিক্স আয়তক্ষেত্র (#FFFFFF) তৈরি করে স্লাইডারের স্টেট ইণ্ডিকটাকে যুক্ত করুন যা আমরা পূর্বে তৈরি আকারে উল্লম্বভাবে স্ট্যাক করব, তার নীচের প্রান্ত থেকে 4 পিএক্সের দূরত্ব।

creating and positioning the main shape for the left sliders state indicator

ধাপ 7

বামদিকের স্লাইডারটি নিচের অংশটি যোগ করে শেষ করুণ যা আমরা 4 x 32 px আয়তক্ষেত্র (#FFFFFF) ব্যবহার করে তৈরি করব যা আমরা সূচকটির নীচে অবস্থান করব।

একবার আপনার কাজ সম্পন্ন হলে, তিনটি আকার নির্বাচন করুন এবং তাদের একত্রে গোষ্ঠী (কন্ট্রোল-জি) নির্বাচন করুন যেমন আমরা কেন্দ্রে স্লাইডারের সাথে করেছি।

finishing off the settings icons left slider

ধাপ 8

বামের স্লাইডারের একটি অনুলিপি (কন্ট্রোল-সি> কন্ট্রোল-এফ) তৈরি করে আইকনটি বন্ধ করুন, যা আমরা কেন্দ্রের স্লাইডার থেকে 4 পিএক্স দূরত্বের মধ্যে বৃত্তের ডান দিকে অবস্থান করব।

একবার আপনি সম্পন্ন হয়ে গেলে, নির্বাচন এবং গোষ্ঠী (কন্ট্রোল-জি) এর সমস্ত কম্পোজিশন বিভাগগুলিকে ভুলবেন না যাতে তারা দুর্ঘটনা দ্বারা পৃথক না হয়।

finishing off the settings icon

7. কিভাবে বার্তা আইকন তৈরি করবেন

ধরুন আপনি ইতিমধ্যে পরবর্তী স্তরের (যা চতুর্থটি হতে হবে) পর্যন্ত এগিয়ে নিয়ে যাবেন, তৃতীয় রেফারেন্স গ্রিডে জুম দিন এবং শুরু করা যাক।

ধাপ 1

একটি 88x88 px বৃত্ত ব্যবহার করে আইকন এর ব্যাকগ্রাউন্ড তৈরি করুন, যা আমরা # 7C4DFF ব্যবহার করে রং করব এবং তারপর অন্তর্নিহিত সক্রিয় অঙ্কন এলাকাতে কেন্দ্র সংযুক্ত করা হবে।

creating and positioning the main shape for the messaging icons background

ধাপ ২

32 x 24 px আয়তক্ষেত্র ব্যবহার করে বাম বার্তাপ্রেরণ বাক্সের জন্য প্রধান আকৃতি তৈরি করুন, যা আমরা সাদা (#FFFFFF) ব্যবহার করে রঙ এবং তারপর সক্রিয় অঙ্কন এলাকা এর উভয় বাম এবং শীর্ষ প্রান্ত থেকে 20 পক্সের দূরত্ব অবস্থান।

creating and positioning the main shape for the messaging icons left text box

ধাপ 3

পিক্সেল প্রিভিউ মোড (Alt-Control-Y) চালু করে এবং তার বাম পাশে 10 পিএক্সের একটি বাম পাশে তার নীচে প্রান্তে একটি নতুন নোঙ্গর বিন্দু যোগ করার মাধ্যমে, আমরা তৈরি করেছি এমন আকারটি সামঞ্জস্য করা শুরু করুন অ্যাঙ্ক অ্যাঙ্কর পয়েন্ট টুলের সাহায্যে ক্লিক করুন।

একবার আপনি সম্পন্ন হলে, Alt-Control-Y কীবোর্ড শর্টকাট ব্যবহার করে পিক্সেল প্রিভিউ মোড থেকে বের হতে ভুলবেন না।

adding a new anchor point to the bottom edge of the messaging icons left text box

ধাপ 4

ডাইরেক্ট সিলেকশন টুল (এ) দিয়ে তার নিচের বাম নোঙ্গর বিন্দুটি নির্বাচন করে আয়তক্ষেত্রটি সামঞ্জস্য করে চালিয়ে যান এবং তারপর মুভ টুলটির সাহায্যে এটি 8 পিক্সে নীচের দিকে ঠেলে দিন (ডান ক্লিক> ট্রান্সফর্ম> মোড> উল্লম্ব> 8 পিক্স )।

adjusting the shape of the messaging icons left text box

পদক্ষেপ 5

ফলে আকৃতিটি একটি স্ট্রোকের সাথে ফিলিন করে তার স্ট্রোক (Shift-X) এবং তারপর তার ওজনকে 4 পিএক্স এবং তার কোণে গোলাকার যোগফলের সাথে সেট করে ফেলুন।

turning the messaging icons left text box into an outline

ধাপ 6

10x4 px আয়তক্ষেত্র তৈরি করে ছোট টেক্সট লাইন যোগ করুন, যা আমরা সাদা (#FFFFFF) ব্যবহার করে রং করব এবং তারপর সামান্য বার্তার বক্সের ভিতর অবস্থান করে, এটি উপরে-বাম কোণার দিকে সন্নিবেশিত করে, 4 পিক্স ছাড়তে ভুলবেন না। চারপাশে ফাঁক।

creating and positioning the first text line onto the messaging icons left text box

ধাপ 7

20x4 px আয়তক্ষেত্র (#FFFFFF) ব্যবহার করে বৃহত্তর পাঠ লাইনটি যোগ করুন যা আমরা বাম-প্রান্তিকভাবে পূর্বের তৈরি এক থেকে 4 পিক্সের দূরত্ব থেকে বাম পাশের প্রান্ত থেকে সরিয়ে দেব।

একবার আপনি সম্পন্ন হয়ে গেলে, Control-G কীবোর্ড শর্টকাট ব্যবহার করে একসঙ্গে সব টেক্সট বক্সের আকারগুলি নির্বাচন এবং গোষ্ঠীভুক্ত করতে ভুলবেন না।

creating and positioning the second text line onto the messaging icons left text box

ধাপ 8

সামান্য টেক্সট বক্সের রেফারেলের একটি অনুলিপি (কন্ট্রোল-সি> কন্ট্রোল -ফ) তৈরি করুন এবং তারপর প্রতিফলন (ডান ক্লিক> ট্রান্সফর্ম> প্রতিফলন> উল্লম্ব) এবং বৃত্তের ডান দিকের দিকে 18 পিক্সেলের দূরত্বে অবস্থান করুন সক্রিয় অঙ্কন এলাকা উভয় ডান এবং নীচের প্রান্ত

creating and positioning the messaging icons second text box

ধাপ 9

টেক্সট বাক্সের ওভারল্যাপিং বিভাগ (লাল দিয়ে হাইলাইট করা) মুছে ফেলার মাধ্যমে আইকনটি বন্ধ করুন, যাতে আপনি শেষ এবং এর বাম প্রান্তরেখার মধ্যে 4 পিক্সেল ফাঁক রয়েছে। এটি করার জন্য, কেবল তার উপরের এবং বাম প্রান্তে একটি নতুন নোঙ্গর বিন্দু যোগ করুন, এবং তারপর অন্য সব বেশী মুছে ফেলুন।

একবার আপনি সম্পন্ন হয়ে গেলে, কন্ট্রোল-জি কীবোর্ড শর্টকাট ব্যবহার করে সমস্ত আইকনের কম্পোজিশন বিভাগ নির্বাচন করুন এবং তাদের একসঙ্গে গ্রুপ করুন।

finishing off the messaging icon

8. কীভাবে অ্যালার্ম আইকন তৈরি করবেন

এখন থেকে আপনি সম্ভবত ইতিমধ্যে ড্রিলটি জানেন, লেয়ারটি লক করুন এবং পরবর্তী স্তরটি উপরে উঠুন (যা পঞ্চমটি হবে) এবং চলুন শুরু করা যাক আমাদের অ্যালার্ম আইকনে কাজ করা।

ধাপ 1

একটি 88 x 88 পিক্সের বৃত্ত তৈরি করুন, যা আমরা # FFC107 ব্যবহার করে রং করব, কেন্দ্রটি অন্তর্নিহিত সক্রিয় অঙ্কন অংশে সংযুক্ত করবে।

creating and positioning the main shape for the alarm icons background

ধাপ ২

একটি 40 x 40 px বৃত্তের সাহায্যে এলার্ম ঘড়িটির মূল শরীর তৈরি করুন, যা সাদা (#FFFFFF) ব্যবহার করে রঙ করবে এবং তারপর সক্রিয় অঙ্কন এলাকা থেকে সন্নিবেশ করা হবে, এর নীচের প্রান্ত থেকে 20 পিক্সের দূরত্ব

creating and positioning the main shape for the alarm icons body

ধাপ 3

স্ট্রোক প্যানেলের মধ্যে দিয়ে তার প্যাটার্নটি তার স্ট্রোকের সাথে পূরণ করে এবং তার ওজনকে 4 পিক্সের মধ্যে সেট করার মাধ্যমে আমরা একটি রূপরেখা তৈরি করেছি।

turning the alarm icons main body into an outline

ধাপ 4

Pen Tool (P) নির্বাচন করুন এবং ক্লক সেটটি সাদা (#FFFFFF) এবং গোলমালের কোণে গোলকের সাথে একটি 4 পিক্সে ঘন স্ট্রোক ব্যবহার করে ঘড়িটির হাতে আঁকুন, সমাপ্তির নোঙ্গর পয়েন্টের মধ্যে 4 পিক্সেল ফাঁক ছেড়ে যাওয়ার নিশ্চিত করুন এবং বড় বৃত্ত

drawing in the little hands inside the alarm clocks main body

পদক্ষেপ 5

উপরে কিছু পিক্সেল সরান, এবং একটি 8 x 6 px আয়তক্ষেত্র (#FFFFFF) তৈরি করুন যা আমরা কেন্দ্রটিকে বৃহত্তর বৃত্তের উপরের অংশে সাইন ইন করব, এটি স্থির করে যাতে এটি স্ট্রোকের শীর্ষ অর্ধেককে ওভারল্যাপিং করে।

creating and positioning the main shape for the alarm clocks upper section

ধাপ 6

আমরা তৈরি করেছি এক শীর্ষে একটি 16 x 4 পিক্স আয়তক্ষেত্র (#FFFFFF) যোগ করুন, নির্বাচন এবং গ্রুপিং (কন্ট্রোল- G) তাদের পরে একসাথে।

finishing off the alarm clocks top section

ধাপ 7

রং দ্বারা সেট করা একটি 4 পিএক্স স্ট্রোক সাদা (#FFFFFF) ব্যবহার করে দুটি ছোট বিকৃতি রেখা অংশে অঙ্কন করে আইকনটি বন্ধ করুন। একবার আপনি নির্বাচন করুন এবং গোষ্ঠী (কন্ট্রোল-জি) সব অ্যালার্ম ঘড়িগুলির কম্পোজিশন আকারগুলি একসাথে করুন, পরে পুরো আইকনটির জন্য একই কাজ করুন।

finishing off the alarm clock icon

9. কিভাবে ফটো আইকন তৈরি করবেন

ষষ্ঠ এবং শেষ স্তর আপনার উপায় করুন, এবং ফটো আইকন তৈরি করে প্রকল্পের শেষ করা যাক।

ধাপ 1

88x88 px বৃত্ত (# FF6F00) ব্যবহার করে আইকনের ব্যাকগ্রাউন্ডটি তৈরি করুন যা আমরা কেন্দ্রীয় সক্রিয় অঙ্কন অংশে সেন্সর করব।

creating and positioning the main shape for the photos icons background

ধাপ ২

একটি 36 x 36 px আয়তক্ষেত্র ব্যবহার করে ছবির মূল শরীরটি তৈরি করুন, যা আমরা সাদা (#FFFFFF) ব্যবহার করে রং করব এবং তারপর কেন্দ্রের উপরের অংশ থেকে ২0 পিক্সেলের দূরত্বের মধ্যে অন্তর্নিহিত সক্রিয় অঙ্কন অংশে সাইন করুন।

creating and positioning the main shape for the photos icons body

ধাপ 3

আমরা একটি স্ট্রোক (Shift-X) দিয়ে তার ভরাট করে flipping দ্বারা, এবং তারপর তার ওজন 4 পিক্স সেটিং এবং তার কোণ থেকে গোলমাল স্ট্রোক প্যানেলের মধ্যে থেকে যোগদান দ্বারা flipping দ্বারা একটি আকৃতি তৈরি করেছি যে আকৃতিটি চালু করুন।

turning the photos icons main body into an outline

ধাপ 4

Pen Tool (P) ব্যবহার করে 4 পক্সের পুরু স্ট্রোক (#FFFFFF) ব্যবহার করে অনুভূমিক বিভাজক লাইনটি আঁকুন, যা আমরা পূর্বে তৈরি আকৃতির ভিতর অবস্থান করব, তার নীচের প্রান্ত থেকে 4 পিক্সের দূরত্বের মধ্যে।

adding the horizontal divider line to the lower body of the photos icon

পদক্ষেপ 5

একই বৃত্তাকার যোগফলের সাথে 4 টি পিএক্স পুরু স্ট্রোক (#FFFFFF) ব্যবহার করে ছবির বাম প্রান্তে আপনার প্রথম নোঙ্গর পয়েন্টটি পজিশন করে, পর্বতটি 10 ​​সেকেন্ডের পকেটে, অনুভূমিক বিভাজক রেখা থেকে, যা আমরা করেছি শুধু তৈরি।

প্রথম এক থেকে উভয় অনুভূমিক এবং উল্লম্ব 10 পিএক্স দূরত্ব এ দ্বিতীয় নোঙ্গর যোগ করুন। তৃতীয় এবং শেষ অ্যাঙ্করকে অনুভূমিক বিভাজক লাইনের উপর দিয়ে পর্বতটি বন্ধ করুন, একটি যথাযথ তির্যক রেখাটি আঁকতে শিফট কীটি ধরে রাখুন।

drawing the photos icons first mountain

ধাপ 6

দ্বিতীয় ছোট পর্বতে, একই 4 পিএক্স পুরু স্ট্রোক (#FFFFFF) ব্যবহার করে অঙ্কন করুন, এবং একবার একবার করুন, কন্ট্রোল-জি কীবোর্ড শর্টকাট ব্যবহার করে একসঙ্গে ছবির সমস্ত কম্পোজিশন আকার নির্বাচন করুন এবং গ্রুপ করুন।

drawing the photos icons second mountain

ধাপ 7

২8 x 6 পিএক্স আয়তক্ষেত্রের মাধ্যমে আইকনের নীচের অংশটি তৈরি করুন, যা আমরা সাদা (#FFFFFF) ব্যবহার করে রং করব এবং তারপর 4 পিক্সের দূরত্বের মধ্যে ছবির সীমারেখা নীচের অংশে সাইন করুন।

creating and positioning the main shape for the lower section of the photos icon

ধাপ 8

আইকনটি বন্ধ করুন, যেটি আকৃতিটি বাঁকিয়ে আমরা একটি গোলাকার যোগফলের সাথে 4 পিক্সের পুরু সীমারেখা (#FFFFFF) তৈরি করেছি এবং তারপর এর উপরের প্রান্তের একটি নতুন নোঙ্গর বিন্দু যোগ করে এটি সামঞ্জস্য করে, যা আমরা তারপর পথ খুলতে সরানো হবে (লাল সঙ্গে হাইলাইট)।

ফলস্বরূপ আকৃতি এবং বাকি ছবির কম্পোজিটি উপাদান নির্বাচন করুন এবং তাদের গ্রুপ (কন্ট্রোল-জি) পরে আইকন এর কম্পোজিং বিভাগের জন্য একই করছেন।

finishing off the photos icon

এটি একটি মোড়ানো!

আমি আশা করি আপনি প্রতিটি পদক্ষেপের সাথে কাজ করতে পরিচালিত করেছেন, এবং প্রক্রিয়াটি চলাকালীন নতুন এবং দরকারী কিছু গুরুত্বপূর্ণ কিছু শিখেছে। যে বলেন, আমি পরের এক আপনি দেখতে পাবেন!

Final Design
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.