PWA 및 Magento: 차세대 모바일 쇼핑 경험 만들기

Scandiweb의 콘텐츠 책임자인 Viesturs Abelis의 게스트 게시물입니다.

프로그레시브 웹 애플리케이션. 모두가 그것에 대해 이야기하고 있으며 정확히 무엇인지 확실하지 않더라도 이미 기술을 사용하고 있을 것입니다. Twitter, Starbucks, AliExpress 및 기타 셀 수 없이 많은 사람들이 매일 수백만 명의 사람들이 사용하는 PWA를 성공적으로 구현했습니다.

그리고 그 결과가 나타납니다. Twitter는 세션당 페이지 수가 65%, 전송된 트윗이 75%, 이탈률이 20% 감소했습니다. AliExpress는 세션당 방문한 페이지 수를 두 배로 늘렸고 전환율이 104% 증가했습니다. Google은 PWA 성공 사례의 놀라운 포트폴리오를 축적했습니다.

몇 년 전만 해도 높은 개발 비용과 맞춤형 솔루션의 불가피성으로 인해 디지털 거물들이 주로 활용하던 기술이 오늘날 점점 더 대중화되고 접근 가능해지고 있습니다. 새로운 PWA 솔루션과 PWA의 광범위한 수용 덕분에 이제 모든 사람이 이 기술을 사용할 수 있습니다.

PWA는 게임 체인저처럼 보이며 점점 더 많은 판매자가 이러한 추세에 뛰어들면서 현재 상황과 이 새로운 기술이 귀하에게 의미하는 바를 이해하는 것이 중요합니다.

프로그레시브 웹 애플리케이션이란 무엇입니까?

프로그레시브 웹 애플리케이션은 웹과 기본 앱의 장점을 결합하고 사용자의 브라우저에서 바로 우수한 앱과 같은 디지털 경험을 생성하는 새로운 유형의 웹 개발 기술입니다. 따라서 PWA라고 하면 기본 앱의 기능과 모든 기능을 갖춘 모바일 웹사이트를 생각하십시오.

정확히 어떤 기능에 대해 이야기하고 있습니까? 무엇보다도 PWA가 빠릅니다. 페이지 로드 속도가 300% 향상되어 고도로 최적화된 페이지가 거의 즉각적인 로드 시간에 도달하여 네이티브 앱처럼 반응이 빠르고 쾌적하게 사용할 수 있습니다.

다른 기능으로는 전체 화면 UI, 홈 화면 저장, 푸시 알림, 하드웨어 접근성 및 오프라인 모드도 있습니다. Google 개발자 커뮤니티의 이 강연에서 자세히 알아볼 수 있는 놀라운 서비스 워커에 의해 가능해진 PWA는 진정한 앱과 같은 경험을 제공하기 위해 다양한 최신 디지털 개발을 번들로 제공합니다.

원하는 경우 앱 스토어에 배포할 수도 있습니다. 그러나 이러한 플랫폼에 국한된 기본 앱과 달리 PWA는 일반 웹사이트처럼 작동하고 Google에서 색인을 생성할 수 있으므로 검색할 수 있을 뿐만 아니라 더 빠른 로드 시간과 제공되는 더 나은 경험으로 인해 잠재적인 SERP 향상을 제공합니다. 이는 또한 마찰 없는 초기 참여를 위한 대량 다운로드 및 자동 업데이트가 없음을 의미합니다.

PWA의 인기 상승은 네이티브 앱과 모바일 웹이 사용되는 방식 사이의 새로운 기회 격차에 기인할 수 있습니다. 모바일 웹은 더 많은 방문자를 확보하지만 앱은 참여 측면에서 더 나은 경험을 제공하고 웹을 능가합니다. PWA는 사람들이 원하는 바로 그곳에서 원하는 경험을 제공합니다.

PWA: 과대 광고 또는 미래?

모든 새로운 기술과 마찬가지로 주의가 채택보다 우선합니다. 브라우저 지원에 크게 의존하고 초기 단계에서 불안정하며 여전히 지속적인 개발에서 PWA는 아직 확실한 채택을 위한 확실성과 마음의 평화를 제공하지 않습니다. 상인들이 그들을 이해하기 위해 분주하게 움직이면서 PWA를 둘러싼 신비로운 분위기가 있습니다.

그러나 한 가지는 확실합니다. 그것은 단지 과대 광고가 아닙니다. 기술은 건전하고 얼리 어답터는 큰 보상을 받았으며 지식이 확산됨에 따라 채택도 증가합니다.

PWA는 거의 모든 마케팅 KPI에 긍정적인 영향을 미칩니다.

실제 사례 연구는 성과, 참여, 사이트에 머문 시간, 생성된 리드, 재참여, 전환 등 거의 모든 마케팅 KPI에 긍정적인 영향을 미치는 PWA의 능력을 보여주었습니다.

모바일 퍼스트 시대에 이러한 변혁적 기술이 보다 전통적인 디지털 채널을 능가한다는 것은 놀라운 일이 아니며 모바일 경험의 우선 순위가 여전히 높아지는 추세입니다. 모바일 쇼핑은 점점 더 전자 상거래를 지배하고 있습니다. Google은 최근 모바일 우선 인덱싱을 발표했으며 2019년 7월 1일부터 모든 새 웹사이트에 기본적으로 활성화되어 있습니다. 그리고 상당수의 새로운 인터넷 사용자가 모바일에서 디지털 여정을 시작합니다.

따라서 수준 이상의 모바일 경험을 제공하는 것은 두 팔 벌려 환영하며, 그 중요성이 높아지면서 전 세계의 마케터가 경쟁력을 유지하기 위해 이에 더 집중하게 될 것입니다.

PWA는 접근성 측면에서 중요한 역할을 하므로 고객에게 더 나은 디지털 경험을 제공하는 것뿐만 아니라 새로운 경험에 도달하는 것입니다. PWA의 가벼운 데이터 요구로 인해 UX 타협 없이 최적의 네트워크 범위를 가진 사람들을 위해 액세스 가능한 디지털 경험이 가능합니다. 예를 들어 Uber의 확장 이니셔티브는 PWA와 함께 진행되어 연결 속도가 느린 시골 및 기타 지역에서 여전히 매력적이고 반응이 빠른 경험을 경험할 수 있도록 했습니다.

또한 전 세계적으로 PWA 채택이 진행 중이므로 이제 전 세계의 판매자가 현재 및 미래의 고객을 위해 동일한 작업을 수행할 수 있습니다.

Magento는 열린 팔로 PWA를 환영합니다

Magento는 한동안 PWA에 관심을 가져왔습니다. 2017년 9월에 PWA 스튜디오를 소개하고 2019년 1월에 마침내 빛을 보았고 5월에 Magento Imagine 2019가 시작될 때 PWA는 모든 사람의 마음에 있었고 확실히 회의의 뜨거운 주제였습니다.

Magento가 PWA에 대해 우선적으로 뛰어들고 PWA의 기능을 보여주는 수많은 다른 솔루션이 개발되었지만 커뮤니티는 판매자와 확장 빌더가 집결할 수 있는 결정적인 솔루션이 없기 때문에 따르기를 다소 꺼려합니다. 결과적으로 이는 사용자 정의 개발 시도로 이어지며, 특히 심하게 수정되고 고도로 사용자 정의된 상점 전면에 있어서 채택을 폄하하는 경우 비용이 많이 들고 지속 불가능하게 됩니다.

그럼에도 불구하고 PWA 매장은 바로 이 순간에 수많은 Magento 상인을 위해 개발되고 있습니다. Magento는 PWA에 막대한 투자를 하고 있으며 나머지 세계도 마찬가지입니다.

Magento 상인의 경우 PWA에 무슨 일이 일어날 것인지에 대한 질문이 아닙니다. PWA가 있습니다. 문제는 ― 시작하는 방법?

Magento를 위한 3가지 PWA 솔루션

Magento는 시장에서 가장 강력한 전자 상거래 솔루션 중 하나입니다. Magento는 인터넷에 있는 모든 전자 상거래 상점의 12%를 지원하며 채택률은 해마다 계속 증가하고 있습니다. 이러한 시장 점유율을 통해 PWA 플랫폼이 되는 것은 Magento가 인터넷을 근본적으로 재정의하는 데 도움이 될 수 있으며 상점에 PWA를 구입하는 데 관심이 있는 모든 판매자가 그렇게 할 수 있도록 보장함으로써 인터넷을 근본적으로 재정의하는 데 도움이 됩니다.

Magento 상점을 위한 PWA를 얻으려면 몇 가지 옵션을 사용할 수 있습니다. 주목할만한 세 가지를 소개합니다.

마젠토 PWA 스튜디오

Magento PWA Studio는 새로운 열풍에 대한 Magento의 답변이며 몇 년 동안 작업해 왔습니다. Magento 2.3과 함께 출시된 Magento용 PWA 프론트엔드 구축을 위한 개발자 도구 모음입니다. 개발, 배포 및 유지 관리에 필요한 모든 것을 개발자에게 제공하고 풍부한 문서로 보완되는 Magento PWA 스튜디오는 미래에 매장을 운영하려는 Magento 판매자에게 필요한 도구가 될 것입니다.

무엇을 달성할 수 있는지 보여주기 위해 Magento PWA 스튜디오 도구를 사용하여 Inchoo에서 개발한 이 데모 스토어(참고: 모바일 장치에서 수행하십시오)를 살펴보십시오.

스칸디PWA

Magento PWA Studio와 달리 ScandiPWA(Scandiweb에서 개발)는 도구 세트나 상점이 아닌 오픈 소스 Magento 우선 테마입니다. 즉, 인프라 변경 없이 Magento 2.3 스토어에 직접 설치할 수 있으며 모든 Magento 개발자에게 익숙한 방식으로 필요에 맞게 확장할 수 있습니다. 커뮤니티에서 많은 찬사를 받은 ScandiPWA의 즉시 사용 가능한 테마는 번거롭지 않고 고성능 기성 PWA 솔루션을 찾는 사람들에게 훌륭한 솔루션으로 많은 관심을 받았습니다.

ScandiPWA 데모 스토어(참고: 모바일 장치에서 하십시오) 또는 GitHub 저장소를 탐색하십시오.

뷰 스토어프론트

시장에서 가장 인기 있는 PWA 솔루션 중 하나인 Vue Storefront는 Vue.js로 작성된 전자 상거래용 오픈 소스 플랫폼에 구애받지 않는 Progressive Web App입니다. 호황을 누리고 있는 커뮤니티와 함께 ​​가장 큰 PWA 허브 중 하나입니다. 규모가 크다는 점을 감안할 때 다소 복잡한 솔루션입니다. Magento 우선이 아니라 플랫폼에 구애받지 않는다는 것은 일부 Magento 기능이 누락되었음을 의미하지만 개발이 계속됨에 따라 이 문제가 수정될 것으로 기대할 수 있습니다.

Vue Storefront 데모 스토어(참고: 모바일 장치에서 하십시오) 또는 번성하는 GitHub 리포지토리를 탐색하십시오.

Magento-First PWA 솔루션의 이점

Magento 플랫폼의 판매자라면 Magento 우선 PWA 솔루션이 PWA 경쟁에 참여하는 가장 쉬운 방법이 될 수 있습니다. 이러한 솔루션은 친숙함, 낮은 개발 비용, 향상된 성능이라는 추가 이점을 제공하여 판매자와 개발자를 만족시킵니다.

다음은 Magento 최초의 PWA 솔루션 ScandiPWA가 Magento 스택을 활용하여 멋진 PWA 경험을 제공하는 방법에 대한 세 가지 예입니다.

미들웨어 없음

ScandiPWA는 Magento 최초의 PWA 테마입니다. 즉, Magento 스토어 상단에 직접 설치할 수 있으므로 Magento 백엔드와 직접적인 관계를 갖는 이점이 있습니다. 모든 미들웨어가 기능을 다시 빌드해야 하고 추가 데이터 구조(개발, 사용자 정의)가 조정되어야 하는 추가 복잡성 계층을 추가하기 때문에 판매자가 많은 번거로움을 덜어줍니다.

다음은 예입니다. 별도의 PWA 매장으로 구축된 솔루션은 웹사이트의 데이터베이스와만 통신합니다. 이는 리디렉션 처리와 같은 일반적인 문제에 영향을 줍니다. Magento 코어 설치에 도달한 다음 백엔드에 지정된 대로 리디렉션되는 대신 별도의 상점은 사용자가 원하는 위치에 착륙할 수 있도록 하는 솔루션을 개발해야 합니다.

미들웨어는 Vue Storefront와 같은 보다 보편적인 PWA 솔루션에 대해 상당한 이점을 제공합니다. 하나의 강력한 솔루션을 여러 플랫폼에 연결할 수 있기 때문입니다. 말하다. Magento 우선 솔루션은 즉시 사용 가능한 Magento 기능을 활용하여 이를 우회하여 비즈니스 개발 비용을 절감합니다.

Magento에 대한 이해 및 시간 절약

Magento-first PWA 솔루션의 중요한 이점은 친숙함입니다. 개발자에게 친숙한 환경을 계속 사용하면 개발자와 개발자가 더 쉽게 채택하고 개발 프로세스를 간소화할 수 있습니다.

Magento는 세계에서 가장 발전된 전자 상거래 플랫폼 중 하나로 스스로를 입증했으며 플랫폼을 중심으로 성장한 커뮤니티가 이를 나타냅니다. 즉, 전 세계 곳곳에서 Magento 전문가를 찾을 수 있으며 PWA의 참신함에도 불구하고 완전히 새로운 환경에서 작업하는 것과 비교할 때 온보딩이 훨씬 더 원활해야 합니다. Magento의 도구는 개발자와 판매자 모두에게 잘 알려져 있으며 입증된 성공의 역사를 가지고 있습니다.

따라서 Magento-first PWA 솔루션을 선택하는 판매자는 비용 절감을 기대하고 현재 상황을 더 잘 알 수 있습니다.

쉽고 저렴한 마이그레이션

ScandiPWA는 바로 사용할 수 있는 Magento용 테마입니다. 모든 Magento 우선 솔루션은 구현과 관련하여 상당한 이점을 제공합니다. 프론트엔드를 처음부터 완전히 재작업하고 다시 만들 필요 없이 플러그 앤 플레이 Magento 솔루션을 사용하면 비즈니스를 위험에 빠뜨리지 않고 PWA의 이점을 활용할 수 있습니다.

확립된 대로 미들웨어를 추가하고 완전히 사용자 정의된 프론트 엔드를 갖는 것은 일반적으로 Magento-first 솔루션에 존재하지 않는 수준의 복잡성을 도입합니다. 여기에는 추가 오버헤드, 유지 관리 및 지원 비용이 수반됩니다.

결론

프로그레시브 웹 앱은 여기에 있습니다. 채택에 대한 신중한 전망에도 불구하고 전 세계의 상인들은 그럼에도 불구하고 진행 상황을 계속 주시하고 있으며, 자신에게 적합한 솔루션을 찾고 PWA 개척자들의 많은 성공을 재현하기 위해 노력하고 있습니다.

가능한 한 빨리 시장에 진출하려는 Magento 판매자에게는 Magento PWA 스튜디오를 사용하여 자체 솔루션을 개발하거나 Vue Storefront와 같은 플랫폼에 구애받지 않는 PWA 솔루션을 선택하거나 Magento-first를 사용하는 등 몇 가지 옵션이 있습니다. ScandiPWA와 같은 테마. 시작하는 가장 쉽고 비용 효율적인 방법은 후자입니다. 마젠토의 친숙함에서 너무 벗어나지 않으면서 모든 범위의 PWA 이점을 활용할 수 있기 때문입니다.

Viesturs Abelis는 Scandiweb의 콘텐츠 책임자이자 열정적인 ScandiPWA 전도사입니다. Viesturs는 항상 미래를 내다보고 모든 사람이 최신 디지털 개발에 액세스할 수 있도록 열심입니다.