Progressive Web 애플리케이션 설정

Progressive Web 애플리케이션(PWA)은 모바일 기기에서 앱과 유사한 경험을 제공하는 웹 기반 애플리케이션입니다. 사용자가 홈 화면에 직접 웹숍을 설치할 수 있으므로 브라우저를 열고 수동으로 스토어로 이동할 필요 없이 빠르게 액세스할 수 있습니다.

리디렉션 제한이 있는 플랫폼의 경우 PWA는 사용자가 보다 직접적이고 편리하게 스토어에 도달할 수 있는 방법을 제공하여 불필요한 절차를 줄이고 참여도를 높일 수 있습니다. PWA는 액세스를 간소화함으로써 사용자 리텐션을 개선하고 더 자주 구매하도록 유도합니다.

PWA 설치 사용자 흐름

• iOS 기기에서
• Android 기기에서

1. 사용자가 모바일 기기에서 웹샵을 엽니다.

2. 웹샵은 화면 하단에 애플리케이션 설치 프롬프트 배너를 표시합니다.

3. 사용자가 설치를 클릭합니다.

4. 웹샵에 PWA의 설치 지침이 표시됩니다.

5. 사용자는 지침을 따릅니다. 그 결과, PWA가 사용자 기기의 홈 화면에 추가됩니다.

1. 사용자가 모바일 기기에서 웹샵을 엽니다.

2. 웹샵은 화면 하단에 애플리케이션 설치 프롬프트 배너를 표시합니다.

3. 사용자가 설치를 클릭합니다.

4. 사용자는 시스템 대화 상자 창에서 설치를 확인합니다.

5. PWA는 자동으로 설치되며 홈 화면과 애플리케이션 서랍에 표시됩니다.

설정 방법

1. 관리자 페이지에서 프로젝트를 열고 스토어프런트 > 웹 사이트 섹션으로 이동합니다.
2. 웹샵 사이트 창에서 사이트 빌더 열기를 클릭합니다.
3. 웹앱 설정으로 이동합니다.
4. 웹 앱 사용 토글을 활성화로 설정합니다.

5. 애플리케이션 설치 프롬프트 배너 사용자 지정(선택 사항):
   • 배너 헤더 텍스트를 변경합니다.
   • 배너 보조 텍스트를 변경합니다.
   • 사용자 지정 배경을 설정합니다.
   • 버튼 스타일을 변경합니다.

6. 설치 지침을 사용자 지정합니다(선택 사항).

7. 사용자 기기에 표시할 PWA 외관 설정:
   1. PWA의 이름을 지정합니다. 사용자 기기의 홈 화면이나 애플리케이션 서랍에 표시됩니다.
   2. PWA 아이콘을 업로드합니다.

알림

PWA가 게임과 동일한 아이콘을 사용하는 경우 아이콘 프레임 표시 토글을 활성화로 설정하는 것이 좋습니다. 이렇게 하면 스토어 아이콘 주위에 프레임이 추가되어 사용자가 게임과 쉽게 구분할 수 있습니다.

8. 변경 사항을 적용하려면 사이트를 게시합니다.