তারের ফ্রেম এবং মকআপগুলির মধ্যে পার্থক্য কী?
উত্তর:
একটি ওয়্যারফ্রেম কার্যকারিতা সম্পর্কে। এটি সত্যিই একটি সাধারণ স্কেচ হতে পারে যা আপনার ডিজাইনে কী ধরণের জিনিসগুলি করতে পারে তা প্রদর্শন করে। উদাহরণস্বরূপ, কোনও ওয়েবসাইটের একটি ওয়্যারফ্রেম নেভিগেশন, প্রধান বোতামগুলি, কলামগুলি, বিভিন্ন উপাদানকে রেখে দেবে। আপনি এটি কোনও ওয়েবসাইটের একটি নীলনকশা হিসাবে ভাবতে পারেন।
এই ক্ষেত্রে পণ্যটি কেমন হবে তার একটি মকআপ হ'ল একটি বাস্তব উপস্থাপনা: একটি ওয়েবসাইট। চূড়ান্ত ফলাফলটি হ'ল মকআপের মতো দেখতে বা সংস্করণ সংশোধনীর পরে এর ভিন্নতা হতে পারে। কিছু লোক গ্রাফিক্স সফ্টওয়্যার ব্যবহার করে মকআপগুলি আঁকতে পছন্দ করেন, অন্যরা এটি সরাসরি HTML / CSS এ করেন do
আমি ওয়্যারফ্রেমগুলির জন্য বালাসামিক এবং মকআপগুলির জন্য ফটোশপ / ইলাস্ট্রেটর বা এইচটিএমএল + সিএসএস (জটিলতার উপর নির্ভর করে) ব্যবহার করি।
তারের ফ্রেমের উদাহরণ:
ওয়্যারফ্রেমগুলি মূল অবস্থান এবং / অথবা আকার নির্ধারণ করতে ব্যবহৃত প্রাথমিক আকার বা লাইন। যে কোনও ওয়্যারফ্রেমের লক্ষ্য হ'ল উপাদানগুলিকে একটি বিন্যাসে "ফিট" করা, এটি নির্দেশ করে না যে কীভাবে উপাদানগুলি চূড়ান্ত নকশায় প্রদর্শিত হতে পারে, কেবল যেখানে তারা অবস্থিত হবে।
মকআপগুলি তারের ফ্রেমের শীর্ষে নির্মিত হয় এবং প্রকারের পছন্দ, রঙ পছন্দ ইত্যাদিসহ একটি নকশার সামগ্রিক উপস্থিতিগুলি দেখানোর জন্য আরও এগিয়ে যায় a একটি মক আপের লক্ষ্যটি যতটা সম্ভব সম্ভব দেখাতে হয়, সমস্ত চূড়ান্ত উপস্থিতি কীভাবে রেন্ডার হবে।
আমি নীচের উপস্থাপনায় প্রকাশিত এই দৃষ্টি যুক্ত করতে, @ ইয়েসেলার বিশদ উত্তরটি সমর্থন করি
এখানে মার্সিন ট্রেডারের একটি নিবন্ধের সংক্ষিপ্তসার দেওয়া হল :
Wireframe
একটি ওয়্যারফ্রেম হ'ল একটি ডিজাইনের কম বিশ্বস্ততার উপস্থাপনা। এটি পরিষ্কারভাবে দেখা উচিত:
- Content বিষয়বস্তুর প্রধান গোষ্ঠীগুলি (কী?)
Information তথ্যের কাঠামো (কোথায়?)
• ব্যবহারকারীর একটি বিবরণ এবং মৌলিক দৃশ্যায়ন - ইন্টারফেস ইন্টারঅ্যাকশন (কিভাবে?)
- এগুলিকে আপনার ডিজাইনের মেরুদণ্ড হিসাবে বিবেচনা করুন এবং মনে রাখবেন যে ওয়্যারফ্রেমে চূড়ান্ত পণ্যের প্রতিটি গুরুত্বপূর্ণ অংশের প্রতিনিধিত্ব থাকা উচিত।
উপহাস
- একটি মকআপ হ'ল মাঝারি থেকে উচ্চের বিশ্বস্ততা, স্থির, নকশার উপস্থাপনা। খুব প্রায়ই একটি মকআপ একটি ভিজ্যুয়াল ডিজাইনের খসড়া হয়
- তথ্যের কাঠামোর প্রতিনিধিত্ব করে, সামগ্রীটি দৃশ্যমান করে এবং স্থিতিশীল উপায়ে মৌলিক কার্যকারিতা প্রদর্শন করে
- মানুষকে প্রকল্পের ভিজ্যুয়াল দিকটি পর্যালোচনা করতে উত্সাহ দেয়
ওয়্যারফ্রেমগুলি কাঠামো, তথ্যক্রমক্রম, কার্যপ্রবাহ প্রদর্শন, স্ক্রিনে কী রয়েছে তার বিশদ সরবরাহ এবং কীভাবে কোনও উপাদান কীভাবে কাজ করে (এনটোটেশন) তার বিবরণ প্রদান করতে ব্যবহৃত হয়। অ্যাপ্লিকেশন বা সাইটের জটিলতার উপর নির্ভর করে, ওয়্যারফ্রেমগুলি বিতরণযোগ্য অন্য প্রয়োজনীয়তার উপর ভিত্তি করে তৈরি করা উচিত; প্রক্রিয়া মডেল। ওয়্যারফ্রেমগুলি ক্লায়েন্টের প্রয়োজনীয়তাগুলি ছড়িয়ে দিতে এবং অবশেষে ক্লায়েন্টের সাথে প্রয়োজনীয়তা নিশ্চিত করতে ব্যবহার করা যেতে পারে। ওয়্যারফ্রেমগুলি কোনও সাইট বা অ্যাপ্লিকেশনটির কাঠামোর ভিজ্যুয়াল মডেল। তারা ব্যবহৃত হরফ, প্যাডিং, রঙ, স্টাইল ইত্যাদি নির্ধারণ করে না তারা স্কেল করতে হয় না এবং তাদের কোনও টোন বা গ্রেডিয়েন্ট নেই। এগুলি সমস্তই ক্লায়েন্টের সাথে যোগাযোগ করা দরকার যাতে তারা অন্যান্য প্রয়োজনীয়তা সরবরাহযোগ্যগুলির সাথে একত্রে প্রক্রিয়া এবং ওয়্যারফ্রেম বিতরণযোগ্য প্রসঙ্গে বুঝতে পারে।
একটি মক-আপ সাধারণত ফটোশপে তৈরি করা হয় এবং এটি যখন ওয়্যারফ্রেম সরবরাহযোগ্য এর কাঠামো বা কাঠামোর উপর ভিত্তি করে থাকে তবে এটি একটি স্বতন্ত্র সময়সূচী এবং অনুমোদনের প্রক্রিয়া সহ একটি স্বতন্ত্র বিতরণযোগ্য। মক-আপস বা কমপস, ইন্টারফেসের ভিজ্যুয়াল স্টাইল বা টোন সংজ্ঞায়িত করুন। একবার গৃহীত হয়ে গেলে, মক-আপগুলি অনেকগুলি অতিরিক্ত প্রয়োজনীয়তা বা কাজের পণ্যগুলিতে অনুবাদ করে, যেমন সিএসএস কোড, স্টাইল গাইড, গ্রাফিকাল সম্পদ ইত্যাদি into
ওয়্যারফ্রেমগুলি কখনই মক-আপ হতে হবে না। মক-আপগুলি ওয়্যারফ্রেম হিসাবে ব্যবহার করা যেতে পারে তবে এটির যে কোনও সংশোধনীর দরকার পড়তে পারে এবং আপনার বাজেটের উল্লেখযোগ্যভাবে প্রভাব ফেলতে পারে।
উত্স: যোগাযোগের ডিজাইনার হিসাবে 15 বছর, ইউএক্স লিড, কর্পোরেট পরিবেশে ওয়েবসাইট এবং অ্যাপ্লিকেশনগুলির বিজনেস অ্যানালিস্ট। এবং প্রিয় বাবক
ডেভ কায়ে এর প্রতিক্রিয়া সম্পর্কে মন্তব্য করার মতো সুনাম আমি এখনও পাইনি তাই আমাকে সরাসরি প্রতিক্রিয়া জানাতে হয়েছিল। রাছুর উজ্জ্বল উত্তরের সাথে তুলনা করে তাঁর জবাবটি লক্ষ্য করা খুব বেশি মূল্যবান।
আধুনিক বাক্যাংশের ব্যাখ্যায়, সাধারণ ব্যক্তির ব্যাখ্যাটি / হতে পারে;
- ওয়্যারফ্রেমগুলি হ'ল "নকশা"
- মকআপগুলি হ'ল "উপস্থাপিত"
আসল পরিভাষা 80 এর দশক থেকে উদ্ভূত। তারপরে, রিয়েল-টাইম চিত্র তৈরি করার জন্য আপনার কাছে কম্পিউটিং শক্তি ছিল না তবে আপনি রিয়েল-টাইমে স্ক্রিনে ভাসমান গ্রাফিকগুলির "ওয়্যারফ্রেমগুলি" দেখতে পারেন । একটি যথাযথ "ডেমো" দরকার রাতারাতি রেন্ডারিং ইত্যাদি
এই সময়ে, একটি "ওয়্যারফ্রেম" একটি কঙ্কাল "নকশা" উপস্থাপন করে এবং একটি ভাল পুনরাবৃত্ত নকশা প্রক্রিয়া সহ, লোকেদের তারের ফ্রেম থেকে মকআপগুলি তৈরি করা উচিত, প্রতিক্রিয়া পাওয়া উচিত এবং তারটি ফ্রেম ডিজাইনের উন্নতির জন্য ফিরে যেতে হবে।
দুর্ভাগ্যক্রমে, আজকাল, গ্রাহকদের কাছে প্রচুর সফ্টওয়্যার উপলব্ধ রয়েছে যা তাদের মকআপগুলি ডিজাইন করার অনুমতি দেয় যা প্রোগ্রামারদের দ্বারা সরাসরি ব্যবহারযোগ্য anything প্রায়শই, তাদের ডিজাইনগুলি অন্যরা তৈরি করে তাই মকআপটি গ্রামীণ ডিজাইনে ফ্যাক্টর হিসাবে প্রোগ্রামারগুলিতে ফিরিয়ে আনার পরিবর্তে ব্যক্তিগতভাবে বাড়ানো হয়।
আমি মনে করি এটি কার্যকরভাবে ডেভকে উল্লেখ করার ক্ষেত্রে কিছুটা নম্রভাবে দেখাচ্ছিল :-)
কিথ
লোকেরা তৈরি করেনি এমন একটি বিন্দু যুক্ত করতে হবে ... এই উত্তরগুলি সমস্ত শালীন প্রযুক্তিগত বিবরণ দেয় তবে একটি কাজের পরিবেশে পার্থক্য সবসময় এত স্পষ্ট হয় না। কিছু সংস্থাগুলি একটি মকআপে কার্যকারিতা যুক্ত করতে পারে এবং কিছুগুলি তারের ফ্রেমে উচ্চ-স্তরের ডিজাইনের প্রয়োজনীয়তা যুক্ত করতে পারে। আপনি প্রথমে যে কোম্পানির কাছে যেতে চান যে কোনও জিনিস যা এইগুলির মধ্যে নয় তা হতে পারে এমনটির জবাব সম্পর্কে খুব বেশি তালাবন্ধ হয়ে পড়ার বিষয়ে আমি সতর্ক থাকব!
আমার জ্ঞান অনুসারে মকআপ পর্দা হ'ল ইউআই এর চূড়ান্ত উপস্থাপনা, চেহারা এবং বোধ করা। সাধারণ প্রবাহ কী হবে এবং বিকল্প প্রবাহ কী হবে। আমি মনে করি এটি বেশিরভাগ HTML এবং CSS এ তৈরি ওয়েব প্রোটোটাইপ হতে পারে। আমরা তখন বেশিরভাগ এইচএলডি পর্যায়ে তৈরি করি এবং ক্লায়েন্টের কাছ থেকে গ্রহণযোগ্যতা পেতে পারি।
তুলনামূলকভাবে ওয়্যারফ্রেমগুলি আরও সাধারণ প্রবাহের ডায়াগ্রামের মতো কেন্দ্রীভূত হয় a ইভেন্টের ক্লিকের ক্ষেত্রে কী ঘটে তার মতো কয়েকটি বিশদ বিবরণ উপস্থাপন না করে, ইভেন্ট এবং অনুরূপ জিনিস পরিবর্তন করুন। এগুলি বেশিরভাগ এসএ / বিএ দ্বারা করা হয় এবং মক আপগুলি ডিজাইনার / বিকাশকারীরা করে। কিছু বেশি লোক তার নির্দিষ্ট নির্দিষ্ট UI এর সাথে জড়িত ডিবির মতো তারের ফ্রেমের সাথে প্রযুক্তিগত বৈশিষ্ট্যগুলি সংযুক্ত করে।
কিন্তু আবার এটি প্রকল্পের উপর নির্ভর করে। আমাদের ক্ষেত্রে তারের ফ্রেমগুলি সত্যের উত্স stand
এটি তাদের মধ্যে পার্থক্য হিসাবে আমি বুঝতে পারি
একটি ওয়্যারফ্রেম একটি মকআপ হতে পারে। একটি মকআপ একটি তারের ফ্রেম হিসাবে বিবেচিত। যদিও তারা কখনও কখনও পৃথক জিনিস হয় (অন্যরা যেমন বলে থাকে) তারা প্রায়শই পৃথক জিনিস নয়।
একসময়, কেউ ভিজিও কী তৈরি করবে তার ওয়্যারফ্রেমগুলি বিবেচনা করতে পারে। এবং মকআপগুলি যা ফটোশপ তৈরি করবে।
কিন্তু আজ, আমাদের সরঞ্জামগুলির পরিসীমা নিয়ে, তারা প্রায়শই একই প্রকৃত নথি। শুরুতে তারা ওয়্যারফ্রেম হিসাবে শুরু করতে পারে (খাঁটি বিন্যাস এবং ফাংশন) তবে সময়ের সাথে সাথে তারা আরও একটি পয়েন্ট হিসাবে বিবেচিত হতে পারে যেখানে আরও বেশি বিশদ হয়ে উঠবে। এবং যদি অ্যাক্সরের মতো ইন্টারেক্টিভ সরঞ্জামগুলি ব্যবহার করা হয় তবে একটি নির্দিষ্ট সময়ে এটি প্রোটোটাইপ বিবেচনা করতে পারে।
সুতরাং এটি অনেকগুলি ওভারল্যাপ সহ একটি বর্ণালী।
Wireframes
আপনি যখন কোনও মোবাইল অ্যাপ্লিকেশন বা কোনও ওয়েব অ্যাপ্লিকেশন ডিজাইন করার পরিকল্পনা করছেন, আপনার প্রথমে প্রতিটি পৃষ্ঠাগুলি কেমন দেখাচ্ছে তা স্কেচ প্রয়োজন। কেবল ব্যবসায়িক ধারণার উপর ভিত্তি করে, একজন ডিজাইনার অ্যাপ্লিকেশন প্রবাহ এবং ডিজাইনের প্রথম খসড়াটি সংজ্ঞায়িত করতে পারে, এটির চেহারাটি কী হবে, কী কী বোতাম থাকবে, কোন ক্ষেত্রগুলি থাকবে ইত্যাদি a এর স্কেচ রয়েছে যা ওয়্যারফ্রেমটি কী জন্য বোঝানো.
রূপ
মকআপগুলি আরও জীবন্ত ছবি। এগুলি দৃশ্যত আরও আবেদনময়ী, রঙ, ফন্ট, থিম, বোতাম, লোগো ইত্যাদি রয়েছে this মোবাইল অ্যাপটি কীভাবে প্রদর্শিত হবে বা ওয়েব পৃষ্ঠাগুলি দেখতে কেমন হবে তার একটি সঠিক প্রতিনিধিত্ব।
আপনি এই তথ্যবহুল নিবন্ধে ওয়্যারফ্রেমস এবং মকআপগুলির মধ্যে বিশদ তুলনা খুঁজে পেতে পারেন: ওয়্যারফ্রেম, মকআপ এবং প্রোটোটাইপের মধ্যে পার্থক্য