소개
휴대기기와 기기 공급업체 앱 스토어의 도입으로 소프트웨어 검색, 평가, 설치 방식에 관한 사용자의 정신 모델이 바뀌었습니다. 이제 사용자는 앱 스토어를 통해 제공되는 추가 정보(예: 앱 컨텍스트, 소셜 의견, 평점 등)에 매우 익숙하여 ChromeOS, Mac, Windows를 비롯한 데스크톱 운영체제에서 새롭게 등장하는 앱 스토어 비유를 볼 수 있습니다.
오늘날의 설치 표면의 과제
현재 사용자가 PWA를 설치하려는 경우 정보 표시줄과 모달 오버레이가 최소한의 정보로 표시됩니다. 사용자가 계속 설치한다면 사용자에게 컨텍스트를 제공하지 않고 프로세스가 너무 빨리 종료됩니다. 이렇게 하면 앱 설치에 관한 사용자의 기대에 어긋나고 발생한 상황에 관해 다소 혼란스러워할 수 있습니다.
개발자가 네이티브 환경과 동일한 설치 환경을 제공할 수 있도록 Chrome에서는 새로운 설치 표시 경로인 풍부한 설치를 도입합니다. 이 기능을 사용하면 개발자가 매니페스트 파일에 설명과 스크린샷을 추가하여 Android용 Chrome 내의 하단 시트 대화상자에 표시할 수 있습니다.
이를 통해 개발자는 사용자 기대에 더 잘 맞고 설치된 환경의 기존 멘탈 모델을 모방하는 좀 더 매력적인 설치 프로세스를 만들 수 있습니다.
이전 버전과의 호환성
매니페스트 파일에 스크린샷을 하나 이상 포함하지 않는 웹사이트는 기존 메시지를 계속 수신합니다. 이는 개발자 커뮤니티 및 사용자 반응에 따라 향후 변경될 수 있습니다.
UI 미리보기
이 UI는 Android의 Chrome 94 및 데스크톱의 Chrome 108에서 작동합니다.
이 기능은 squoosh.app에서 사용 설정되며 여기에서 미리 볼 수 있습니다.
구현
더 풍부한 설치 UI 대화상자를 표시하려면 개발자는 screenshots
배열에 상응하는 폼 팩터의 스크린샷을 하나 이상 추가해야 합니다. description
필드는 필수는 아니지만 사용하는 것이 좋습니다. 앱 스토어 설치와 유사한 환경을 만들기 위해 screenshots
및 description
필드의 콘텐츠를 사용하여 콘텐츠 대화상자가 빌드됩니다. 이 UI를 통해 사용자는 기기에 앱을 추가 중임을 알 수 있으며, 개발자는 사용 가능한 공간이 더 넓어 설치 시 사용자에게 특정 컨텍스트를 제공할 수 있습니다.
예를 들어 개발자는 description
필드를 사용하여 사용자가 기기에 앱을 계속 사용하도록 하는 앱 기능을 강조 표시할 수 있고, screenshots
를 사용하면 플랫폼 앱에서 제공하는 모든 간편한 액세스와 함께 웹 앱의 디자인과 분위기를 독립형으로 표시할 수 있습니다.
자세한 사양과 앱에 이를 추가하는 방법은 풍부한 설치 UI 패턴을 참고하세요.
의견
향후 카테고리 및 앱 평점과 같은 다른 데이터 추가를 고려할 예정이며, 이는 개발자와 사용자의 의견을 기반으로 합니다.
향후 몇 개월 동안 개발자가 이 새로운 UI 패턴을 어떻게 살펴보는지 확인하고자 하며 여러분의 의견을 듣고자 합니다. 이 양식을 작성하여 Google에 문의해 주세요.