UI ডিজাইনার ওভারভিউ
ওয়েব অ্যাপ তৈরির জন্য অ্যাপমাস্টার ইউআই ডিজাইনারের ইন্টারফেসের একটি বিশদ ব্যাখ্যা।
সফলভাবে অ্যাপ্লিকেশনটি তৈরি করার পরে, আপনাকে UI ডিজাইনার ট্যাবে নির্দেশিত করা হবে৷
অ্যাপমাস্টারের UI ডিজাইনারটি ব্যবহারকারী-বান্ধব হওয়ার জন্য ডিজাইন করা হয়েছে, যা আপনাকে অনায়াসে অত্যাশ্চর্য ওয়েব অ্যাপ পৃষ্ঠা তৈরি করতে দেয়।
এর স্বজ্ঞাত ড্র্যাগ-এন্ড-ড্রপ ইন্টারফেসের মাধ্যমে, আপনি উন্নত কোডিং দক্ষতার প্রয়োজনীয়তা দূর করে, ওয়েব পৃষ্ঠাগুলিকে ডিজাইন করতে পারেন এবং বিরামহীনভাবে বিষয়বস্তু দিয়ে তাদের তৈরি করতে পারেন।
ব্যবহারকারীদের সাথে ইন্টারঅ্যাক্ট করার জন্য UI ডিজাইনারকে চারটি প্রাথমিক বিভাগে বিভক্ত করা হয়েছে:
- বাম টুলবার
- শীর্ষ নামসুচী
- নীচের প্যানেল
- ক্যানভাস এলাকা
- বৈশিষ্ট্য প্যানেল
বাম টুলবার
বাম পাশের টুলবারটি আপনার ওয়েবসাইট গঠনের জন্য টুল অফার করে। এই সাইডবারের শীর্ষে অবস্থিত আইকনগুলিতে ক্লিক করার মাধ্যমে, নিম্নলিখিত প্যানেলগুলি প্রকাশিত হবে:
- UI উপাদানের তালিকা
- উপাদান গাছ
- পেজ গাছ
- লেআউট ট্রি
- সম্পদ ব্যবস্থাপক
UI উপাদানের তালিকা (শর্টকাট: 1 )
UI উপাদানের তালিকা প্যানেল থেকে টেনে এনে ক্যানভাস এলাকায় যোগ করা যেতে পারে এমন সমস্ত উপাদান সরবরাহ করে।
UI উপাদানগুলিকে তাদের উদ্দেশ্যের উপর ভিত্তি করে বিভাগগুলিতে সংগঠিত করা হয়, যা আপনার অ্যাপের জন্য উপযুক্ত উইজেটটি নেভিগেট করা এবং খুঁজে পাওয়া সহজ করে তোলে৷
উপাদানটিতে দ্রুত যাওয়ার জন্য, আপনি প্যানেলের শীর্ষে অনুসন্ধান বারটি ব্যবহার করতে পারেন।
এলিমেন্টস ট্রি (শর্টকাট: 2 )
এলিমেন্টস ট্রি থেকে, আপনি আপনার ওয়েব অ্যাপের নির্বাচিত পৃষ্ঠায় রাখা সমস্ত উপাদান পরিচালনা এবং সংগঠিত করতে পারেন।
এখানে, আপনি এই উপাদানগুলির সাথে যোগাযোগ করতে পারেন:
- টেনে এনে গাছের মধ্যে আইটেম সরান,
- উপাদান পুনঃনামকরণ,
- ক্যানভাসে উপাদানগুলির দৃশ্যমানতার অবস্থা পরিবর্তন করুন (লুকান/দেখান)।
গাছে দ্রুত অনুসন্ধানের উপাদানের জন্য প্যানেলের শীর্ষে অনুসন্ধান বারটি ব্যবহার করুন৷
পেজ ট্রি (শর্টকাট: 3 )
পেজ ট্রি আপনাকে আপনার সাইটের পৃষ্ঠাগুলি সংগঠিত এবং পরিচালনা করতে দেয়। আপনি এখানে নতুন পৃষ্ঠা বা ফোল্ডার তৈরি করতে পারেন।
পেজ ট্রি-তে আপনি পেজ বা ফোল্ডার ডুপ্লিকেট বা মুছে ফেলতে পারেন।
দ্রুত অনুসন্ধান পৃষ্ঠা বা গাছের ফোল্ডারের জন্য প্যানেলের শীর্ষে অনুসন্ধান বারটি ব্যবহার করুন৷
লেআউট তালিকা (শর্টকাট: 4 )
লেআউট ট্রি আপনার পৃষ্ঠা লেআউট পরিচালনা করতে সাহায্য করে। পেজ ট্রি-তে যেমন আপনি লেআউট নকল বা মুছে ফেলতে পারেন।
গাছে দ্রুত অনুসন্ধান বিন্যাসের জন্য প্যানেলের শীর্ষে অনুসন্ধান বারটি ব্যবহার করুন।
সম্পদ ব্যবস্থাপক (শর্টকাট: 5 )
সম্পদ ব্যবস্থাপক আপনার ওয়েবসাইটের ব্যবহারের জন্য সম্পদ (যেমন নথি, ছবি এবং অ্যানিমেশন) আপলোড এবং সংগঠনের সুবিধা দেয়।
বিকাশের সময় আপনার আপলোড করা সমস্ত সম্পদ সম্পদ ব্যবস্থাপকের মধ্যে রাখা হবে এবং পুনরায় আপলোড না করেই পুনরায় ব্যবহার করা যেতে পারে।
আপনার আর প্রয়োজন নেই এমন কোনো সম্পদও আপনি সরাতে পারেন।
শীর্ষ বার
টপ বার ভিউ সেটিংসের একটি অতিরিক্ত সেট প্রদান করে। বাম-পাশ থেকে শুরু করে, মেনু বোতামের পাশে, এবং ডানদিকে প্রসারিত, আপনার কাছে নিম্নলিখিত সরঞ্জামগুলির সেট রয়েছে:
- বর্তমান নথি: আপনি বর্তমানে কাজ করছেন এমন পৃষ্ঠা বা বিন্যাস প্রদর্শন করে।
- ব্রেকপয়েন্ট: ব্রেকপয়েন্ট আইকনগুলি আপনাকে বিভিন্ন ব্রেকপয়েন্টের মধ্যে পরিবর্তন করতে সক্ষম করে যাতে বিভিন্ন ডিভাইসের আকারে আপনার সাইটটি কীভাবে প্রদর্শিত হয় তা প্রিভিউ এবং পরিবর্তন করতে পারে।
- পূর্বাবস্থায় ফেরান এবং পুনরায় করুন: পূর্বাবস্থায় ফেরান এবং পুনরায় করুন বোতামগুলি আপনাকে ডিজাইনারে করা কাজগুলিকে বিপরীত বা পুনরায় প্রয়োগ করতে দেয়, যেমন একটি স্টাইল প্রয়োগ করা বা একটি উপাদান সরানো। এছাড়াও শর্টকাটগুলি উপলব্ধ: পূর্বাবস্থায় ক্রিয়া করার জন্য -
CRTL/⌘+Zএবং পুনরায় করার জন্য -CTRL/⌘+SHIFT+Z।
নিচের বার
নীচের প্যানেলটি আপনাকে পৃষ্ঠা দৃশ্য জুম বা আকার পরিবর্তন করতে দেয়।
প্যানেলের বাম দিকে, আপনি আপনার ক্যানভাসের উচ্চতা এবং প্রস্থ সেট করে কাস্টম পৃষ্ঠার রেজোলিউশন সেট করতে পারেন।
ডান দিকে, আপনি স্কেল নিয়ন্ত্রণ করতে পারেন:
- জুম ইন বা জুম আউট
- শতাংশে স্কেল সেট করুন
- প্রকৃত আকার সেট করুন
- দৃশ্যমান এলাকায় বর্তমান উইন্ডো ফিট
ক্যানভাস
ক্যানভাস হল আপনার ইন্টারেক্টিভ ওয়ার্কস্পেস। এখানেই আপনি পৃষ্ঠার উপাদানগুলির সাথে জড়িত হতে পারেন৷ আপনি উপাদান নির্বাচন করতে পারেন, তাদের পুনরায় অবস্থান করতে পারেন এবং সরাসরি পৃষ্ঠায় সামগ্রী সম্পাদনা করতে পারেন।
এছাড়াও, আপনি কপি করতে পারেন ( CRTL/⌘+C ) এবং পেস্ট এবং অ্যাপ্লিকেশনের মধ্যে ( CRTL/⌘+V ) উপাদান বা বর্তমান পৃষ্ঠার মধ্যে অনুলিপি উপাদান ( CRTL/⌘+D ) পেস্ট করতে পারেন।
বৈশিষ্ট্য প্যানেল
ডিজাইনারের ডানদিকে থাকা বৈশিষ্ট্য প্যানেল আপনাকে নির্বাচিত উপাদান, বিন্যাস বা পৃষ্ঠার চাক্ষুষ চেহারা এবং আচরণ কাস্টমাইজ করতে দেয়।
বৈশিষ্ট্য প্যানেলে 4টি প্রধান প্যানেল রয়েছে:
- চেহারা প্যানেল
- অতিরিক্ত বিকল্প প্যানেল (ঐচ্ছিক)
- মিডিয়া প্রশ্ন প্যানেল
- ব্যবসা লজিক প্যানেল
প্যানেলের হেডারে, আপনি আইটেমের নামের উপর ক্লিক করে নির্বাচিত আইটেমের নাম পরিবর্তন করতে পারেন, বিবরণটি পড়তে পারেন বা ট্র্যাশ আইকনে ক্লিক করে আইটেমটি মুছে ফেলতে পারেন।
উপস্থিতি প্যানেল
চেহারা প্যানেল আপনাকে নির্বাচিত উপাদানের প্রদর্শিত স্ট্যাটিক বিষয়বস্তু এবং বৈশিষ্ট্যগুলি অ্যাক্সেস করতে দেয়। আপনি এই মানগুলি তাদের সংশ্লিষ্ট ক্ষেত্রগুলিতে ইনপুট বা নির্বাচন করতে পারেন এবং শৈলীগুলি ক্যানভাসে আপনার উপাদানগুলিতে অবিলম্বে প্রয়োগ করা হবে।
ক্যানভাসে কোনো উপাদান নির্বাচন করা না থাকলে, এই প্যানেলটি বর্তমান পৃষ্ঠা বা বিন্যাসের সেটিংস প্রদর্শন করবে।
অতিরিক্ত বিকল্প প্যানেল
অতিরিক্ত বিকল্প প্যানেলটি এমন উপাদানগুলির জন্য উদ্দিষ্ট যা অতিরিক্ত সেটিং ডেটা বা বিকল্পগুলির প্রয়োজন৷
আপনি ডেটা উত্স সেট করতে পারেন বা নির্বাচিত উপাদানের উপর নির্ভর করে ম্যানুয়ালি বিকল্পগুলি প্রবেশ করতে পারেন৷
মিডিয়া প্রশ্ন প্যানেল
মিডিয়া ক্যোয়ারি প্যানেল আপনাকে প্রতিটি সংজ্ঞায়িত ব্রেকপয়েন্টের জন্য আইটেম বৈশিষ্ট্য ওভাররাইড করতে সক্ষম করে।
ব্যবসা লজিক প্যানেল
বিজনেস লজিক প্যানেল একটি এলিমেন্টের জন্য সমস্ত ট্রিগার প্রদান করে এবং ট্রিগার ফায়ার হলে আপনাকে এলিমেন্ট মিথস্ক্রিয়া স্থাপন করতে দেয়।