Layout Grid আর Guide

একটা layout grid হলো একটা Frame-এর উপর একটা visual overlay — column, row, বা একটা square grid — যা content কোথায় সারিবদ্ধ হবে তার দিক নির্দেশ করে, আসল design-এর অংশ না হয়েই। এটা শুধু editor-এই দেখা যায়, কখনো আসল screenshot বা ship করা app-এ না।

একটা Frame select করুন, Design panel-এ Layout guide-এ scroll করুন, আর +-এ ক্লিক করুন। সাথে সাথে একটা default square grid দেখা যায়; তার পাশের dropdown Grid (সমানভাবে ভাগ করা একটা square grid, icon কাজের জন্য ভালো), Columns (vertical guide, web আর app layout-এর জন্য মানদণ্ড), আর Rows (horizontal guide)-এর মধ্যে বদলায়।

একটা grid ছাড়া, "এটা কি ওটার সাথে align করছে" প্রশ্নের উত্তর চোখ দিয়ে দিতে হয়, আর ছোট ছোট অসঙ্গতি পুরো screen জুড়ে জমা হতে থাকে। একটা grid দিয়ে, প্রতিটা element একই column-এ snap করে, আর একটা design সাথে সাথে বেশি গোছানো মনে হয় — স্ক্রিন আসার শত বছর আগে থেকে print ম্যাগাজিন আর সংবাদপত্র column grid ব্যবহার করে আসছে ঠিক এই কারণেই।

একটা 12-column grid web layout-এর জন্য বাস্তবিক মানদণ্ড (এটা সমানভাবে অর্ধেক, তৃতীয়াংশ, আর চতুর্থাংশে ভাগ হয়)। Mobile app screen প্রায়ই একটা সরল 4-column grid ব্যবহার করে, কারণ ভাগ করার মতো horizontal জায়গা কম থাকে। কোনোটাই নিয়ম না — ইচ্ছাকৃতভাবে সরে যাওয়ার আগে জানা দরকার এমন শুরুর বিন্দু।