Site icon Thumbsup

พบกรณีศึกษา 21 ตัวอย่างการออกแบบฟอร์มออนไลน์สุดเจ๋ง!

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

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

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

 

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

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

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

เครื่องมือปฏิทิน ก็เป็นหนึ่งในตัวช่วยที่ดี ช่องสี่เหลี่ยมใหญ่ๆ ช่วยลดการใส่ข้อมูลผิดพลาด

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

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

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

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

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

 

 

ดีไซน์ที่ดี เรียกผู้คนได้มากกว่า  การสร้างสรรค์ดีไซน์อย่างในรูปด้านล่าง สามารถดึงดูดลูกค้ามาให้ความร่วมมือได้มากกว่า

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

 

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

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

 


ไม่ต้องตกใจ หากเผลอกด Caps Lock ทิ้งไว้  เวบไซต์อย่าง Flickr สามารถเปลี่ยนตัวอักษรจากตัวใหญ่เป็นตัวเล็กให้ได้อัตโนมัติ

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

 

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


ดีไซน์แบบฟอร์มให้ดูน่าสนใจ  นี่เป็นตัวอย่างแบบฟอร์มที่จัดรูปแบบต่างจากฟอร์มอื่นทั่วไป ช่วยดึงดูดให้ผู้คนสนใจมากขึ้น

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


บริการ Live Chat ในขั้นตอนการชำระเงิน  House of Fraser มีบริการ Live Chat ช่วยอำนวยความสะดวกกับลูกค้า ในกรณีมีเรื่องสงสัยในขั้นตอนการสั่งซื้อ

 


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


ที่มา Econsultancy