Progressive Web Apps (PWA): กรณีศึกษา 3 อันดับแรก

ลองนึกภาพว่าคุณเพิ่งเปิดตัวสตาร์ทอัพและเว็บไซต์ของคุณดูดีมาก แต่คุณไม่มีงบประมาณเพียงพอที่จะพัฒนาแอปบนอุปกรณ์เคลื่อนที่ ซึ่งอาจมีความสำคัญต่อกลยุทธ์ทางธุรกิจของคุณ อย่างไรก็ตามมันมีราคาแพงมากและมีความเสี่ยงเล็กน้อย คุณจะต้องใช้เวลามากมายในการสร้างแอพที่มาพร้อมเครื่อง แต่ไม่มีใครรู้จักแบรนด์ของคุณดีพอ ผู้คนจะเชื่อถือแอปพลิเคชันของคุณมากพอที่จะดาวน์โหลดจาก App Store หรือ Google Play Store หรือไม่

ยิ่งไปกว่านั้น – ลูกค้า/ผู้อ่านของคุณมีความมุ่งมั่นมากพอที่จะทำขั้นตอนเพิ่มเติม เช่น การปิดเว็บไซต์ของคุณ เปิด Google Play หรือ App Store แล้วอดทนรอจนกว่าแอปจะติดตั้งสำเร็จหรือไม่

โปรดจำไว้ว่าผู้คนมีความต้องการมากขึ้นในทุกวันนี้ กล่าวอีกนัยหนึ่ง พวกเขายัง ใจร้อน มาก – พวกเขาคาดหวัง วิธีแก้ปัญหาที่รวดเร็ว การดาวน์โหลดแอปดังกล่าวจากร้านค้าภายนอกดูเหมือนจะไม่ดำเนินการอย่างรวดเร็ว และผู้ใช้ทุกคนเข้าถึงแอปที่มาพร้อมเครื่องไม่ได้ จากมุมมองของประสบการณ์ผู้ใช้ มีอุปสรรคมากมายสำหรับลูกค้าก่อนที่เขาจะบรรลุเป้าหมาย (และของคุณ)

และอีกอย่าง – คุณแน่ใจหรือว่าลูกค้าของคุณจะมีพื้นที่เก็บข้อมูลภายในเพียงพอสำหรับการดาวน์โหลดแอปของคุณ

ดังนั้นคุณจะต้องลงทุนเงินเป็นจำนวนมากในการสร้างแอปบนอุปกรณ์เคลื่อนที่ (ทั้งสำหรับ IOS และ Android) และคุณไม่สามารถแน่ใจได้ว่าผู้คนจะใช้แอปนี้จริงๆ อ๊ะ… และอย่าลืมงบประมาณการตลาดจำนวนมหาศาลที่คุณจำเป็นต้องใช้ในการโฆษณาและการส่งเสริมการขาย!

แต่เดี๋ยวก่อนอย่าตกใจโชคดีที่คุณอยู่ในปี 2019 เมื่อ   Progressive Web Apps กำลังกลายเป็นวิธีแก้ปัญหาทั่วไปเมื่อพูดถึงการสร้างแอพมือถือ!

คุณเคยได้ยินเกี่ยวกับ Progressive Web Apps หรือไม่? ถ้าไม่อย่างนั้น ตอนนี้เป็นโอกาสของคุณที่จะไล่ตามเทรนด์เทคโนโลยีล่าสุด ไม่อย่างนั้นคุณจะถูกทิ้งไว้ข้างหลัง! เราได้เขียนบทความที่ครอบคลุมโดยอธิบาย ว่ามันคืออะไรและทำไมจึงควรเลือกตัวเลือกนี้

วันนี้เราขอมอบแรงบันดาลใจและแนะนำเรื่องราวความสำเร็จของแบรนด์ที่สร้าง Progressive Web Apps ไว้แล้ว

TRIVAGO

Trivago มีชื่อเสียงในด้านเครื่องมือค้นหาโรงแรมที่มีให้บริการใน 33 ภาษา จากข้อมูลของโรงแรม รูปภาพ การให้คะแนน บทวิจารณ์ ตัวกรอง และคุณสมบัติอื่นๆ ของโรงแรม Trivago ช่วยให้ผู้ใช้ของตนพบข้อเสนอที่ดีที่สุด

ปัญหา

ปัญหาคือ Trivago พบว่าผู้ใช้อุปกรณ์พกพาเพิ่มขึ้นอย่างมากในช่วงไม่กี่ปีที่ผ่านมา แบรนด์ตระหนักดีว่าประสบการณ์การใช้งานอุปกรณ์เคลื่อนที่มีความสำคัญต่อลูกค้ามากขึ้นเรื่อยๆ

อย่างไรก็ตาม การสร้างโซลูชันสำหรับอุปกรณ์พกพานั้นไม่ใช่เรื่องง่าย และนั่นหมายถึงการตัดสินใจเลือกที่ยาก โดยเฉพาะอย่างยิ่ง บริษัทไม่แน่ใจว่าผู้คนจะยอมรับค่าใช้จ่ายในการดาวน์โหลดแอปบนอุปกรณ์เคลื่อนที่หรือไม่ เพียงเพื่อตรวจสอบว่าเหมาะสมกับความคาดหวังของพวกเขาหรือไม่ พวกเขายังสังเกตเห็นว่าหลายคน มีปัญหากับการเชื่อมต่อมือถือที่มีคุณภาพ ด้วยเหตุผลเหล่านี้ Trivago จึงมองหาโอกาสที่แตกต่างจากแอปที่มาพร้อมเครื่อง

 การอ่านที่แนะนำ: Progressive Web Apps กับ Native Apps: แบบไหนเหมาะกับคุณมากกว่ากัน?

วิธีการแก้

ในที่สุด พวกเขาค้นพบ Progressive Web Apps ซึ่งดูเหมือนว่าคุณสมบัติจะสมบูรณ์แบบสำหรับความต้องการของพวกเขา ในขณะนั้น พวกเขากำลังมองหาโซลูชันที่จะให้การ แจ้งเตือน แบบ พุ ช โหมดออฟไลน์ และ ทางลัดบนหน้าจอหลัก และปัจจัยที่สำคัญที่สุดสำหรับ Trivago คือ การเข้าถึง แอพนี้ ผ่านเบราว์เซอร์มือถือมาตรฐาน

โซลูชัน PWA นี้ช่วยให้พวกเขาสร้างแอปโดยไม่ต้องเกี่ยวข้องกับทีมนักพัฒนาซอฟต์แวร์รายใหญ่ พวกเขามุ่งเน้นไปที่คุณสมบัติที่สำคัญที่สุดในตอนเริ่มต้น เช่น การแจ้งเตือนแบบพุช การเข้าถึงแบบออฟไลน์ และ ความเป็นไปได้ในการเพิ่มแอปไปยังหน้าจอหลัก แน่นอนว่ามีปัญหาในตอนแรก พวกเขากล่าวว่าหนึ่งในความท้าทายที่ใหญ่ที่สุดคือการสร้างส่วนต่อประสานผู้ใช้ที่ใช้งานง่ายเพราะการออกแบบรูปลักษณ์บนมือถือนั้นแตกต่างจากเว็บไซต์มาตรฐานมาก ลอร่า โอเดส ผู้ออกแบบ กปภ. กล่าวไว้ว่า

“บนมือถือ คุณมีปัญหาเพิ่มเติมในการสร้าง UI ที่ไม่เชื่อเรื่องพระเจ้าและไม่สับสน” และ “PWA ส่วนใหญ่เป็นพื้นที่ที่ไม่ได้จดที่แผนที่ในการออกแบบ และเป็นโอกาสที่แท้จริงสำหรับนักแก้ปัญหาเชิงสร้างสรรค์ที่จะขยายตัวเองเพื่อกำหนดมาตรฐานใหม่”

ผลลัพธ์

• เว็บไซต์มือถือ Trivago ให้บริการใน 33 ภาษา ใน 55 ประเทศ
• ผู้คนมากกว่า 500,000 คน เพิ่มทางลัด Trivago ลงในหน้าจอหลัก และการมีส่วนร่วมของพวกเขาเพิ่มขึ้น 150%
• เมื่อเทียบกับเว็บไซต์บนอุปกรณ์เคลื่อนที่รุ่นก่อนๆ Progressive Web App ดึงดูดผู้ใช้ได้มากกว่ามาก ก่อน กปภ. บันทึกการเข้าชมซ้ำเพียง 0,8% ขณะนี้จำนวนนี้เพิ่มขึ้นเป็น 2% โดยเฉลี่ย
• การแจ้งเตือนแบบพุชกลายเป็นวิธีการสื่อสารที่สมบูรณ์แบบ – ช่วยเพิ่ม Conversion – จำนวนคลิกใน PWA บนข้อเสนอโรงแรมเพิ่มขึ้น 97%

 การอ่านที่แนะนำ: 7 Best Progressive Web Apps ในอุตสาหกรรมการท่องเที่ยว

PININTEREST

Pinterest เป็นเครือข่ายสังคมออนไลน์ที่อนุญาตให้ผู้ใช้แชร์ภาพและค้นพบความสนใจใหม่ๆ โดยการโพสต์ (เรียกว่า 'การปักหมุด' บน Pinterest ) รูปภาพหรือวิดีโอไปยังกระดานของตนเองหรือของผู้อื่น (เช่น คอลเลกชันของ 'หมุด' ซึ่งมักใช้ร่วมกัน ธีม) และเรียกดูสิ่งที่ผู้ใช้รายอื่นปักหมุดไว้

ปัญหา

หลังจากวิเคราะห์การใช้งานสำหรับผู้ใช้เว็บบนอุปกรณ์เคลื่อนที่ที่ไม่ผ่านการตรวจสอบสิทธิ์ พวกเขาตระหนักว่าประสบการณ์การใช้เว็บแบบเก่าที่ช้าของพวกเขาสามารถแปลงผู้ใช้เพียง 1% เป็นการลงชื่อสมัครใช้ การเข้าสู่ระบบ หรือการติดตั้งแอปที่มาพร้อมเครื่อง โอกาสในการปรับปรุงอัตราการพูดคุยนี้มีมาก ทำให้พวกเขาลงทุนในการประปาส่วนภูมิภาค

Pinterest PWA เริ่มต้นขึ้นเพราะพวกเขามุ่งเน้นไปที่การเติบโตในระดับสากล ซึ่งนำพวกเขาไปสู่เว็บบนมือถือ

วิธีการแก้

กว่า 3 เดือน Pinterest ได้สร้างประสบการณ์เว็บบนมือถือขึ้นใหม่โดยใช้ React, Redux และ webpack การเขียนเว็บบนอุปกรณ์เคลื่อนที่ของพวกเขาใหม่นำไปสู่การปรับปรุงเชิงบวกหลายประการในเมตริกธุรกิจหลัก

ผลลัพธ์

การเขียนเว็บบนอุปกรณ์เคลื่อนที่ใหม่ทำให้ประสิทธิภาพดีขึ้นหลายประการ

เวลาที่ใช้เพิ่มขึ้น 40% เมื่อเทียบกับประสบการณ์เว็บบนอุปกรณ์เคลื่อนที่แบบเก่า รายได้จากโฆษณาที่ผู้ใช้สร้างขึ้นเพิ่มขึ้น 44% และการมีส่วนร่วมหลักเพิ่มขึ้น 60% :

ประสบการณ์การใช้งานเว็บบนมือถือแบบเก่าของ Pinterest นั้นยากลำบาก — ซึ่งรวมถึงกลุ่ม JavaScript ที่เน้น CPU จำนวนมาก ซึ่งช่วยผลักดันให้หน้าพินสามารถโหลดและโต้ตอบได้เร็วเพียงใด

ประสบการณ์เว็บบนมือถือแบบใหม่ของพวกเขาคือการปรับปรุงอย่างมาก

พวกเขาไม่เพียงแต่แยกส่วนและโกนหลายร้อย KB จาก JavaScript ของพวกเขาเท่านั้น แต่ยังลดขนาดของบันเดิลหลักจาก 650 KB เหลือ 150 KB แต่ยังปรับปรุงเมตริกประสิทธิภาพหลักอีกด้วย First Meaningful Paint ลดลงจาก 4.2s เป็น 1.8s และ Time To Interactive ลดลงจาก 23s เป็น 5.6s

แม้ว่า Pinterest จะจำหน่ายแอป iOS และ Android แต่ก็สามารถมอบประสบการณ์ฟีดหลักแบบเดียวกันที่แอปเหล่านี้ทำบนเว็บด้วยค่าใช้จ่ายในการดาวน์โหลดล่วงหน้าเพียงเศษเสี้ยว — ย่อเพียง 150KB และ gzipped สิ่งนี้ตรงกันข้ามกับ 9.6MB ที่จำเป็นในการมอบประสบการณ์นี้สำหรับ Android และ 56MB สำหรับ iOS

ทวิตเตอร์

ดังที่คุณทราบแล้ว Twitter เป็นแพลตฟอร์มโซเชียลมีเดียที่ผู้คนโพสต์ข้อความสั้น ๆ ที่เรียกว่าทวีต ก่อตั้งขึ้นในเดือนมีนาคม 2549 ปัจจุบันมีผู้ใช้งานมากกว่า 335 ล้านคน (กรกฎาคม 2018)

ปัญหา

Twitter สังเกตเห็นว่าผู้ใช้ต้องเอาชนะอุปสรรคมากมายในขณะที่ใช้เว็บไซต์บนมือถือ

บางคน ใช้เครือข่ายมือถือที่ช้า และมี พื้นที่เก็บข้อมูลอุปกรณ์มือถือ น้อย ด้วยเหตุนี้ ผู้เยี่ยมชมจึงไม่เต็มใจที่จะใช้เวลาอยู่บนเว็บไซต์ของ Twitter หรือมีส่วนร่วมในการโพสต์และแสดงความคิดเห็นเพิ่มเติม Twitter ต้องการหาทางเลือกอื่นที่น่าสนใจสำหรับผู้ที่ไม่ได้ใช้แอพที่มาพร้อมเครื่องหรือไม่มีพื้นที่เพียงพอสำหรับการดาวน์โหลด

วิธีการแก้

Twitter ตัดสินใจสร้าง Progressive Web App เพราะดูเหมือนว่าจะเป็นส่วนผสมที่ดีที่สุดของเว็บไซต์สมัยใหม่และคุณลักษณะดั้งเดิม การโหลดทันที ใช้ข้อมูลน้อยลง และเข้าถึงได้มากเป็นคุณสมบัติที่ Twitter กำลังมองหา

ผลลัพธ์

ผลลัพธ์ออกมาน่าประทับใจมาก – ตัวเลขบอกได้ด้วยตัวเอง:

• อัตราตีกลับลดลง 20%
• จำนวนหน้าเพิ่มขึ้น 65% ต่อเซสชัน
• ส่งทวีตเพิ่มขึ้น 75%

เช่นเดียวกับเรื่องราวความสำเร็จก่อนหน้านี้ การแจ้งเตือน " เพิ่มในหน้าจอหลัก " และการแจ้งเตือน แบบพุ ชช่วยเพิ่มการมีส่วนร่วมของผู้ใช้อย่าง มาก ตามที่มีรายงานในกรณีศึกษานี้ Twitter สังเกตว่าผู้ใช้รายวันที่ไม่ซ้ำ 250,000 ราย เรียกใช้ Twitter Lite จากหน้าจอหลัก 4 ครั้งต่อวันโดยเฉลี่ย ยิ่งไปกว่านั้น พวกเขากำลังส่งการ แจ้งเตือน แบบพุชมากกว่า 10 ล้าน ครั้งต่อวัน

ตามเจตนาของ Twitter PWA ใช้ พื้นที่น้อยกว่ามาก (เพียง 600 KB) กว่าแอป Android ดั้งเดิม (23,5 MB) ดังนั้นจึงมีความเป็นไปได้มากขึ้นที่ผู้คนจะมีพื้นที่เพียงพอในที่เก็บข้อมูลภายในเพื่อบันทึก

ยิ่งไปกว่านั้น Twitter ได้เพิ่ม โหมดประหยัดข้อมูล ซึ่งช่วยให้ผู้ใช้สามารถควบคุมปริมาณข้อมูลมือถือที่ใช้ได้ ด้วยตัวเลือกนี้ คุณสามารถเลือกรูปภาพหรือวิดีโอที่คุณต้องการโหลดได้อย่างเต็มที่ และอาจเป็นเพียงตัวอย่าง

 การอ่านที่แนะนำ: PWA SEO: Progressive Web Apps (PWAs) มีประโยชน์ต่อ SEO หรือไม่ (พร้อมสถิติและตัวอย่าง)

โอบกอดอนาคตของเว็บไซต์

กปภ. คืออนาคตของแอปพลิเคชั่นมือถือ มีความเป็นไปได้ที่พวกเขาจะแทนที่แอปพลิเคชันดั้งเดิมด้วยเวลา กลายเป็นส่วนผสมที่ลงตัวระหว่างแอพและเว็บไซต์ที่มาพร้อมเครื่อง ในโลกที่ความเร็วในการนำเทคโนโลยีใหม่มาใช้เป็นความได้เปรียบในการแข่งขัน ธุรกิจที่ยอมรับ PWA ก่อนหน้านี้สามารถขับเคลื่อนรายได้ได้อย่างมาก เพิ่มการมีส่วนร่วมของผู้ใช้ในขณะที่นำหน้าคู่แข่ง

ในอดีต Apple มีข้อ จำกัด บางประการสำหรับ Progressive Web Applications อย่างไรก็ตามขณะนี้พวกเขาสนับสนุน PWA มากขึ้นเรื่อย ๆ สำหรับผู้ค้าออนไลน์ที่กำลังมองหา PWA ที่สมบูรณ์แบบสำหรับเว็บไซต์ Magento eCommerce ที่ SimiCart เราขอเสนอแพ็คเกจที่สมบูรณ์สำหรับคุณและร้านค้าของคุณ