Refactoring UI by Adam Wathan & Steve Schoger

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

অধ্যায় ০১ঃ Starting from Scratch

Start with Feature, Not a Layout ( ফিচার দিয়ে শুরু করুন, লেআউট নয় )

আপনি যখন একটি নতুন অ্যাপ আইডিয়ার জন্য ডিজাইন শুরু করেন, আপনি প্রথমে কী ডিজাইন করবেন? যদি এটি পেজের নেভিগেশন বার হয়, আপনি একটি ভুল করছেন।

নতুন কোনো অ্যাপ নিয়ে কাজ করার জন্য প্রথম ধাপ হল “Design the app”। এটি একটি ব্রড কনসেপ্ট যা অ্যাপ্লিকেশন তৈরি প্রক্রিয়ার সাথে সম্পর্কিত। অ্যাপ ডিজাইন এর মাধ্যমে অ্যাপ্লিকেশন ইউজার ইন্টারফেস, উপযোগিতা(, আকর্ষণীয়তা, এবং ব্যবহারযোগ্যতা নির্ধারণ করা হয়। অ্যাপ ডিজাইন এর মাধ্যমে অ্যাপ্লিকেশনের ভিজ্যুয়াল কম্পোনেন্টগুলো, ব্যবহারযোগ্যতা, নেভিগেশন প্রণালী, ইন্টারেকশন মডেল এবং অন্যান্য সম্পর্কিত সাধারণ দিক পর্যালোচনা করা হয়। কিন্তু অধিকাংশ মানুষই “Design the app” মানে বাহিরের অংশকে বোঝে। যা আপনাকে হতাশ করতে পারে, আপনার চিন্তাভাবনাকে সীমাবদ্ধ করতে পারে। তারা ভাবে,

• টপ নেভিগেশন (top navigation bar) নাকি সাইডবার(sidebar) থাকা উচিত?
• নেভিগেশনবার কি বামে থাকবে নাকি ডানে?
• পেজের বিষয়বস্তু কি একটি কন্টেইনারে থাকা উচিত, নাকি এটি সম্পূর্ণ পেজে হওয়া উচিত?
• লোগো কোথায় থাকা উচিত?

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

বরং বাহিরের কাঠামো নিয়ে ভাবার চাইতে, একটি কার্যকর অংশ দিয়ে কাজ শুরু করেন। উদাহরণসরূপ, ধরুন আপনি একটি ফ্লাইট বুকিং সার্ভিস তৈরী করবেন, আপনি “searching for a flight”ফিচার দিয়ে কাজ শুরু করতে পারেন।

এই ইন্টারফেস তৈরীর জন্য আপনার প্রয়োজন হবে,

• কোথা থেকে যাত্রা শুরু করতেছেন তার জন্য একটা ফিন্ড
• কোথায় যাবেন তার জন্য একটা ফিল্ড
• কবে যাত্রা শুরু করবেন তার জন্য একটা ফিল্ড
• কবে ফিরে আসবেন তার জন্য একটি ফিল্ড
• সার্চ করার জন্য একটি বাটন

এই ভাবে শুরু করেন,

আপনাকে অন্যান্য জিনিসের দরকার নাও হতে পারে।উপরের সাইডবার কেমন হবে, এটার জন্য গুগল আছে।

Detail comes later ( বিস্তারিত পরে আসে )

কোনো নতুন ডিজাইন করার প্রাথমিক পর্যায়ে টাইফেস, শ্যাডো, আইকন ইত্যাদির মত কম গুরুত্বপূর্ণ বিষয়গুলোকে খুব বেশী গুরুত্ব দেয়ার প্রয়োজন নেই,

এগুলো ধাপে ধাপে গুরুত্বপূর্ণ হবে, কিন্তু এখন না।

আপনি যদি ব্রাউজার বা আপনার পছন্দের টুলস এ হাই ফিডেলিটি এনভায়রমেন্টে কাজ করতে যেয়ে বিস্তারিত বিষয়গুলো বাদ দিতে সমস্যায় পড়েন ,তাহলে জেসন ফ্রিড অভ বেসক্যাম্প এর একটি কৌশল ব্যবহার করতে পারেন, তিনি শার্পি(পেন্সিল) দিয়ে পেপারে ডিজাইন করতেন।

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

Hold the color ( আংশিক রূপে রংটি রাখুন )

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

এটা কিছুটা চ্যালেঞ্জিং হতে পারে, তবে আপনি পরিষ্কার একটি ইন্টারফেস পাবেন যা সম্পূর্ণ হায়ারার্কি সাথে সুগঠিত হবে এবং পরে কালার (রঙ) দ্বারা সহজে উন্নত করা যাবে।

Don’t over-invest ( অতিরিক্ত বিনিয়োগ করবেন না )

লো-ফিডেলিটি ডিজাইন করার উদ্দেশ্য হলো দ্রুত কাজ করতে সাহায্য করা, যাতে আপনি যত তাড়াতাড়ি সম্ভব আসল ডিজাইন গঠন করতে শুরু করতে পারেন।

ইউজাররা স্কেচ এবং ওয়ারফ্রেম এর সাথে কিছুই করতে পারবেনা। আপনি তাদের (স্কেচ এবং ওয়ায়ারফ্রেম) ব্যবহার করে আপনার ধারণাগুলি অন্বেষণ করতে পারেন, এবং যখন নেয়া হয়ে যাবে, তখন তাদের সেখানেই রেখে দেন।

Don’t design too much (
অতিরিক্ত ডিজাইন করবেন না)

কোনো অ্যাপের সবগুলো ফিচারের ডিজাইন করার প্রয়োজন নাই। বরং আপনি এটি নিয়ে কাজ শুরু করার আগে ডিজাইন না করা ভালো।

একটি প্রোডাক্টের প্রতিটি ফিচার কিভাবে ইন্টারেক্ট করবে, প্রতিটি প্রান্ত কিভাবে দেখাবে, সেটি নির্ধারণ করা খুবই কঠিন।বিশেষ করে অ্যাবস্ট্রাক্ট কাজে।যেমনঃ

• ব্যবহারকারীর কাছে ২০০০টি কন্ট্যাক্ট থাকলে স্ক্রিনটি কেমন দেখবে?
• এই ফর্মে ত্রুটি বার্তা কোথায় দেখানো উচিত?
• যখন একই সময়ে দুটি ইভেন্ট সংরক্ষিত থাকবে, তখন ক্যালেন্ডারটি কেমন দেখানো উচিত?

আপনি একটি ডিজাইন টুল এবং আপনার ধারণার মাধ্যমে মাত্রই এই সমস্ত জিনিস নির্ধারণ করার চেষ্টা করে আপনার নিজেকে ফ্রাস্ট্রেশন করছেন।

Work in cycles ( সাইকেলে কাজ করুন )

সবকিছু একবারে পূর্ণরূপে ডিজাইন করার বিপরীতে, ছোট ছোট সাইকেলে কাজ করুন। এরপর আপনার পছন্দ মত একটি নতুন সহজ ফিচার ডিজাইন করুন।

যখন আপনি এই বেসিজ ডিজাইনে সন্তুষ্ট হন, এটি বাস্তবায়ন করুন। সম্ভবত আপনি কিছু অপ্রত্যাশিত জটিলতা সম্মুখীন হবেন,- কিন্তু আপনার ইন্টারফেস তৈরীতে যে যে সমস্যার পড়বেন এটির মাধ্যমে ডিজাইন সমস্যা সমাধান করা সহজ হয়।

আপনার ডিজাইনের মধ্যে আর কোনো সমস্যা না থাকলে, আবার ডিজাইন মোডে ফিরে যান এবং পরবর্তী ফিচারে কাজ করতে শুরু করুন।

সংক্ষেপে বলতে গেলে, কাজ করার সময় নিজেকে অতিশয় কঠিন করবেন না। যত দ্রুত সম্ভব বাস্তব জিনিসটি তৈরি করুন যাতে আপনার কল্পনা সব এলোমেলো না হয়।

Be a pessimist (নেতিবাচকভাবে চিন্তা করুন)

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

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

যেহেতু আপনি পরিকল্পনা করেছেন সেহেতু সেইটা নিয়ে কাজ করতে থাকুন এবং পরবর্তী ভার্সনে সেটি পাবলিশ করুন।

নতুন কোনো ফিচার ডিজাইন করার সময় ধরে নিতেই হবে এটা কঠিন হতে পারে। সহজে করা যায় এমন আপশন গুলো দিয়ে কাজ শুরু করুন। এতে কাজের ঝুকি কমবে।

যদি মনে করেন কোনো একটি অংশ থাকলে ভাল হত, সেইটি পরবর্তী ভার্সনের জন্য রেখে দেন। প্রথমে সহজ ভার্সনটি তৈরী করুন এবং পরবর্তীতে করার জন্য কিছু রেখে দেন ।