একটি ওয়েবসাইট ডিজাইনের পদক্ষেপগুলি কী কী?


30

সমস্ত ওয়েব ডিজাইনারকে কল করা হচ্ছে :)

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

আমার প্রশ্নগুলি হ'ল:

2014 সালে একটি ওয়েব ডিজাইনারদের ওয়ার্কফ্লো কী? (কারণ সবকিছু এত দ্রুত পরিবর্তিত হচ্ছে) আমি কি সাইটের ওয়্যারফ্রেমগুলি তৈরি করি এবং তারপরে সেগুলি ফটোশপে ডিজাইন করব এবং তারপরে ডিজাইনগুলি কোড করব?

আমি কেবল "ডিজাইন" প্রক্রিয়াগুলি কীভাবে কাজ করে তা জানতে চাই, ওয়েবসাইট তৈরির জন্য আমাকে কী পদক্ষেপ গ্রহণ করা উচিত like

আগাম ধন্যবাদ.


2
এটি সম্পূর্ণরূপে প্রকল্প, দল এবং ক্লায়েন্টের উপর নির্ভর করে। এই জন্য কোন স্টক উত্তর নেই।
DA01

স্কেচ স্কেচ স্কেচ!
শনিবারে


যে কেউ পরে আসছেন তাদের জন্য: @ ডার্থ_ভ্যাডার ফটোশপের পরিবর্তে ইনডিজাইন ব্যবহার করে উল্লেখ করেছেন। আমি জানি পিএস এখন ঠিক তেমন আমন্ত্রণ জানায়, আপনি যেমন ছিলেন আমি পিএস গুরু, তবে আমি কয়েক বছর আগে ইনডিজাইন শিখতে "বাধ্য" হয়েছিলাম এবং বি! আমার মাথা এবং আমি এটি পেয়েছিলাম। এটি অবশ্যই শেখার প্রচেষ্টাটির পক্ষে মূল্যবান এবং অতিরিক্ত D আপনি ইনডিজাইন ব্যবহার করে আপনার প্রস্তাব এবং ডিজাইন ডক তৈরির জন্য চার্জ করতে পারেন এটি শিখতে কয়েক দিন সময় লাগে। সুতরাং এটি শিখুন !!
বিলিএনয়ার

উত্তর:


36

আবিষ্কার ও ব্যাপ্তি

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

সামগ্রী ম্যাপিং

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

উদাহরণ: এখানে চিত্র বর্ণনা লিখুন

উপহাস

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

উদাহরণ: এখানে চিত্র বর্ণনা লিখুন

স্টাইল টাইল

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

এখানে চিত্র বর্ণনা লিখুন

টাইলের উদ্দেশ্য সহ আপনি কোনও ক্লায়েন্টকে একটি নকশা হস্তান্তর করছেন না এবং নিজেকে "আপনি আমাকে যে নকশায় দিয়েছেন তা দেখে মনে হচ্ছে না" এর কোণে নিজেকে রাখছেন না। এছাড়াও, যদি আপনি কোনও সাইট পরিকল্পনা করে থাকেন তবে প্রতিক্রিয়া জানানোর জন্য ফটোশপটিতে এটি ব্যয় করার কোনও কারণ নেই কারণ আপনি নির্দিষ্ট কিছু ডিভাইস ইত্যাদির জন্য অনেক সময় ডিজাইন করার সময় ব্যয় করবেন ইত্যাদি। যদি আপনি পুরো সাইটটি ডিজাইন করতে চান তবে আমি চাইতাম চিত্রশক্তির তুলনায় আপনার এসভিজি এবং আপনার সাইটের জন্য উপাদানগুলি রফতানি করার দক্ষতার জন্য চিত্রিত হিসাবে বিবেচনা করুন। কিছুটা ডিগ্রীতে আপনি সামগ্রীটি ফর্ম্যাট করার জন্য ইনডিজাইনও ব্যবহার করতে পারেন তবে আমি কেবল চিত্রের ম্যানিপুলেশনের জন্য ফটোশপ ব্যবহার করব এবং যদি আমি এটি করতে যাচ্ছি তবে আমি সম্ভবত ইমেজম্যাগিকের সাথে রোল করব। আমি স্টাইল টালিটিকে অন্যের চেয়ে আরও স্তর নিয়েছি এবং এটি একটি একক পৃষ্ঠায় কোড করি যাতে আমি আমার মাস্টারের একটি প্রাথমিক কাজটি ছুঁড়ে ফেলেছি.css ফাইল।

Wireframe

আপনি যদি খেয়াল না করেন তবে আমি ব্রাউজারে ডিজাইনিং স্থাপন করতে পছন্দ করি। এখনকার দিনে আমি সাইটের স্কেচ বা সাইটের মকআপের জন্য ইলাস্ট্রেটর ব্যবহার করতে পারি তবে আমি সাধারণত .cssএকটি ধূসর স্কলে 6 টিরও বেশি রঙের একটি ডিফল্ট টেম্পলেট ফাইল স্থাপন করি এবং বেশিরভাগ লোকের পক্ষে পারি না বলে আমি সাইটের কাঠামোর জন্য সমস্ত কিছু কোড করি I একটি নকশা বোঝার পেতে এবং কিছু খেলতে চান। আমি মাঝে মাঝে পিএইচপি তে এগিয়ে যাই এবং এটি কোনও সিএমএসের জন্য মোতায়েন করা সহজ। আমি তখন একটি কালো এবং সাদা পদ্ধতিতে ক্লায়েন্টের প্রদত্ত ফন্টগুলির সাথে একটি সাধারণ সাব-ডোমেন বিকাশ করব যাতে পুরো সাইটের কার্যকারিতা উপস্থিত থাকে এবং তারা এটির মধ্য দিয়ে যেতে পারে। যেহেতু আমি সমস্ত সামগ্রী বা রঙ যুক্ত করতে সময় ব্যয় করি নি (কারণ আমি ডামি পাঠ্য রেফারেন্স ব্যবহার করি: "ওয়েবসাইটগুলির জন্য লোরেম ইপসামের বিকল্প (ডামি পাঠ্য)"") আমি কোনও ডিভাইসের উপর ভিত্তি করে কোনও নির্দিষ্ট উপাদান পছন্দ না করলে উপস্থিত যে কোনও পরিবর্তন সহজেই সংশোধন করতে পারি।

রঙিন এবং বিষয়বস্তু

একবার ক্লায়েন্ট সাইটের কাঠামো এবং কার্যকারিতা সাইন আপ হয়ে গেলে আমি সিএসএসের বাকি অংশটি লিখব এবং অনুরোধকৃত অ্যানিমেশন বা জাভাস্ক্রিপ্টের বিশদগুলি যুক্ত করব। যেহেতু আমার কাছে স্টাইল টাইল অনুমোদিত হয়েছে এবং যদি আমি এটি সঠিকভাবে বিকাশ করি তবে আমি কেবল সিএসএস অনুলিপি করে সেট করতে পারি be

ডিবাগ, ডিবাগ, ডিবাগ

ক্লায়েন্ট সাইন-অফের আগে চূড়ান্ত পদক্ষেপটি ডিবাগ হয়ে গেছে এবং নিশ্চিত করুন যে আমার কোডটি কোনও ত্রুটিযুক্ত না। সবকিছু ঠিক থাকলে আমার মসৃণ মুক্তি পাওয়া উচিত। এই পদক্ষেপে পরিবেশন করা টেস্টিং এবং লোড টেস্টিংও অন্তর্ভুক্ত রয়েছে, যদি এটিই আপনার মূল্য নির্ধারণ করা এবং অফার করা হয়। ব্যক্তিগতভাবে, আমি দৃ firm় বিশ্বাসী যে কোনও ডিজাইনারকে তারা কীভাবে আপনার জন্য বিকাশ করছে সে সম্পর্কে সচেতন হওয়া উচিত, আশা করা যায়, এটি কোনও মুদ্রণ ডিজাইনের ক্ষেত্রে আসে যখন করা উচিত। যদি ক্লায়েন্ট সত্যিকারের হোস্টিং সরবরাহকারীর পক্ষে সামর্থ না রাখে তবে এটি সাইটের কর্মক্ষমতা সীমাবদ্ধ করতে পারে এবং তারা সকলেই বলবে এটি আপনার দোষ এবং আপনি কিছু ভুল করেছেন।

প্রশিক্ষণ

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

আপনি কিছু প্রাথমিক প্রশ্ন জিজ্ঞাসা করার পর থেকে আরও কিছু বিষয় সহায়তা করতে পারে:


4

আমি এমন একটি ওয়েব ডিজাইনার যিনি সবে মাঠে শুরু করেছেন। যদিও আমি এখন কয়েকটি প্রকল্প করেছি। আমার জন্য, আমার কর্মপ্রবাহ এইভাবে চলেছে:

  1. প্রাথমিক নকশা ও বিকাশ সভাটি
    যখন আমি প্রত্যাশিত সমাপ্তির তারিখ সহ সমস্ত প্রাসঙ্গিক তথ্য সংগ্রহ করি তখন আমার ক্লায়েন্টের কাছ থেকে প্রয়োজনীয় আইটেমগুলির তালিকা তৈরি করা ইত্যাদি etc.
  2. ফটোশপ মকআপস
    এই মুহুর্তে, আমি আমার ক্লায়েন্টের জন্য উপযুক্ত এমন একটি নকশা বা দুটি বা তিনটি খুঁজে পাই এবং তাদের ব্র্যান্ডিং, রঙ, স্টাইল ইত্যাদি ব্যবহার করে ফটোশপে মকআপগুলি তৈরি করি আমি এগুলি প্রেরণ করি এবং প্রতিটিটির কী পরিবর্তন করা উচিত / রাখা উচিত তা নিয়ে আলোচনা করি , তারপরে ক্লায়েন্টকে সিদ্ধান্ত নিতে দিন যে তারা কোন নকশাটি সবচেয়ে বেশি পছন্দ করে।
    দ্রষ্টব্য: আপনি যদি ওয়ার্ডপ্রেসটি তৈরি করতে ব্যবহার করেন তবে আপনি http://themeforest.com এ যেতে পারেনএবং টন থিম দেখুন। সেখান থেকে, আপনি স্ক্রিনশট নিতে পারেন এবং আপনার মকআপগুলি করতে পারেন, তারপরে আপনি একটি লাইভ ডেমোও সরবরাহ করতে পারেন (ক্লায়েন্টের কাস্টমাইজেশন ছাড়াই, অবশ্যই)। আপনার ক্লায়েন্ট যদি এই মকআপগুলির মধ্যে একটি পছন্দ করে, তবে আপনি তখন থিমটি কিনেছেন এবং আপনার প্রয়োজন অনুযায়ী পরিবর্তন করতে পারবেন। এই আমি কি করতে ঝোঁক। আমি যথাযথ creditণ / অর্থ প্রদান / প্রদান না করে কোনও থিম (বা সেই বিষয়ে অন্য কিছু) ব্যবহার করি না। মূল স্রষ্টাকে। :)
  3. বিকাশ
    তারপরে আমি অবশেষে সাইটটি বিকাশের পরিবেশে উন্নত করতে শুরু করি (ক্লায়েন্টের লাইভ ওয়েবসাইট নয়, তবে একটি সাবডোমেন - IE dev.clienturl.com) প্রতিবারই যখন আমার মনে হচ্ছে একটি পৃষ্ঠা বন্ধ হয়ে যাচ্ছে তখন আমি আমার ক্লায়েন্টের কাছে আপডেটগুলি পাঠিয়ে দিচ্ছি I সম্পূর্ণ করার জন্য, যদি সমস্যা থাকে তবে আমরা এখনই তাদের ঠিক করতে পারি।
  4. সর্বদা অনুসরণ করুন
    আপনার ক্লায়েন্টের ওয়েবসাইটটি লাইভ হয়ে যাওয়ার পরেও তারা সন্তুষ্ট বলে মনে হয় এবং আরও পরিবর্তনের জন্য জিজ্ঞাসা করেনি, ফলোআপ করতে ভুলবেন না। তাদের প্রত্যাশা অনুযায়ী কেবল সবকিছু ঠিক যেমন কাজ করছে ঠিক তা নিশ্চিত করুন। ওয়েবসাইটটি এক সপ্তাহের জন্য লাইভ হয়ে যাওয়ার পরে প্রতিটি ক্লায়েন্টের সমাপ্তির জন্য আমি কিছু জরিপ লেখারও পরামর্শ দিই। আপনি আপনার ওয়েবসাইটে প্রশংসাপত্র হিসাবে এখান থেকে মন্তব্য ব্যবহার করতে পারেন।

আপনার যদি কোনও বিষয়ে সাহায্যের প্রয়োজন হয় তবে আমার ওয়েবসাইটের মাধ্যমে আমার সাথে যোগাযোগ করুন। আমার কাছে প্রচুর সংস্থান আছে আমি চুক্তি, পোস্ট-প্রোডাকশন সমীক্ষা, প্রাথমিক প্রশ্নাবলী ইত্যাদি সম্পর্কিত জিনিসের জন্য আপনার সাথে ভাগ করে নিতে পারি http://anchorsawaydesigns.com/


এটি সাধারণ, তবে আমি ফটোশপ ডিজাইনগুলি এড়াতে সত্যই মানুষকে উত্সাহিত করি।
DA01

3

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

  1. প্রয়োজনীয়তা জমায়েত
  2. Wireframing
  3. নকশা মকআপস
  4. ডিজাইন চূড়ান্ত হয়েছে
  5. উন্নয়ন
  6. হোস্টিং

শুভকামনা।


@ ব্যবহারকারী 3830113 একটি ওয়্যারফ্রেম একটি ওয়্যারফ্রেম বনাম একটি মকআপ হিসাবে তৈরি করে সে সম্পর্কে কোনও কঠোর এবং দ্রুত নিয়ম নেই। সাধারণভাবে মক-আপগুলি উচ্চতর বিশ্বস্ততা হতে থাকে এবং প্রবাহ বা ফাংশনগুলির চেয়ে ভিজ্যুয়ালগুলিতে মনোনিবেশ করে। তবে অনেক পরিস্থিতিতে ওয়্যারফ্রেম এবং মকআপগুলি এক এবং এক হতে পারে। এটি সব আপনার প্রকল্প এবং দলের বৈশিষ্ট্যের উপর নির্ভর করে।
DA01

0

হাই বন্ধু আপনি খুব ভাল নতুন প্রকল্প শুরু করছেন।

আপনার প্রয়োজনের জন্য পদক্ষেপগুলি:

  1. প্রথমে আপনি সিদ্ধান্ত নিন আপনি কোন প্রকল্পটি আপনার প্রকল্পের জন্য ব্যবহার করতে চান তার অর্থ আমি একক পৃষ্ঠা স্ক্রোলিং, একাধিক পৃষ্ঠা ইত্যাদি mean

  2. তারপরে আপনার লেআউট এবং কর্মপ্রবাহের জন্য স্কেচ প্রস্তুত করুন।

  3. আপনি ফটোশপের মাধ্যমে আমার পছন্দ মতো সরঞ্জামটিতে এখন আপনার বিন্যাসটি নকশা করা শুরু করুন তবে আপনি নিজের পছন্দটি ব্যবহার করতে পারেন।

  4. এর পরে এটি ভাল যে আপনি কোনও পরিবর্তনের জন্য ক্লায়েন্টকে আপনার লেআউট প্রদর্শন করেন show রঙ, ফন্ট ইত্যাদি যাতে আপনি এটি HTML এর সময় মাথা ব্যাথা না করতে পারেন।

  5. এখন, ক্লায়েন্টদের নিশ্চিতকরণ পরে। এইচটিএমএল এবং সিএসএস দিয়ে কোডিং শুরু করার সময়।

  6. এটির পরে পরবর্তী ভাষা বেস কোডিংয়ের জন্য এটি বিকাশকারীকে দিয়ে দেওয়ার সময় এসেছে। পিএইচপি,। নেট ইত্যাদি

উপভোগ করুন ............


ধাপ 1 টি কৌশলপূর্ণ হতে পারে। এটি ভাল, তবে এর আগে বেশ কয়েকটি পদক্ষেপ থাকা উচিত - যেখানে আপনি প্রকল্প এবং ক্লায়েন্টের প্রয়োজনের ভিত্তিতে সেরা প্রযুক্তি নির্ধারণ করেন। এছাড়াও, আমি যুক্তি দিয়েছি যে চতুর্থ ধাপটি এইচটিএমএল থেকে মাথা ব্যথা তৈরি করতে পারে। HTML এর পরে যত তাড়াতাড়ি laterুকতে পারার সেরা, আইএমএইচও।
DA01

-1

ওয়েব শিল্পে, আপনার বিকাশ প্রক্রিয়াটিকে প্রবাহিত করতে ডিজাইনিং সম্পন্ন হয় এবং চূড়ান্ত নকশাটি আরও বিকাশ বা পরীক্ষা করার জন্য উপস্থাপিত হওয়ার আগে আরও কিছু মধ্যবর্তী পদক্ষেপ জড়িত:


পদক্ষেপ 1: অনুপ্রেরণা প্রাপ্তি:

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

এবং তার জন্য আপনি "ওয়াইরাইফাই" ওয়্যারফ্রেমিং সরঞ্জামটি ব্যবহার করতে পারেন, কেবল আপনার বুকমার্কে একটি বড় লিঙ্ক যুক্ত করুন এবং যে কোনও পছন্দসই ওয়েবসাইটে পেয়েছেন, বুকমার্ক ক্লিক করুন, আপনি ওয়েবসাইটটি তারের ফ্রেমে রূপান্তরিত দেখতে পাবেন।


পদক্ষেপ 2: আপনার প্রক্রিয়া ডিজাইনিং:

বিভিন্ন ডিজাইনার তারের ফ্রেমিংয়ের কাছে এবং বিভিন্নভাবে ভিজ্যুয়াল বা কোডগুলিতে এর অনুবাদ করে,

এখানে অনুসরণ করা পথটি বেছে নেওয়ার জন্য কেবল ডিজাইনারই নয়, কখনও কখনও ক্লায়েন্টরা সরাসরি মকআপগুলি তৈরি করতে পছন্দ করেন এবং কেউ কেউ আরও নিয়মতান্ত্রিকভাবে পছন্দ করেন,

স্কেচ => ওয়্যারফ্রেম => মকআপ => কোড

পদক্ষেপ 3: স্কেচিং:

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

কাগজে হাত স্কেচিং যে কোনও ডিজাইনারের পক্ষে সর্বদা একটি ভাল সূচনা পয়েন্ট। এটি ফোকাস এবং সংগঠিত করার জন্য দ্রুত এবং সহজ উপায় সরবরাহ করে। আপনি যদি স্কেচিংয়ের সাথে খুব সুনির্দিষ্ট হন তবে আপনি এটিকে আপনার চূড়ান্ত ওয়্যারফ্রেম হিসাবে ব্যবহার করতে পারেন।


পদক্ষেপ 4: ওয়্যারফ্রেমিং:

ওয়্যারফ্রেম তৈরি করা ডিজাইনের আগে আপনার প্রথম পদক্ষেপ নেওয়া উচিত is

একটি ওয়্যারফ্রেম আপনাকে ওয়েবসাইটের মধ্যে উপাদান এবং সামগ্রীকে সংগঠিত ও সরল করতে সহায়তা করে এবং বিকাশ প্রক্রিয়াটির জন্য একটি প্রয়োজনীয় সরঞ্জাম।

একটি ওয়্যারফ্রেম মূলত একটি ডিজাইনে সামগ্রীর বিন্যাসের ভিজ্যুয়াল উপস্থাপনা

কোনও বিল্ডিংয়ের ভিত্তির মতো, এটি কোনও ব্যয়বহুল রঙের কোট দেওয়ার বিষয়ে সিদ্ধান্ত নেওয়ার আগে এটি মৌলিকভাবে শক্তিশালী হতে হবে।

ওয়্যারফ্রেম তৈরি করার সময় বিবেচনা করা বিষয়গুলি হ'ল:


আপনার সরঞ্জাম বাছুন

ডিজাইনারদের জন্য 10 টি ফ্রি ওয়্যারফ্রেমিং সরঞ্জামগুলির জন্য মশাবলীর তালিকা এখানে

একটি গ্রিড সেট করা হচ্ছে

একটি প্রতিসম এবং সমান্তরাল নকশা অর্জনের জন্য গ্রিডগুলি খুব প্রয়োজন।

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

বাক্স সহ লেআউট নির্ধারণ করুন

টাইপোগ্রাফির সাথে তথ্য স্তরক্রম সংজ্ঞায়িত করুন

ওয়্যারফ্রেমিংয়ের সময় কী এড়াতে হবে:

  • পৃষ্ঠায় খুব বেশি ঘটছে।
  • রঙ এবং ডিজাইনের উপর জোর দিন
  • খুব বিস্তারিত
ওয়্যারফ্রেমিং এর সুবিধা:

একটি ওয়্যারফ্রেম তৈরি করা ক্লায়েন্ট, বিকাশকারী এবং ডিজাইনারকে ওয়েবসাইটের কাঠামোটির সমালোচনা করার সুযোগ দেয় এবং প্রক্রিয়াটি শুরুতে তাদের সহজেই সংশোধন করার সুযোগ দেয়।

ওয়্যারফ্রেমিং নিম্নলিখিত মূল সুবিধা নিয়ে আসে:

  • এটি ক্লায়েন্টকে সাইট ডিজাইন (বা পুনরায় নকশা) এর প্রাথমিক, ক্লোজ-আপ ভিউ দেয়।
  • এটি ডিজাইনারকে অনুপ্রাণিত করতে পারে, ফলে আরও তরল ক্রিয়েটিভ প্রক্রিয়া তৈরি হয়।
  • এটি বিকাশকারীকে এমন উপাদানগুলির একটি পরিষ্কার চিত্র দেয় যা তাদের কোড করার প্রয়োজন হবে।
  • এটি প্রতিটি পৃষ্ঠায় কল টু অ্যাকশন পরিষ্কার করে দেয়।
  • এটি মানিয়ে নেওয়া সহজ এবং ওয়েবসাইটের অনেকগুলি বিভাগের বিন্যাস প্রদর্শন করতে পারে।


  • পদক্ষেপ 5: মকআপস / ভিজ্যুয়াল:

    এখন চূড়ান্ত ওয়্যারফ্রেমকে চূড়ান্ত মকআপস বা ভিজ্যুয়ালে রূপান্তর করা যায়:

    মকুওসের জন্য কয়েকটি সাধারণ সরঞ্জাম হ'ল অ্যাডোব ফটোশপ, কোরেল ড্র এবং খুব নতুন তবে ইতিমধ্যে জনপ্রিয় স্কেচ ইত্যাদি etc.

    মকআপে রূপান্তর করার সময় যে বিষয়গুলি বিবেচনা করা উচিত সেগুলি হল:

    তথ্য স্তরক্রম

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

    ছাপাখানার বিদ্যা

    বিকল্পগুলির সঠিক সংমিশ্রণ সহ ওয়েবসাইটের জন্য দৃষ্টি আকর্ষণীয় এবং পঠনযোগ্য টাইপোগ্রাফি চয়ন করুন। হরফ আকার, ওজন এবং রং পাঠযোগ্যতার ক্ষেত্রে গুরুত্বপূর্ণ ভূমিকা পালন করে।

    রঙিন স্কিম

    বিপদের জন্য লাল, সাফল্যের জন্য সবুজ, ইত্যাদি হিসাবে ব্র্যান্ড আইডেন্টিটি এবং মানসিক রঙগুলিকে উপস্থাপন করে এমন একটি রঙিন স্কিম


    পদক্ষেপ:: প্রোটোটাইপস :

    একটি প্রোটোটাইপ একটি ধারণা বা প্রক্রিয়া পরীক্ষা করতে বা প্রতিলিপি বা শিখতে হবে এমন জিনিস হিসাবে কাজ করার জন্য নির্মিত কোনও পণ্যটির প্রাথমিক নমুনা, মডেল বা প্রকাশ release

    ওয়্যারফ্রেমগুলি হ্যান্ডেল স্ট্রাকচার, মকআপগুলি হ্যান্ডেল ভিজ্যুয়ালগুলি এবং প্রোটোটাইপগুলি হ্যান্ডেল ব্যবহারযোগ্যতা (ওয়েব / অ্যাপ্লিকেশন পণ্যগুলিতে)।

    একটি প্রোটোটাইপ পণ্য তৈরি করা হয় এবং তারপরে এটি পরীক্ষিত হয় এবং POC (ধারণার অধ্যাপক) সম্পন্ন হয়, এখন আমরা রিয়েল প্রোডাক্টের দিকে যেতে পারি (স্পষ্টতই যদি কোনও পরিবর্তন প্রয়োজন হয় না)

    চিত্র এবং অন্যান্য লিঙ্কগুলির সাথে মূল নিবন্ধের লিঙ্ক


    1
    দয়া করে কেবল একটি সম্পূর্ণ HTML পৃষ্ঠা অনুলিপি করুন এবং পেস্ট করবেন না। এটি খারাপভাবে ফর্ম্যাট করা হয়েছে, কিছু লিঙ্কগুলি কাজ করে না এবং এটি স্পষ্টতই কিছু চিত্র অনুপস্থিত। এটি আমাদের ফর্ম্যাটে সঠিকভাবে ফর্ম্যাট করতে সময় নিন।
    জাচ সসিয়ের
    আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
    Licensed under cc by-sa 3.0 with attribution required.