8 Principles of design । Design Principles A to Z । বাংলায় ডিজাইন প্রিন্সিপাল শিখুন খুব সহজেই।

 Design Principles

আমরা জানি,

গ্রাফিক্স ডিজাইন এর ক্ষেত্রে, গ্রাফিক্স এর মধ্যে ৮ টি ডিজাইন প্রিন্সিপাল ঠিক আছে কিনা বা ভিজুয়েল ইলিমেন্টস দ্বারা তৈরি কৃত গ্রাফিক্স বা আর্ট এর ( Functional- কার্যকারীতা ) ও ( Aesthetic- নান্দনিক/ অনুভব/ সৈন্দর্যবোধ সংক্রান্ত ) বিষয় গুলো ঠিক আছে কিনা সেটা চেক করাকে ডিজাইন বলে।

অথাৎ,

গ্রাফিক্স সফটওয়্যার বা বিভিন্ন গ্রাফিক্স টুল/ Ai দিয়ে যে আর্ট বা গ্রাফিক্স তৈরি করলেই কোন সমস্যার ভিজুয়েলি পরিপূর্ণ সমাধান হয় না, পরিপূর্ণ সমাধান হতে হলে অব্যশই ডিজাইন অংশের ৮ টি ডিজাইন প্রিন্সিপাল ঠিক আছে কিনা তা চেক করে নিতে হবে। আর আজকে আমরা সেই ৮ টি ডিজাইন প্রিন্সিপাল সম্পর্কে বিস্তারিত জানবো।

একটি ভালো ডিজাইন ও একটি খারপ ডিজাইন এর মধ্যে পার্থক্য সৃষ্টিকারী উপাদান গুলোকে ডিজাইন প্রিন্সিপাল বলে।

What is the reason behind the good & bad design?

নিচের ডিজাইন গুলো আগে দেখুন।

উপরের ডিজাইন গুলো তো দেখলেন। নিশ্চই ভালো লেগেছে।

এবার নিচে আরে কিছু ডিজাইন দেওয়া হল। সেগুলো ভালোভাবে দেখুন।

এবার সত্যি করে বলুন তো, এ ডিজাইন গুলো কি আপনার ভালো লেগেছে? নিশ্চই ভালো লাগেনি।

উপরের প্রথম ডিজাইন ডিজাইন গুলো ভালো লাগার কারণ হল ভালো লাগার উপাদান গুলো বিদ্যমান।

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

একটি ডিজাইন ভালো নাকি খারাপ সেটা যাচাই করার জন্য যে যে বৈশিষ্ঠ্য গুলো প্রতিটা ডিজাইনে থাকা উচিত সে বৈশিষ্ঠ্য গুলোকে বলা হয়  Design Principles.

Design Principles গুলো কি ? কি ?

1. Contrast
2. Balance
3. Hierarchy
4. Alignment
5. Proximity
6. Repetition & Rhythm
7. White space
8. Simplicity

Contrast

What is Contrast?

To highlight anything, When we make some differences in design that is called Contrast.

কোন ডিজাইনে / কোন কিছুতে যদি highlight করতে হয়, তাহলে highlight করার জন্য আমরা যে ভিন্নতা (Differences) টা তৈরি করি তাকে Contrast বলে।

 

 

কোন কিছু আলাদা করার জন্য আমরা যে কাজটা করি সেটাই Contrast.

* Contrast এর কাজ হচ্ছে আমরা যখন কোন Sentence/Design এ কোন কিছুকে Extra ভাবে highlight করতে চাইলেই তখন যে জিনিসটা পরিবর্তন করে অথবা বাকি জিনিসের পরিবর্তন করে আমাদের টার্গেট Word/Design টা কে আলাদা করাই Contrast.

উদাহরণ গুলো দেখলে আরো ক্লিয়ার হয়ে যাবে।

উপরের কোন বৃত্ত টি আগে আপনার চোঁখে পড়েছে? নিশ্চই ডান দিগের বৃত্তটি। কারণ সেটার কালার পরিবর্তন করে highlight করা হয়েছে।

উপরের ছবির কোন লেখাটি টি আগে আপনার চোঁখে পড়েছে? নিশ্চই বাম দিগের লিখাটি। । কারণ বাম দিগের লেখাটি এবং ব্যাগ্রাউন্ডের কালার এমন ভাবে Contrast করা হয়েছে যতে সেটা সুন্দর দেখায় এবং লিখাটি highlight হয়। অন্যদিগে ডান দিগের ছবির লিখা এবং ব্যাগ্রাউন্ডের কালার একেবারে বাজে হয়েছে। ফলে লিখা তত টা বুঝা যাচ্ছে না।

উপরের ছবিতে লাল আপেল টা দিয়ে ভিন্ন তা আনা হয়েছে । নিশ্চই আপনার নজর সর্বপ্রথম লাল আপেল টা দিগে পরেছে। আর এভাবেই কালার পরিবর্তন করে Contrast করা হয়।

How does it work in design?

• To generate impact

• Making highlight

• Showing importance

• Create exciting graphics

• To keep interested

in article ad

Balance

What is Balance?

The visual weighting of a layout is called Balance.

কোন layout বা ডিজাইনের visual যে weight সেটাই Balance.

কোন ডিজাইন কে যদি মধ্যখান বরাবর দুইভাগ করা হয় তখন তার visual যে weight সেটা উভয় পাশে সমান হওয়া কে বা করা কে Balance বলে।

Balance কত প্রকার ও কি কি?

Balance ৩ প্রকার।

01/ Symmetrical balance ( formal balance)

02/ Asymmetrical balance ( informal balance)

03/ Radial balance

01. Symmetrical Balance ( Formal Balance )

What is symmetrical Balance ( formal Balance? )

When equal weights are on equal sides, then it's called Symmetrical Balance ( formal Balance? )

*উভয় পাশে, ডান দিগে - বাম দিগে বা উপরে - নিচে যে দিগে হোকনা কেন দুই পাশে আমরা একটা ডিজাইনকে যখন ভাগ করব, তখন ঐ ডিজাইনের দুটি ভাগ হবে বা ‍দুই সাইড হবে। দুই সাইডে বা দুই পাশে equal weight বা visual যে weight যদি থাকে তখন তাকে আমরা Symmetrical Balance ( formal Balance? ) বলবো।

*উদাহরণ এর মাধ্যমে বিষয়টি বোঝা যাক:

উপরের সব গুলো চিত্র ভালোভাবে লক্ষ্য করুন। এ ডিজাইন গুলো যদি মধ্যখান বরাবর সমান ভাগ করা হয় তাহলে উভয়পার্শে সমান হবে। এর এটাকেই বলা হয় Symmetrical Balance ( formal Balance? ).

বিঃ দ্রঃ লিখার সময় উভয় পার্শে সমান লিখা এবং Paragraph এর ক্ষেত্রে পুরো Paragraph এ ফন্ট সাইজ একই রাখাও Symmetrical Balance ( formal Balance? ) এর অন্তর্ভূক্ত।

02. Asymmetrical Balance ( informal Balance )

What is asymmetrical Balance ( informal Balance? )

Unequal visual weight on each side of the composition.

একটি Design এর উভয়পাশে সমানভাবে যখন ওজন রক্ষা করা হবে, কিন্তু সমানভাবে ওজন রক্ষা করা সত্তেও দেখতে মনে হবে উভয়পাশ সমান নয়, তখন সেটাকে বলে Asymmetrical Balance (informal Balance).

*সহজ কথায়ঃ ডিজাইনের দুই পাশে দেখতে হয় তো একই রকম না, কিন্তু ব্যালেন্স ঠিক থাকবে।

*উদাহরণ এর মাধ্যমে বিষয়টি বোঝা যাক:

উপরের সব গুলো চিত্র ভালোভাবে লক্ষ্য করুন। এ ডিজাইন গুলো দেখতে যদিও সমান মনে হয় না । কিন্তু যদি মধ্যখান বরাবর সমান ভাগ করা হয় তাহলে উভয়পার্শে সমান হবে। এর এটাকেই বলা হয় Asymmetrical Balance (informal Balance).

02. Radial Balance

What is Radial Balance?

When elements radiate from a common center that is Radial Balance.

Desin এর Elements গুলো যখন একটি নির্দিষ্ট সেন্টার হতে বা মাঝখান থেকে শুরু হয় তখন সেটা কে Radial Balance বলে।

মাঝ বরাবর কোন ডিজাইন যখন তৈরি হয়, সে ডিজাইনটা মাঝখান থেকে ছোট থেকে বড় হতে হতে উভয় পাশে সমান হয় তখন তাকে Radial Balance বলে।

*উদাহরণ এর মাধ্যমে বিষয়টি বোঝা যাক:

উপরের সব গুলো চিত্র ভালোভাবে লক্ষ্য করুন। এ ডিজাইন গুলো একটি নির্দিষ্ট কেন্দ্রকে বা মধ্যখান কে কেন্দ্র করে চতুর্দিগে সমান হয়ে ছোট থেকে বড় হয়েছে । চতুর্দিগ সমান রয়েছে। আর এটাকেই বলা হয় Radial Balance.

in article ad

03. Hierarchy

What is the Hierarchy?

Hierarchy is simply a way of organizing things from high to low.
Hierarchy lets the reader know where to look first.

কোন কিছুকে বা কোন element কে বা কোন object কে একটি সংঘবদ্ধ ভাবে সাজানোর জন্য Hierarchy ব্যবহার করতে হবে। আমরা যেন সে element এর শুরু কোথায় এবং শেষ কোথায়, সেটার বড় অংশটি বা মূল অংশটি কোন জায়গায় আছে এবং ছোট অংশটি বা কম গুরুত্বপূর্ণ অংশ টি কোন জায়গায় আছে সেটি চিহ্নিত করে ভিজিটরদের বা ব্যবহার কারীদের কে দেখিয়ে দিতে পারি, সেটাকে Hierarchy বলে।

অথবা,

ভিজিটর বা ব্যহারকরীরা সাধারণত যখনই কোন কিছু দেখে বা কোন কনটেন্ট দেখছে, সে ক্ষেত্রে সে কোন দিগে প্রথমে বা কোন অংশটির দিগে প্রথমে ফোকাস করবে সেই ব্যাপারটি Hierarchy এর মাধ্যমে করা হয়ে থাকে বা করতে পারব।

ডিজাইনের সবচেয়ে গুরুত্বপূর্ণ অংশটি Hierarchy মাধ্যমে ব্যবহার কারীর কাছে প্রথমেই উপস্থাপন করতে পারবো।

Hierarchy can work in many ways?

Shapes:

Scale:

Color:

Typography:

Space & Depth:

Alignment:

Contrast:

উপরের ছবি গুলো ভালোভাবে দেখুন এবং থিওরির সাথে মিলিয়ে দেখুন খুব সহজেই বুঝতে পারবেন।

in article ad

04. Alignment

What is an Alignment?

Refers to lining up the top, bottom, sides, or middle of text or graphic elements on a page.

একটা পেইজে আমরা যখন ডিজাইন করি, সেটা Textul Design হতে পারে, Elementul Design হতে পারে, যা কিছু দিয়ে আমরা ডিজাইন করি না কেন, সে ডিজাইন গুলোর একটি নির্দিষ্ট লাইন ফলো করে কাজ করাই Alignment.

অথবা,

উপরে নিচে, ডানে বামে, আমি কোথায় সমান ভাবে লাইন করতে চাচ্ছি সেটা একটা নির্দিষ্ট লাইন অনুযায়ী ডিজাইন করাকে Alignment বলে।

Alignment কত প্রকার?

There are 2 types of Alignment.

1. Edge Alignment
2. Centre Alignment

01. Edge Alignment

ডানে, বামে কর্ণার বরাবর Align করা বা উপরে, নিচে কর্ণার বরাবর Align করা.

01. Centre Alignment

মাঝ বরাবর Alignment করাকে Centre Alignment বলে।

উপরের উদাহরণ গুলো দেখলে এবং থিওরি গুলো পড়লে আপনি অবশ্যই Alignment সম্পর্কে স্পস্ট ধারণা পাবেন আশাকরি।

in article ad

05. Proximity

What is Proximity?

Proximity means the connection between similar objects and makes them group & separate those who are not similar or related.

একটা ডিজাইন যখন একই রকম কোনো object বা একই রকম element থাকে, সেই element গুলোকে বা সেই একই টাইপের information গুলোকে একসাথে করে ফেলা বা group করে ফেলাটা Proximity এর কাজ।

অথবা,

যে information, element, Object গুলো একরকম না সেগুলো কে আলাদা করে ফেলা ও সমজাতীয় গুলোকে একত্রিত করাকে Proximity বলে।

*উদাহরণ এর মাধ্যমে বিষয়টি বোঝা যাক:

উপরের উদাহরণ গুলো দেখলে এবং থিওরি গুলো পড়লে আপনি অবশ্যই Proximity সম্পর্কে স্পস্ট ধারণা পাবেন আশাকরি।

in article ad

06. Repetition & Rythm

Repetition

What is Repetition?

Repetition means reusing the same elements or objects in our design.

ডিজাইনে একই elements or objects বার বার ব্যবহার করাকে Repetition বলে।

*Repetition কালার হতে পারে।

*Repetition এর দুটি দিক রয়েছে:

1. অনেক ডিজাইনের একই elements or objects বারবার ব্যবহার করলে খারাপ দেখা যায়। তবে প্যাটার্ন এর ক্ষেত্রে ভিন্ন।
2. Branding Design এর ক্ষেত্রে অবশ্যই Repetition করতে হবে।

*উদাহরণ এর মাধ্যমে বিষয়টি বোঝা যাক:

উপরের উদাহরণ গুলো দেখলে এবং থিওরি গুলো পড়লে আপনি অবশ্যই Repetition সম্পর্কে স্পস্ট ধারণা পাবেন আশাকরি।

Rhythm

What is Rhythm?

Rhythm is a repeated pattern of movements. It's created when one or more design elements are used repeatedly to create a feeling.

যে কোন elements or objects বারবার repet করে সেই pattern টা কিছুটা পরিবর্তন করে কোন একটি feeling আনাটাই Rhythm.

অথবা,

Repetition এর মাধ্যমে তৈরিকৃত pattern টি কিছুটা পরিবর্তন করে একটি ফিলিংস আনাটাই Rhythm.

*উদাহরণ এর মাধ্যমে বিষয়টি বোঝা যাক:

উপরের উদাহরণ গুলো দেখলে এবং থিওরি গুলো পড়লে আপনি অবশ্যই Rhythm সম্পর্কে স্পস্ট ধারণা পাবেন আশাকরি।

in article ad

07. White Space

What is White Space?

White Space is the empty space of a design. It helps separate paragraphs of text, graphics, and other portions of a document and helps it look less crowded.

White Space মানে হচ্ছে প্রত্যেকটা ডিজাইনের যে খালি জায়গাটা থাকে, যেখানে কোন কিছু থাকেনা, কোন element থাকে না, যেখানে কোন object বা Shape থাকে না, সে Space টাকে বলা হয় White Space.

অথবা,

কোন paragraphs , text, graphics অথবা যে কোন প্রশ্ন কে ডিজাইন থেকে আলাদা করার জন্য, বা গুরুত্ব দেওয়ার জন্য ডিজাইনের White Space রাখতে হয়।

*White Space ব্যবহার করার কারণে আমাদের ডিজাইন টা ফ্রেশ হয়। ডিজাইনে কোন আজেবাজে জিনিস থাকে না

মুল কথা:

ডিজাইনে পর্যাপ্ত জায়গা খালি রাখাকে White Space বলে।

*এটি ডিজাইনের সৈন্দর্য্যকে বহুগুণে বাড়িয়ে দেয় ও ডিজাইন খুব ‍সুন্দর ও পরিষ্কার হয়ে যায়। দেখতে অনেক সুন্দর লাগে ও মূল ম্যাসেজ বা ইনফরমেশন ভালোভাবে বুঝা যায়।

*উদাহরণ এর মাধ্যমে বিষয়টি বোঝা যাক:

উপরের উদাহরণ গুলো দেখলে এবং থিওরি গুলো পড়লে আপনি অবশ্যই White Space সম্পর্কে স্পস্ট ধারণা পাবেন আশাকরি।

in article ad

08. Simplicity

What is Simplicity?

Simplicity means a user-friendly design where everything will be easy to understand.

ডিজাইন কে user-friendly বা ব্যবহার কারীর বোধগাম্য হতে হবে, যেটা মানুষের কাছে সবসময় খুব সহজ হয়, বুঝার জন্য বা বুঝতে পারার জন্য। ডিজাইনে আমরা যা কিছুই দিচ্ছি মানুষ যেন সেটা খুব সহজেই বুঝতে পারে, দেখতে পারে বা পড়তে পারে । এজন্য ডিজাইন খুবই সিম্পল হওয়া উচিত। এটাকেই বলা হয় Simplicity.

We have to Remember:

• One side and instead of money.
• Avoid using many visual elements.
• Remove details & information that are not needed

*উদাহরণ এর মাধ্যমে বিষয়টি বোঝা যাক:

আশাকরি উপরের উদাহরণ গুলো দেখলে এবং থিওরি গুলো পড়লে আপনি অবশ্যই Simplicity সম্পর্কে স্পস্ট ধারণা পাবেন।

সর্বশেষ আপডেট: ২০ আগস্ট ২০২৩

তথ্য সূত্র:

1. Shuvo Paul এর Graphic Design Course

2. Youtube

3. Google

লেখক ও গবেষক

--------------

মোঃ ইউসুফ

প্রফেশনাল গ্রাফিক্স ডিজাইনার
(মোশন গ্রাফিক্স ডিজাইনার)

Contact and Follow

E-mail: [email protected]
Facebook: https://www.facebook.com/mdyousuffb2
Twitter: https://twitter.com/mdyousuffb

Linkedin: https://www.linkedin.com/in/mdyousuffb/
Behance: https://www.behance.net/mdyousuffb
Dribbble: https://dribbble.com/mdyousuffb
Instagram: https://www.instagram.com/mdyousuffb/

যে কোন সমস্যায় গ্রুপে পোস্ট করুণ: FBITSchool

পেইজে মেসেজ দিতে পারেন: FBITSchool