사용자는 일반적으로 앱 스토어를 통해 앱, 특히 플랫폼 앱을 다운로드받거나 패키지를 다운로드하고 설치하는 방식으로 앱을 받습니다. 오늘날 데스크톱 환경조차도 중앙 집중식 스토어에서 앱을 제공하는 방향으로 전환하고 있습니다.
웹 앱의 경우 모델이 다릅니다. 사용자가 웹 앱을 가져오기 위해 중앙 집중식 앱 디포를 방문할 필요가 없습니다. 설계상 모든 웹 환경을 설치할 수 있는 것은 아닙니다. 앱 설치는 플랫폼과 브라우저에 따라 다를 수 있으며 브라우저에서도 앱을 설치할 수 있는 메뉴와 노출 영역도 다릅니다. 사용자가 설치 옵션을 클릭하면 기본 대화상자에 아래와 같이 추가 정보가 포함되지 않습니다.
설치할 수 있고 플랫폼 앱과 동일한 상호작용을 제공하는 웹 앱을 만들려면 이러한 환경을 가능하게 하는 기술적 작업과 사용자가 이러한 다양한 설치 흐름을 활용할 수 있는 좋은 안내가 필요합니다.
웹 개발자는 풍부한 설치 UI를 사용하여 설치 시 사용자에게 앱에 관한 구체적인 컨텍스트를 사용자에게 제공할 수 있습니다. 이 UI는 Chrome 94의 모바일과 Chrome 108의 데스크톱에서 사용할 수 있습니다. Chrome은 계속해서 설치 가능한 앱을 위한 간단한 설치 대화상자를 제공하는 한편, 이 더 커진 UI는 개발자에게 웹 앱을 강조표시할 수 있는 공간을 제공합니다. 또한 앱 스토어의 대화상자와 비슷하기 때문에 설치 과정이 더 친숙해집니다.
더 풍부한 설치 UI 사용 설정
더 풍부한 설치 UI 대화상자를 표시하려면 개발자는 screenshots 배열에 상응하는 폼 팩터의 스크린샷을 하나 이상 추가해야 합니다. description 필드는 필수는 아니지만 사용하는 것이 좋습니다. 콘텐츠 대화상자는 이 두 필드의 콘텐츠로 빌드되므로 앱 스토어 설치와 더 유사한 환경이 만들어집니다. 이를 통해 사용자는 기기에 앱을 추가 중임을 알 수 있으며, 개발자는 사용 가능한 공간이 더 넓어져 설치 시 사용자에게 특정 컨텍스트를 제공할 수 있습니다.
예를 들어 개발자는 description 필드를 사용하여 사용자가 기기에 앱을 계속 사용하도록 유도하는 앱 기능을 강조표시할 수 있습니다. screenshots를 사용하면 웹 앱의 디자인과 분위기를 독립형으로 표현할 수 있으며, 플랫폼 앱이 보유하는 모든 간편한 액세스를 사용할 수 있습니다.
자세한 사양과 앱에 이를 추가하는 방법은 풍부한 설치 UI 패턴을 참고하세요.
이전 스타일의 설치 메시지에서는 정보와 컨텍스트를 거의 제공하지 않았습니다. 이는 설치의 의미에 대한 사용자의 기대와 일치하지 않아 사용자가 발생한 상황에 대해 혼란스러워할 수 있습니다. 많은 사용자가 설치 요청을 완전히 거부했으며 이는 설치 요청을 구축한 기업들도 좋지 않았습니다.
풍부한 설치를 통해 운영체제에서와 유사한 환경을 만들 수 있습니다.
Squoosh 앱 매니페스트 파일의 예를 따라 직접 빌드할 수 있으며 https://squoosh.app/에서 대화상자를 실행해 볼 수 있습니다.
의견 Google에서는 카테고리 및 앱 평점을 포함하여 더 풍부한 설치를 위한 다른 옵션을 고려하고 있습니다. 이러한 결정을 내리기 위해서는 여러분의 의견이 필요합니다. 디자인에 관한 의견을 알려주세요. 리치 설치 UI가 예상대로 작동하지 않는 부분이 있나요? 아니면 아이디어를 구현하는 데 필요한 특정 데이터가 있나요? 질문이나 의견이 있으신가요? 이 양식을 작성합니다.
사진: Kaboompics .com(Pexels 제공)