foodpanda bangladesh থেকে ফুড অ্যাপ UX রেফারেন্স

foodpanda bangladesh থেকে ফুড অ্যাপ UX শিখতে হলে রেস্টুরেন্ট ডেলিভারি ও pandamart-কে আলাদা কেনাকাটার প্রবাহ হিসেবে ধরুন। ঢাকার এলাকা অনুযায়ী ডেলিভারি ফি, BDT মিনিমাম অর্ডার, bKash/কার্ড/ক্যাশ পেমেন্ট এবং রান্না থেকে রাইডার ট্র্যাকিংয়ের স্পষ্ট স্ট্যাটাস একই স্ক্রিন-সিস্টেমে দেখান।

মূল বিষয়গুলো

• •রেস্টুরেন্টের খাবার ও pandamart-এর দ্রুত-পণ্য কেনা একই অ্যাপে থাকলেও তাদের লিস্ট, কার্ট ও রিপ্লেসমেন্ট নিয়ম আলাদা হওয়া দরকার।
• •ডেলিভারি ফি ও BDT মিনিমাম অর্ডার রেস্টুরেন্ট কার্ডে ইঙ্গিত দিন, কার্টে হিসাব স্পষ্ট করুন এবং চেকআউটে চূড়ান্ত পরিমাণ দেখান।
• •bKash, কার্ড ও ক্যাশকে কেবল আইকন নয়—নির্বাচন, প্রাপ্যতা ও অর্ডার-নিশ্চিতকরণের পৃথক অবস্থা হিসেবে ডিজাইন করুন।
• •ট্র্যাকিং স্ক্রিনে অর্ডার গ্রহণ, রান্না, রাইডার বরাদ্দ ও রওনা হওয়ার অবস্থাগুলো ক্রমানুসারে দেখান।

এই পাতায় যা আছে

• •গ্যালারি ১: রেস্টুরেন্ট লিস্ট ও মেনু স্ক্রিন
• •গ্যালারি ২: pandamart, কার্ট ও রিপ্লেসমেন্ট সিদ্ধান্ত
• •গ্যালারি ৩: চেকআউট, অফার ও ডেলিভারি ট্র্যাকিং
• •Floow-এ এই রেফারেন্সকে স্ক্রিনে নিন

গ্যালারি ১: রেস্টুরেন্ট লিস্ট ও মেনু স্ক্রিন

রেস্টুরেন্ট-ডেলিভারি হোম স্ক্রিনে প্রথমে লোকেশন, সার্চ, ক্যাটাগরি এবং অফার-এন্ট্রি রাখুন। এরপর রেস্টুরেন্ট কার্ডে নাম, খাবারের ধরন, আনুমানিক সময়, রেটিং এবং ডেলিভারি সংক্রান্ত সংক্ষিপ্ত তথ্য দিন। ঢাকায় ব্যবহারকারী অনেক সময় নির্দিষ্ট এলাকা ধরে অর্ডার করেন; তাই নির্বাচিত ডেলিভারি এলাকার ভিত্তিতে ডেলিভারি ফি এবং BDT মিনিমাম অর্ডার কার্ডেই দেখা গেলে অপ্রয়োজনীয় ট্যাপ কমে। ফি চূড়ান্ত না হলে “এলাকা অনুযায়ী প্রযোজ্য” ধরনের সতর্ক ভাষা ব্যবহার করুন, নির্দিষ্ট অঙ্ক বানিয়ে লিখবেন না।

মেনু স্ক্রিনে স্টিকি রেস্টুরেন্ট নাম, ক্যাটাগরি ট্যাব, আইটেমের ছবি, দাম, বিবরণ ও + নিয়ন্ত্রণ রাখুন। কাস্টমাইজেশনে যেমন ঝাল, ভাতের ধরন বা অতিরিক্ত আইটেম—আগে প্রয়োজনীয় নির্বাচন, পরে ঐচ্ছিক সংযোজন দেখান। অফার থাকলে পুরনো দাম, ছাড়ের শর্ত এবং কার্টে প্রযোজ্য কি না একই ভাষায় দেখান। ui ux design-এ সবচেয়ে দরকারি বিষয় হলো: ব্যবহারকারী কখন কত দেবেন এবং কোন বিকল্পটি বাছছেন, তা যেন মেনু ছাড়াই বোঝেন। Foodpanda-এর বাংলাদেশি রেস্টুরেন্ট ডেলিভারি রেফারেন্সে এই তথ্যগুলোকে লিস্ট থেকে কার্ট পর্যন্ত একই ক্রমে রাখা যায়।

গ্যালারি ২: pandamart, কার্ট ও রিপ্লেসমেন্ট সিদ্ধান্ত

pandamart-ধাঁচের স্ক্রিনকে রেস্টুরেন্ট মেনুর কপি বানাবেন না। এখানে ব্যবহারকারী দুধ, স্ন্যাকস, পানীয় বা দৈনন্দিন প্রয়োজনের পণ্য দ্রুত খোঁজেন; তাই বিভাগ, ব্র্যান্ড/ধরন ফিল্টার, পণ্যের ইউনিট এবং স্টক-সংক্রান্ত সংকেত বেশি গুরুত্বপূর্ণ। Foodpanda Bangladesh-এর pandamart ক্যাটাগরি রেফারেন্স থেকে আলাদা সার্চ-ফল, পণ্য কার্ড ও দ্রুত-যোগ কার্ট প্যাটার্ন নেওয়া যায়।

কার্টে প্রতিটি পণ্যের নাম, ভ্যারিয়েন্ট, পরিমাণ, একক দাম ও পরিবর্তনের নিয়ন্ত্রণ দৃশ্যমান রাখুন। কোনো পণ্য না থাকলে রিপ্লেসমেন্টের সিদ্ধান্ত অর্ডার দেওয়ার আগেই নিন: “বিকল্প অনুমোদন”, “ফোনে জিজ্ঞেস করুন”, অথবা “বাদ দিন”—এই তিনটি সিদ্ধান্ত বোঝা সহজ। বিকল্প অনুমোদন করলে সর্বোচ্চ গ্রহণযোগ্য দাম বা “একই ধরনের পণ্য” পছন্দও নেওয়া যায়, তবে ব্যবহারকারী যা অনুমোদন করেননি তা চুপচাপ বদলাবেন না।

এই প্রবাহের prototype-এ অন্তত চারটি অবস্থা দেখান: পণ্য পাওয়া যাচ্ছে, সীমিত স্টক, বিকল্প প্রস্তাব, এবং বিকল্প প্রত্যাখ্যাত। ফলে দলটি বুঝতে পারে কোথায় কার্টের মোট বদলাতে পারে, আর ব্যবহারকারী কেন নোটিফিকেশন পাবেন।

গ্যালারি ৩: চেকআউট, অফার ও ডেলিভারি ট্র্যাকিং

চেকআউট স্ক্রিনে ঠিকানা, ডেলিভারি নির্দেশনা, সময়, পেমেন্ট, ভাউচার এবং অর্ডার-সামারি একবারে যাচাই করা যায় এমনভাবে সাজান। বাংলাদেশি খাবার অর্ডারে bKash, কার্ড ও ক্যাশ—তিনটি পেমেন্ট পছন্দ আলাদা সারি হিসেবে দিন। নির্বাচিত পদ্ধতির অবস্থা স্পষ্ট করুন: bKash বা কার্ডে পেমেন্ট ধাপ লাগবে কি না, আর ক্যাশে রাইডারের জন্য কী পরিমাণ প্রস্তুত রাখতে হবে। কোনো পদ্ধতি নির্দিষ্ট অর্ডারে অপ্রাপ্য হলে সেটি লুকিয়ে না রেখে কারণসহ নিষ্ক্রিয় দেখান।

ডেলিভারি ফি কার্টে লাইন আইটেম হিসেবে, আর BDT মিনিমাম অর্ডার না হলে অগ্রগতি বার বা স্পষ্ট বার্তায় দেখান। অফার প্রযোজ্য হওয়ার পরে মোট কত বদলাল, তা সামারিতে দেখানো জরুরি। অর্ডার দেওয়ার পর স্ট্যাটাসকে শুধু মানচিত্রে সীমাবদ্ধ রাখবেন না। “অর্ডার গ্রহণ করা হয়েছে”, “রেস্টুরেন্ট রান্না করছে”, “রাইডার বরাদ্দ হয়েছে”, “রাইডার পথে আছেন” এবং “পৌঁছেছে”—এমন ক্রমানুগ টাইমলাইন দিন। রাইডার বরাদ্দের আগে মানচিত্রে নির্ভুল অবস্থান দেখানোর ভান না করে পরবর্তী প্রত্যাশিত ধাপ ও সাহায্য নেওয়ার পথ দেখান।

Floow-এ এই রেফারেন্সকে স্ক্রিনে নিন

Floow দিয়ে একটি সংক্ষিপ্ত ফ্লো তৈরি করুন: রেস্টুরেন্ট লিস্ট → মেনু → কার্ট → চেকআউট → রান্নার স্ট্যাটাস → রাইডার ট্র্যাকিং। দ্বিতীয় ফ্লোতে pandamart লিস্ট → পণ্য বিবরণ → রিপ্লেসমেন্ট পছন্দ → কার্ট যোগ করুন। প্রম্পটে ঢাকার এলাকা নির্বাচক, BDT-তে মূল্য, ডেলিভারি ফি ও মিনিমাম অর্ডারের ক্ষেত্র, এবং bKash/কার্ড/ক্যাশ পেমেন্ট বিকল্প লিখুন।

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

ঢাকাভিত্তিক ফুড-অর্ডার স্ক্রিনে কোন তথ্য কোথায় দেখাবেন

সাধারণ ভুলগুলো

রেস্টুরেন্ট ও pandamart-এর জন্য একই মেনু-প্যাটার্ন ব্যবহার করা

pandamart-এ ইউনিট, স্টক ও রিপ্লেসমেন্টকে অগ্রাধিকার দিন; রেস্টুরেন্টে খাবারের কাস্টমাইজেশন ও প্রস্তুতির সময়কে অগ্রাধিকার দিন।

ডেলিভারি ফি শুধু অর্ডার নিশ্চিত করার শেষ ধাপে দেখানো

রেস্টুরেন্ট লিস্ট ও কার্টে এলাকা-নির্ভর ফি সম্পর্কে আগাম ইঙ্গিত দিন, চেকআউটে চূড়ান্ত BDT হিসাব দেখান।

পেমেন্ট আইকন দেখিয়েও নির্বাচনের ফল না জানানো

bKash, কার্ড ও ক্যাশ নির্বাচনের পর প্রাসঙ্গিক নির্দেশনা, প্রাপ্যতা ও অর্ডার নিশ্চিতকরণের ধাপ দেখান।

রাইডার বরাদ্দের আগেই লাইভ লোকেশন দেখানো

আগের ধাপে রান্নার অগ্রগতি ও সম্ভাব্য পরবর্তী কাজ দেখান; রাইডার বরাদ্দ হলে তবেই অবস্থানভিত্তিক ট্র্যাকিং দিন।

সচরাচর জিজ্ঞাসিত প্রশ্ন

foodpanda bangladesh-এর মতো মেনু UI কীভাবে বানাব?

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

ডেলিভারি ফি কখন দেখাব?

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

খাবার অর্ডার ট্র্যাকিংয়ে কী তথ্য দরকার?

খাবার অর্ডার ট্র্যাকিংয়ে অর্ডার গ্রহণ, রেস্টুরেন্টের রান্না, রাইডার বরাদ্দ, রাইডারের রওনা এবং ডেলিভারির অবস্থা ক্রমানুসারে দেখানো দরকার। রাইডার বরাদ্দ হলে যোগাযোগের পথ, ডেলিভারি ঠিকানা ও প্রাসঙ্গিক অবস্থান দেখান। রাইডার না থাকলে লাইভ ম্যাপের বদলে পরবর্তী স্ট্যাটাস এবং সহায়তা বিকল্প দেখান।

pandamart অর্ডারে রিপ্লেসমেন্ট অপশন কীভাবে দেখাব?

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

শেষ কথা

ভালো ফুড-অর্ডার UX-এর ভিত্তি হলো খরচ, পণ্যের প্রাপ্যতা ও অর্ডারের অবস্থা লুকিয়ে না রাখা। Floow দিয়ে রেস্টুরেন্ট লিস্ট, কার্ট, রান্নার স্ট্যাটাস ও রাইডার ট্র্যাকিং স্ক্রিন তৈরি করে আগে এই গুরুত্বপূর্ণ অবস্থাগুলো পরীক্ষা করুন।

---

আগে স্ক্রিনগুলো ডিজাইন করুন

সহজ ভাষায় আপনার অ্যাপের বর্ণনা দিন—floow.design আপনার জন্য iOS ও Android স্ক্রিন তৈরি করে দেবে, যা আপনি পরে আরও পরিমার্জন করে হ্যান্ডঅফ করতে পারবেন।

বিনামূল্যে ডিজাইন শুরু করুন →

---

সূত্র

• •Foodpanda Bangladesh
• •bKash

Related reading

• •freelancing in bangladesh-এর জন্য অ্যাপ UI
• •bangla website design থেকে অ্যাপ UI
• •ecommerce in bangladesh অ্যাপ UX গাইড