رابط کاربری غنی‌تر نصب PWA

معرفی

دستگاه های تلفن همراه و معرفی فروشگاه های اپلیکیشن فروشنده دستگاه، مدل ذهنی کاربران را از نحوه کشف، ارزیابی و نصب نرم افزار تغییر داده است. کاربران اکنون آنقدر با فروشگاه‌های برنامه و اطلاعات اضافی که از طریق فروشگاه‌های برنامه ارائه می‌شود مانند زمینه برنامه، بازخورد اجتماعی، رتبه‌بندی و غیره آشنا هستند که استعاره فروشگاه برنامه را در سیستم‌عامل‌های دسکتاپ از جمله ChromeOS، Mac و Windows مشاهده می‌کنید.

چالش با سطوح نصب امروزی

امروزه، اگر کاربری بخواهد یک PWA نصب کند، یک نوار اطلاعات و همپوشانی مودال با حداقل اطلاعات ظاهر می شود. اگر به نصب ادامه دهند، این فرآیند خیلی سریع و بدون دادن زمینه به کاربر تمام می شود. این بر خلاف انتظارات آنها از نصب برنامه ها است و می تواند آنها را در مورد اتفاقی که افتاده گیج کند.

نمونه ای از PWA install UI.
نمونه ای از رابط کاربری نصب PWA.

برای فعال کردن برنامه‌نویسان برای ارائه تجربیات نصب‌شده همتراز با تجربیات بومی، Chrome سطح نصب جدیدی به نام Richer Install را معرفی می‌کند که به توسعه‌دهندگان اجازه می‌دهد توضیحات و اسکرین‌شات‌هایی را به فایل مانیفست خود اضافه کنند و آن را در یک گفتگوی صفحه پایین در Chrome for Android نشان دهند.

مثالی از UI صفحه پایین در کروم.
مثالی از UI صفحه پایین در کروم.

این به توسعه‌دهندگان این فرصت را می‌دهد تا فرآیند نصب جذاب‌تری را ایجاد کنند که بهتر با انتظارات کاربر مطابقت داشته باشد و مدل ذهنی موجود از تجربیات نصب‌شده آنها را تقلید کند.

Richer Install UI Expanded.
Richer Install UI Expanded.
Richer Install UI کوچک شد.
Richer Install UI کوچک شد.

سازگاری با عقب

وب‌سایت‌هایی که حداقل یک عکس از صفحه نمایش را در فایل مانیفست خود درج نمی‌کنند، به دریافت درخواست‌های موجود ادامه خواهند داد. این ممکن است در آینده بسته به استقبال جامعه توسعه دهندگان و واکنش کاربران تغییر کند.

پیش نمایش رابط کاربری

این رابط کاربری از Chrome 94 در Android و Chrome 108 در دسک‌تاپ کار می‌کند.

این ویژگی در squoosh.app فعال است و در آنجا قابل مشاهده است.

پیاده سازی

برای نمایش غنی‌تر برنامه‌نویسان محاوره‌ای UI نصب، باید حداقل یک اسکرین شات برای فاکتور فرم مربوطه در آرایه screenshots اضافه کنند. فیلد description الزامی نیست اما توصیه می شود. گفتگوی محتوا با استفاده از محتوای screenshots و فیلدهای description ساخته می‌شود تا تجربه را شبیه‌تر به نصب فروشگاه اپلیکیشن کند. این رابط کاربری به کاربران کمک می کند تا تشخیص دهند که در حال افزودن یک برنامه به دستگاه خود هستند و با فضای بیشتر در دسترس، توسعه دهندگان می توانند زمینه خاصی را در زمان نصب به کاربران خود ارائه دهند.

برای مثال، توسعه‌دهندگان می‌توانند از فیلد description برای برجسته کردن ویژگی‌های برنامه استفاده کنند که کاربر را تشویق می‌کند تا آن را در دستگاه‌های خود نگه دارد، و با screenshots می‌توانند ظاهر و احساس برنامه وب را به صورت مستقل و با دسترسی آسان به آن پلتفرم ارائه دهند. برنامه ها دارند.

برای مشخصات دقیق و راهنمای اضافه کردن آنها به برنامه خود، از الگوی رابط کاربری Richer Install دیدن کنید.

بازخورد

در آینده ما اضافه کردن داده‌های دیگری مانند دسته‌ها و رتبه‌بندی برنامه را در نظر خواهیم گرفت، اما این بر اساس بازخورد توسعه‌دهندگان و کاربران خواهد بود.

در ماه‌های آینده ما دوست داریم ببینیم توسعه‌دهندگان چگونه این الگوی رابط کاربری جدید را بررسی می‌کنند و مایلیم از شما بازخورد دریافت کنیم. با پر کردن این فرم با ما در ارتباط باشید