একটা wireframe হলো একটা screen-এর একটা মোটামুটি, কম-detail layout — box, লাইন, আর placeholder টেক্সট আসল content আর visual-এর জায়গায়। এটা ইচ্ছাকৃতভাবে "এটা দেখতে কেমন" উত্তর দেওয়ার আগে "সবকিছু কোথায় যায় আর কোন ক্রমে" উত্তর দেয়।
ধূসর box আর Latin filler টেক্সট অলসতা না — এগুলো structure আর flow-এ feedback কেন্দ্রীভূত রাখার একটা ইচ্ছাকৃত সিদ্ধান্ত। একটা পুরো-রঙের, পালিশ করা wireframe দেখা একজন reviewer রং আর font নিয়ে মন্তব্য করার ঝোঁক রাখে; ধূসর box দেখা একজন reviewer layout আর flow নিয়ে মন্তব্য করে, যা ঠিক এই পর্যায়ের দরকার এমন feedback।
| Element | কীভাবে প্রতিনিধিত্ব করা |
|---|---|
| একটা image বা ছবি | এর মধ্য দিয়ে একটা diagonal X সহ একটা box |
| Body টেক্সট | বিভিন্ন প্রস্থের horizontal ধূসর লাইন |
| একটা heading | একটা একক, সামান্য মোটা বা প্রশস্ত ধূসর লাইন |
| একটা button | একটা rectangle, কখনো কখনো শুধু outline করা |
| Navigation | সরল box বা একটা label করা bar, চূড়ান্ত icon design না |
Low-fidelity wireframe বানাতে দ্রুত আর ফেলে দিতে দ্রুত — একটা পালিশ করার সময়ে বেশ কয়েকটা মোটামুটি version sketch আর তুলনা করা যায়। এটা ইচ্ছাকৃত: যত আগে একটা খারাপ structural ধারণা ধরা পড়ে, ঠিক করা তত সস্তা। পরের lesson high-fidelity prototyping কভার করে, structure স্থির হয়ে গেলে।
কাগজ একটা বৈধ wireframing টুল
অনেক designer Figma খোলার আগেই কাগজে wireframe শুরু করে — একটা pencil sketch পুনরায় আঁকতে কয়েক সেকেন্ড লাগে, একটা digital টুল কখনো কখনো যেভাবে করে না সেভাবে আসলেই দ্রুত iteration উৎসাহিত করে।