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

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

บทความนี้ให้ข้อมูลอะไรบ้าง

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

เพราะเหตุใด UI การชำระเงินบนอุปกรณ์เคลื่อนที่จึงแตกต่างจากเดสก์ท็อป

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

สิ่งที่ทำให้อุปกรณ์เคลื่อนที่มีเอกลักษณ์มีดังนี้

คุณกำลังออกแบบสำหรับแคนวาสที่เล็กกว่า

หน้าจออุปกรณ์เคลื่อนที่ทั่วไปมีพื้นที่เพียงเศษเสี้ยวของเดสก์ท็อป เมื่อแป้นพิมพ์บนหน้าจอปรากฏขึ้น ซึ่งเกิดขึ้นในทันทีที่มีเริ่มกรอกแบบฟอร์ม พื้นที่เกือบครึ่งหนึ่งจะหายไป ในโหมดแนวนอน พื้นที่ก็จะลดลงไปอีก

มุมมองที่จำกัดนั้นหมายความว่าดังนี้

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

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

คุณกำลังออกแบบสำหรับนิ้วมือ ไม่ใช่ตัวชี้

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

ในทางปฏิบัติแล้ว หมายความว่า

• พื้นที่การแตะขนาดเล็กจะกลายเป็นอุปสรรค
  
• ช่องแบบฟอร์มเพิ่มเติมรู้สึกเหมือนเป็นอุปสรรค
  
• แก้ไขข้อผิดพลาดได้ยากขึ้น
  

ช่วงความสนใจของผู้ใช้จะสั้นลงและเปราะบางขึ้น

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

อุปกรณ์เคลื่อนที่มีความสามารถที่เดสก์ท็อปไม่มี

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

• การกรอกอัตโนมัติและความจำของเบราว์เซอร์อุปกรณ์เคลื่อนที่สำหรับรายละเอียดการจัดส่งและการเรียกเก็บเงิน
  
• Apple Pay, Google Pay และกระเป๋าเงินดิจิทัลอื่นๆ สำหรับการชำระเงินอย่างรวดเร็ว
  
• ระบบระบุพิกัดทั่วโลก (GPS) สำหรับคำแนะนำเกี่ยวกับที่อยู่หรือการประมาณการการจัดส่ง
  
• การสแกนบัตรผ่านกล้องเพื่อข้ามการป้อนข้อมูลด้วยตนเอง
  

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

สิ่งใดสำคัญที่สุดสำหรับการออกแบบการชำระเงินบนอุปกรณ์เคลื่อนที่ที่ดี

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

นี่คือหลักการที่จะช่วยให้คุณทำได้อย่างถูกต้องเหมาะสม

ออกแบบให้เน้นจุดสำคัญและเรียบง่าย

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

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

ทำให้แตะ เลื่อน และสแกนได้สะดวก

ออกแบบตามวิธีที่ผู้คนใช้โทรศัพท์จริงๆ

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

ลดการพิมพ์ในทุกที่ที่คุณทำได้

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

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

ทำให้ชัดเจน ถึงแม้เมื่อหน้าจอจะเล็ก

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

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

การออกแบบเพื่อความรวดเร็ว

ความเร็วเป็นสิ่งสำคัญ การชำระเงินที่ช้าหรือหน่วงอาจทำให้ผู้ใช้ละทิ้งขั้นตอนการชำระเงินได้

• ปรับเวลาในการโหลดและหลีกเลี่ยงการเปลี่ยนเส้นทางหรือการโหลดซ้ำที่ไม่จำเป็น
  
• แสดงตัวบ่งชี้ความก้าวเมื่อผู้ใช้แตะ "ถัดไป" หรือ "ชำระเงิน" เพื่อให้พวกเขาทราบว่ากำลังดำเนินการต่อไปในขั้นตอน
  
• ใช้ฟีเจอร์ต่างๆ เช่น Apple Pay หรือ Google Pay เพื่อข้ามการกรอกฟอร์ม
  
• หากเป็นไปได้ ให้โหลดข้อมูลที่มีอยู่หรือแคชการเลือกของผู้ใช้ไว้ล่วงหน้าเพื่อลดเวลารอการตอบสนอง
  

สร้างและรักษาความเชื่อใจ

การชำระเงินบนอุปกรณ์เคลื่อนที่เกี่ยวข้องกับการที่ผู้ใช้กรอกข้อมูลที่ละเอียดอ่อนที่สุด ซึ่งผู้ใช้ต้องรู้สึกปลอดภัยในทุกขั้นตอน

• แสดงสัญญาณความปลอดภัยที่คุ้นเคย (เช่น ไอคอนล็อก, เครื่องหมาย Secure Sockets Layer [SSL] และ Transport Layer Security [TLS], ข้อความรับรองความปลอดภัย)
  
• รักษาการออกแบบให้สะอาดและสอดคล้องกัน
  
• อย่าทำให้ผู้ใช้ประหลาดใจกับค่าใช้จ่ายที่แอบแฝง แสดงยอดรวม รวมถึงภาษีและค่าธรรมเนียมต่างๆ ตั้งแต่ต้น
  

จัดการข้อผิดพลาดได้อย่างเหมาะสม

อาจมีการพิมพ์ผิดเกิดขึ้นได้ วิธีที่ UI ของคุณจัดการกับข้อผิดพลาดเหล่านี้เป็นสิ่งสำคัญ

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

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

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

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

ออกแบบแบบฟอร์มที่ไม่ขัดกับการแสดงผล

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

ตัดสินใจเกี่ยวกับข้อมูลที่เหมาะกับอุปกรณ์เคลื่อนที่

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

จัดรูปแบบข้อมูลเพื่อลดข้อผิดพลาดของผู้ใช้

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

ทำให้ปุ่มเด่นชัด ใหญ่ และแตะง่าย

การดำเนินการหลัก (เช่น "ดำเนินการต่อ", "สั่งซื้อ", "ชำระเงิน") ควรโดดเด่นเสมอ ใช้ปุ่มแบบเต็มความกว้างพร้อมเว้นระยะที่กว้างขวางสำหรับการดำเนินการเหล่านี้ และถ้าเป็นไปได้ ให้คงปุ่มเหล่านี้ไว้ที่ด้านล่างของหน้าจอเมื่อเลื่อน วางปุ่มในตำแหน่งที่นิ้วโป้งจะไปถึงได้ตามธรรมชาติ นั่นคือไปทางครึ่งล่างของหน้าจอ ไม่ใช่ด้านบน ทำให้การดำเนินการเฉพาะเจาะจง เช่น "ชำระเงิน $42.98" มักจะได้ผลดีกว่าคำที่ไม่ชัดเจนอย่าง "ดำเนินการต่อ"

ตรวจสอบให้แน่ใจว่าปิดการใช้งานปุ่มดำเนินการเหล่านี้จนกว่าช่องที่จำเป็นจะเสร็จสมบูรณ์ และให้ข้อเสนอแนะเสมอ (เช่น สถานะการโหลด) เมื่อมีการแตะปุ่ม

ใช้วิธีการชำระเงินที่เหมาะกับอุปกรณ์เคลื่อนที่เมื่อเป็นไปได้

การชำระเงินผ่านอุปกรณ์เคลื่อนที่ที่ดีที่สุดคือการที่ไม่ขอให้ผู้ใช้กรอกแบบฟอร์มเลย เมื่อเป็นไปได้ ให้รวมวิธีการต่างๆ เช่น Apple Pay, Google Pay หรือกระเป๋าเงินดิจิทัลอื่นๆ ที่ดึงข้อมูลการเรียกเก็บเงิน การจัดส่ง และข้อมูลบัตรที่บันทึกไว้ และให้ลูกค้าสามารถทำการซื้อให้เสร็จสมบูรณ์ได้ด้วยการแตะ Express Checkout Element ของ Stripe สามารถแสดงตัวเลือกเหล่านี้ได้โดยอัตโนมัติ

ทำให้เข้าถึงการช่วยเหลือได้ง่ายๆ

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

คุณควรหลีกเลี่ยงปัญหาใดบ้างในการชำระเงินบนอุปกรณ์เคลื่อนที่

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

บังคับให้สร้างบัญชีผู้ใช้

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

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

การชำระเงินที่ยาวเกินไปหรือมีหลายส่วนเกินไป

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

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

พื้นที่แตะขนาดเล็กและเลย์เอาต์ที่แน่นเกินไป

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

• ตรวจสอบให้แน่ใจว่าพื้นที่การแตะทั้งหมดมีขนาดอย่างน้อย 44px คูณ 44px
  
• เพิ่มระยะห่างที่กว้างขวางรอบๆ องค์ประกอบที่โต้ตอบได้
  
• หลีกเลี่ยงไม่ให้ช่องแบบฟอร์มหรือปุ่มที่ต้องการความแม่นยำอยู่ข้างกัน
  

ข้อความแสดงข้อผิดพลาดที่ซ่อนไว้หรือไม่ชัดเจน

ข้อผิดพลาดที่ไม่สามารถมองเห็นได้หรือไม่สมเหตุสมผลอาจนำไปสู่การละทิ้งรถเข็น หากการแก้ไขข้อผิดพลาดใช้เวลานานกว่า 2-3 วินาที ผู้ใช้อาจละทิ้งกระบวนการไป

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

ไม่รองรับการชำระเงินที่รวดเร็วบนอุปกรณ์เคลื่อนที่

การพิมพ์รายละเอียดของบัตรบนโทรศัพท์นั้นล่าช้า หากการชำระเงินของคุณไม่เสนอบริการ Apple Pay, Google Pay หรือทางเลือกในแตะเดียวอื่นๆ คุณกำลังพลาดโอกาสสำคัญในการลดอัตราการออกจากขั้นตอนการชำระเงิน

• เปิดใช้งานวิธีการชำระเงินแบบด่วนเมื่อระบบรองรับ Express Checkout Element ของ Stripe ทำให้ขั้นตอนนี้เป็นอัตโนมัติบนอุปกรณ์ที่เข้ากันได้
  
• รองรับการกรอกอัตโนมัติและบัตรที่บันทึกไว้ ซึ่งเป็นสิ่งที่ลดการป้อนข้อมูลด้วยตนเอง
  

ไม่มีการยืนยันหรือข้อเสนอแนะหลังจากที่ดำเนินการแล้ว

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

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

พฤติกรรมที่ไม่ดีในสภาพแวดล้อมเฉพาะอุปกรณ์เคลื่อนที่

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

สมมติว่าการชำระเงินของคุณจะไม่ได้ทำงานบน Chrome หรือ Safari เสมอไป และให้ออกแบบให้รองรับบนเบราว์เซอร์อื่นๆ ด้วย

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