PWA ইনস্টলেশন প্রচারের জন্য নিদর্শন

Mustafa Kurtuldu

Penny McLachlan

আপনার প্রগ্রেসিভ ওয়েব অ্যাপ (PWA) ইনস্টল করা ব্যবহারকারীদের খুঁজে পাওয়া এবং ব্যবহার করা সহজ করে তুলতে পারে। এমনকি ব্রাউজার প্রচারের সাথেও, কিছু ব্যবহারকারী বুঝতে পারে না যে তারা একটি PWA ইনস্টল করতে পারে, তাই এটি একটি ইন-অ্যাপ অভিজ্ঞতা প্রদান করা সহায়ক হতে পারে যা আপনি আপনার PWA এর ইনস্টলেশন প্রচার এবং সক্ষম করতে ব্যবহার করতে পারেন।

আপনার পিডব্লিউএ-তে দেওয়া একটি সহজ ইনস্টল বোতাম।

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

সেরা অনুশীলন

আপনি আপনার সাইটে কোন প্রচারমূলক প্যাটার্ন ব্যবহার করছেন তা বিবেচনা না করেই প্রযোজ্য কিছু সেরা অনুশীলন রয়েছে।

• আপনার ব্যবহারকারী ভ্রমণের প্রবাহের বাইরে প্রচারগুলি রাখুন। উদাহরণস্বরূপ, একটি PWA লগইন পৃষ্ঠায়, লগইন ফর্মের নীচে কল টু অ্যাকশন রাখুন এবং সাবমিট বোতাম। প্রচারমূলক প্যাটার্নের ব্যাঘাতমূলক ব্যবহার আপনার PWA এর ব্যবহারযোগ্যতা হ্রাস করে এবং নেতিবাচকভাবে আপনার ব্যস্ততার মেট্রিক্সকে প্রভাবিত করে।
• পদোন্নতি বরখাস্ত বা প্রত্যাখ্যান করার ক্ষমতা অন্তর্ভুক্ত করুন। ব্যবহারকারীর পছন্দ মনে রাখবেন যদি তারা এটি করে এবং শুধুমাত্র যদি আপনার সামগ্রীর সাথে ব্যবহারকারীর সম্পর্কের পরিবর্তন হয় যেমন তারা সাইন ইন করে বা একটি ক্রয় সম্পন্ন করে তবেই পুনরায় প্রম্পট করুন৷
• আপনার PWA এর বিভিন্ন অংশে কৌশলগুলি একত্রিত করুন, কিন্তু ইনস্টল প্রচারের মাধ্যমে আপনার ব্যবহারকারীকে অভিভূত বা বিরক্ত না করার বিষয়ে সতর্ক থাকুন।
• beforeinstallprompt ইভেন্ট ফায়ার হওয়ার পরে শুধুমাত্র প্রচার দেখান।

স্বয়ংক্রিয় ব্রাউজার প্রচার

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

ব্রাউজার-প্রদত্ত ইনস্টল প্রচার (ডেস্কটপ)।

ব্রাউজার-প্রদত্ত ইনস্টল প্রচার (মোবাইল)।

অ্যান্ড্রয়েডের জন্য ক্রোম ব্যবহারকারীকে একটি মিনি ইনফোবার দেখায়, যদিও beforeinstallprompt ইভেন্টে preventDefault() কল করে এটি প্রতিরোধ করা যেতে পারে। আপনি যদি preventDefault() এ কল না করেন , কোনো ব্যবহারকারী প্রথমবার আপনার সাইট পরিদর্শন করলে এবং Android-এ ইনস্টলেবিলিটির মানদণ্ড পূরণ করলে ব্যানারটি দেখানো হবে এবং তারপরে প্রায় 90 দিন পর আবার দেখা যাবে৷

ইউজার ইন্টারফেস প্রচারমূলক নিদর্শন

ইউজার ইন্টারফেস প্রচারমূলক প্যাটার্নগুলি প্রায় যেকোনো ধরনের PWA-এর জন্য ব্যবহার করা যেতে পারে এবং সাইট নেভিগেশন এবং ব্যানারের মতো জায়গায় প্রদর্শিত হতে পারে। অন্য যেকোনো ধরনের প্রচারমূলক প্যাটার্নের মতো, ব্যবহারকারীর যাত্রায় ব্যাঘাত কমাতে ব্যবহারকারীর প্রসঙ্গ সম্পর্কে সচেতন হওয়া গুরুত্বপূর্ণ।

যে সাইটগুলি প্রচার UI ট্রিগার করে সেগুলি সম্পর্কে চিন্তাভাবনা করা হয় যখন তারা একটি বৃহত্তর সংখ্যক ইনস্টল অর্জন করে এবং ইনস্টলেশনে আগ্রহী নয় এমন ব্যবহারকারীদের যাত্রায় হস্তক্ষেপ এড়ায়৷

সহজ ইনস্টল বোতাম

সহজতম সম্ভাব্য UX হল আপনার ওয়েব সামগ্রীতে একটি উপযুক্ত স্থানে একটি 'ইনস্টল' বা 'অ্যাপ পান' বোতাম অন্তর্ভুক্ত করা। নিশ্চিত করুন যে বোতামটি অন্যান্য গুরুত্বপূর্ণ কার্যকারিতাকে ব্লক করে না এবং আপনার অ্যাপ্লিকেশনের মাধ্যমে ব্যবহারকারীর যাত্রার পথের বাইরে।

সহজ ইনস্টল বোতাম।

স্থির হেডার

এটি একটি ইনস্টল বোতাম যা আপনার সাইটের হেডারের অংশ। অন্যান্য হেডার কন্টেন্টে প্রায়ই সাইট ব্র্যান্ডিং যেমন একটি লোগো এবং হ্যামবার্গার মেনু অন্তর্ভুক্ত থাকে। আপনার সাইটের কার্যকারিতা এবং ব্যবহারকারীর চাহিদার উপর নির্ভর করে হেডারগুলি position:fixed বা না হতে পারে।

হেডারে কাস্টম ইনস্টল বোতাম।

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

হেডারে কাস্টম ইনস্টল বোতাম

নিশ্চিত হও:

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

ন্যাভিগেশন মেনু

একটি স্লাইড আউট নেভিগেশন মেনুতে একটি ইনস্টল বোতাম/প্রচার যোগ করুন।

নেভিগেশন মেনু আপনার অ্যাপের ইনস্টলেশনের প্রচারের জন্য একটি দুর্দান্ত জায়গা যেহেতু মেনুটি খোলে তারা আপনার অভিজ্ঞতার সাথে জড়িত থাকার ইঙ্গিত দিচ্ছে।

নিশ্চিত হও:

• গুরুত্বপূর্ণ নেভিগেশন বিষয়বস্তু ব্যাহত করা এড়িয়ে চলুন. অন্যান্য মেনু আইটেম নীচে PWA ইনস্টল প্রচার রাখুন.
• ব্যবহারকারী কেন আপনার PWA ইনস্টল করে উপকৃত হবেন তার জন্য একটি সংক্ষিপ্ত, প্রাসঙ্গিক পিচ অফার করুন।

অবতরণ পাতা

একটি ল্যান্ডিং পৃষ্ঠার উদ্দেশ্য হল আপনার পণ্য এবং পরিষেবার প্রচার করা, তাই এটি এমন একটি জায়গা যেখানে আপনার PWA ইনস্টল করার সুবিধাগুলি প্রচার করার সময় এটি বড় হওয়া উপযুক্ত।

একটি ল্যান্ডিং পৃষ্ঠায় কাস্টম ইনস্টল প্রম্পট।

প্রথমে, আপনার সাইটের মূল্য প্রস্তাব ব্যাখ্যা করুন, তারপর দর্শকদের জানাতে দিন যে তারা ইনস্টলেশন থেকে কী পাবেন৷

নিশ্চিত হও:

• আপনার দর্শকদের কাছে সবচেয়ে গুরুত্বপূর্ণ বৈশিষ্ট্যগুলির জন্য আবেদন করুন এবং কীওয়ার্ডগুলিকে আপনার ল্যান্ডিং পৃষ্ঠায় নিয়ে আসতে পারে এমন কীওয়ার্ডগুলিতে জোর দিন৷
• আপনার ইন্সটল প্রমোশন এবং কল টু অ্যাকশন চক্ষু আকর্ষক করুন, কিন্তু আপনি আপনার মূল্য প্রস্তাবটি পরিষ্কার করার পরেই। সর্বোপরি এটি আপনার ল্যান্ডিং পৃষ্ঠা।
• আপনার অ্যাপের যে অংশে ব্যবহারকারীরা তাদের বেশিরভাগ সময় ব্যয় করে সেখানে একটি ইনস্টল প্রচার যোগ করার কথা বিবেচনা করুন।

ব্যানার ইনস্টল করুন

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

পৃষ্ঠার শীর্ষে একটি বাতিলযোগ্য ব্যানার।

নিশ্চিত হও:

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

অস্থায়ী UI

অস্থায়ী UI, যেমন Snackbar ডিজাইন প্যাটার্ন, ব্যবহারকারীকে সূচিত করে এবং তাদের সহজেই একটি অ্যাকশন সম্পূর্ণ করার অনুমতি দেয়, এই ক্ষেত্রে, অ্যাপটি ইনস্টল করা। সঠিকভাবে ব্যবহার করা হলে, এই ধরনের UI প্যাটার্নগুলি ব্যবহারকারীর প্রবাহকে বাধা দেয় না এবং ব্যবহারকারীর দ্বারা উপেক্ষা করা হলে সাধারণত স্বয়ংক্রিয়ভাবে বাতিল হয়ে যায়।

একটি বাতিলযোগ্য স্ন্যাকবার যা ইঙ্গিত করে যে PWA ইনস্টল করা যায়।

আপনার অ্যাপের সাথে কিছু ইন্টারঅ্যাকশনের পর স্ন্যাকবার দেখান। যদি এটি পৃষ্ঠা লোড বা প্রেক্ষাপটের বাইরে প্রদর্শিত হয় তবে এটি সহজেই মিস করা যেতে পারে বা জ্ঞানীয় ওভারলোডের দিকে নিয়ে যেতে পারে। যখন এটি ঘটবে, ব্যবহারকারীরা কেবল তারা যা দেখেন তা খারিজ করে দেবেন। মনে রাখবেন, আপনার সাইটের নতুন ব্যবহারকারীরা আপনার PWA ইনস্টল করার জন্য প্রস্তুত নাও হতে পারে। অতএব, এই প্যাটার্নটি ব্যবহার করার আগে ব্যবহারকারীর কাছ থেকে শক্তিশালী আগ্রহের সংকেত না পাওয়া পর্যন্ত অপেক্ষা করা ভাল, উদাহরণস্বরূপ, পুনরাবৃত্তি ভিজিট, একটি ব্যবহারকারী সাইন ইন, বা অনুরূপ রূপান্তর ইভেন্ট৷

একটি বাতিলযোগ্য স্ন্যাকবার যা ইঙ্গিত করে যে PWA ইনস্টল করা যায়।

নিশ্চিত হও:

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

রূপান্তরের পর

একটি ব্যবহারকারীর রূপান্তর ইভেন্টের পরপরই, যেমন একটি ই-কমার্স সাইটে কেনাকাটার পরে, আপনার PWA এর ইনস্টলেশন প্রচার করার একটি চমৎকার সুযোগ। ব্যবহারকারী স্পষ্টভাবে আপনার বিষয়বস্তুর সাথে জড়িত, এবং একটি রূপান্তর প্রায়ই সংকেত দেয় যে ব্যবহারকারী আবার আপনার পরিষেবার সাথে যুক্ত হবে।

একজন ব্যবহারকারী একটি ক্রয় সম্পূর্ণ করার পরে একটি ইনস্টল প্রচার।

বুকিং বা চেকআউট যাত্রা

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

ব্যবহারকারীর যাত্রার পরে একটি ইনস্টল প্রচার।

নিশ্চিত হও:

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

সাইন আপ, সাইন ইন, বা সাইন আউট প্রবাহ

এই প্রচারটি যাত্রা প্রচারমূলক প্যাটার্নের একটি বিশেষ ক্ষেত্রে যেখানে প্রচার কার্ড আরও বিশিষ্ট হতে পারে।

সাইন আপ পৃষ্ঠায় একটি কাস্টম ইনস্টল বোতাম৷

এই পৃষ্ঠাগুলি সাধারণত শুধুমাত্র নিযুক্ত ব্যবহারকারীদের দ্বারা দেখা হয়, যেখানে আপনার PWA এর মান প্রস্তাব ইতিমধ্যেই প্রতিষ্ঠিত হয়েছে। এছাড়াও প্রায়শই এই পৃষ্ঠাগুলিতে স্থাপন করার জন্য অন্যান্য দরকারী সামগ্রী থাকে না। ফলস্বরূপ, যতক্ষণ না এটি পথে না হয় ততক্ষণ এটি একটি বৃহত্তর কল-টু-অ্যাকশন করা কম ব্যাঘাতমূলক।

নিশ্চিত হও:

• সাইন আপ ফর্মের ভিতরে ব্যবহারকারীর যাত্রা ব্যাহত করা এড়িয়ে চলুন। যদি এটি একটি বহু-পদক্ষেপ প্রক্রিয়া হয়, তাহলে ব্যবহারকারীর যাত্রা সম্পূর্ণ না হওয়া পর্যন্ত আপনি অপেক্ষা করতে চাইতে পারেন।
• সাইন আপ করা ব্যবহারকারীর জন্য সবচেয়ে প্রাসঙ্গিক বৈশিষ্ট্যগুলি প্রচার করুন৷
• আপনার অ্যাপের সাইন-ইন করা এলাকার মধ্যে একটি অতিরিক্ত ইনস্টল প্রচার যোগ করার কথা বিবেচনা করুন।

ইনলাইন প্রচারমূলক নিদর্শন

ইনলাইন প্রচারমূলক কৌশলগুলি সাইটের বিষয়বস্তুর সাথে প্রচারগুলিকে ইন্টারওয়েভ করে। এটি প্রায়শই ইউজার ইন্টারফেসে প্রচারের চেয়ে আরও সূক্ষ্ম, যার ট্রেডঅফ রয়েছে। আপনি চান যে আপনার প্রচারটি যথেষ্ট আলাদা হয়ে উঠুক যাতে আগ্রহী ব্যবহারকারীরা এটি লক্ষ্য করবেন, তবে এতটা নয় যে এটি আপনার ব্যবহারকারীর অভিজ্ঞতার গুণমানকে বিঘ্নিত করে।

ইন-ফিড

একটি ইন-ফিড ইনস্টল প্রচার সংবাদ নিবন্ধ বা আপনার PWA-তে তথ্য কার্ডের অন্যান্য তালিকার মধ্যে উপস্থিত হয়।

একটি সামগ্রী ফিডের মধ্যে একটি ইনস্টল প্রচার।

আপনার লক্ষ্য হল ব্যবহারকারীদের দেখানো যে তারা আরও সুবিধাজনকভাবে যে সামগ্রী উপভোগ করছেন তা কীভাবে অ্যাক্সেস করবেন৷ বৈশিষ্ট্য এবং কার্যকারিতা প্রচারে ফোকাস করুন যা আপনার ব্যবহারকারীদের জন্য সহায়ক হবে।

নিশ্চিত হও:

• বিরক্তিকর ব্যবহারকারীদের এড়াতে প্রচারের ফ্রিকোয়েন্সি সীমিত করুন।
• আপনার ব্যবহারকারীদের প্রচারগুলি খারিজ করার ক্ষমতা দিন।
• খারিজ করার জন্য আপনার ব্যবহারকারীর পছন্দ মনে রাখবেন।