ออกแบบโฮมเพจที่ดีขึ้นด้วย StoryBrand Framework

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

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

เป้าหมายของโฮมเพจคืออะไร?

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

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

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

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

ข้อผิดพลาดทั่วไปสามประการเมื่อออกแบบโฮมเพจ

ธุรกิจต่างๆ—และโดยนักออกแบบส่วนขยาย—พบข้อผิดพลาดหลักสามประการเมื่อสร้างโฮมเพจ:

1. ไม่เน้นเรื่องสำคัญ พวกเขาบอกทุกคนเกี่ยวกับคุณลักษณะของบริการหรือผลิตภัณฑ์ของตน คนไม่สนใจเรื่องนี้ พวกเขาต้องการรู้ว่าธุรกิจจะแก้ปัญหาและปรับปรุงชีวิตของพวกเขา
2. ธุรกิจไม่สื่อสารข้อความของตนอย่างชัดเจน ตามที่ Tony Haile แห่ง Chartbeat กล่าวว่า เว็บไซต์มีเวลาไม่ถึง 15 วินาทีในการดึงดูดความสนใจของผู้เข้าชม
3. พวกเขามีผลิตภัณฑ์ที่ไม่ดีซึ่งไม่สามารถแก้ปัญหาของใครได้ นักออกแบบสามารถทำธุรกิจได้ไม่มากหากเป็นกรณีนี้

กรอบงาน StoryBrand คืออะไร?

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

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

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

กรอบงาน StoryBrand เป็นสูตรการเล่าเรื่องที่สร้างขึ้นโดย Donald Miller เพื่อช่วยให้ธุรกิจสื่อสารข้อความที่ทรงพลังที่สุดได้ง่ายและชัดเจน ในหนังสือของเขา Building a Story Brand ของเขา Miller กล่าวว่า “ลูกค้าของคุณควรเป็นฮีโร่ของเรื่องราว ไม่ใช่แบรนด์ของคุณ นี่คือความลับที่ทุกธุรกิจที่ประสบความสำเร็จอย่างน่าอัศจรรย์เข้าใจ”

วิธีใช้ StoryBrand กับลูกค้า

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

มิลเลอร์เปรียบเทียบการสร้าง StoryBrand กับการเขียนเรื่องราวสำหรับบทภาพยนตร์ เขาแบ่งมันออกเป็นเจ็ดจุดวางแผน

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

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

1. ตัวละคร : ลูกค้าคือฮีโร่ของเรื่องราวเสมอ ไม่ใช่แบรนด์ นักออกแบบ UX มีหน้าที่ค้นหาว่าลูกค้าต้องการอะไรจากแบรนด์ มักจะผ่านการวิจัย UX และการทดสอบผู้ใช้ พวกเขาต้องให้ความสำคัญกับความปรารถนาที่ขับเคลื่อนผู้คน เช่น การอนุรักษ์ทรัพยากรทางการเงิน การประหยัดเวลา การสร้างเครือข่ายสังคม หรือการได้รับสถานะ
2. มีปัญหา : วายร้ายใน StoryBrand arc เป็นปัญหาของตัวละคร เป็นประโยชน์ในการกำหนดปัญหานั้นและเข้าใจว่าผลิตภัณฑ์ของ บริษัท เป็นเหมือนอาวุธที่ลูกค้าสามารถใช้เพื่อเอาชนะได้ บริษัทมักจะเน้นการแก้ปัญหาภายนอก แต่ลูกค้าซื้อวิธีแก้ไขปัญหา ภายใน ผู้คนมีความขัดแย้งสามระดับ:
   - ภายนอก (ธุรกิจส่วนใหญ่พยายามแก้ปัญหาภายนอก)
   - ภายใน (เช่น ความหงุดหงิด ข่มขู่ ความไม่มั่นคง)
   - ปรัชญา (ทำไมเรื่องนี้ถึงมีความสำคัญ?)
3. และตรงตามมัคคุเทศก์ : มัคคุเทศก์คือธุรกิจหรือแบรนด์ ลูกค้าต้องการคนดูแลปัญหา การรับรู้ถึงแบรนด์ของพวกเขาจะมีความสำคัญต่อความไว้วางใจของพวกเขา ต้องสื่อสารสองสิ่ง:
   - Empathy (แสดงความเข้าใจความเจ็บปวดที่ลูกค้าอาจรู้สึก)
   - อำนาจ (จะทำให้ลูกค้ามั่นใจว่าแบรนด์สามารถช่วยพวกเขาได้)
4. ใครเป็นคนวางแผนให้พวกเขา : ธุรกิจจะแสดงให้ลูกค้าเห็นว่าต้องทำอะไรต่อไป ลูกค้ายังไม่แน่ใจว่าจะซื้อหรือไม่ จนกว่าจะเห็นแผนปฏิบัติการง่ายๆ นักออกแบบ UX สามารถระบุขั้นตอนถัดไปที่ชัดเจนสำหรับลูกค้า พวกเขายังสามารถบรรเทาความวิตกกังวลที่ลูกค้าอาจมีโดยการจัดการกับข้อกังวลที่เกี่ยวข้องกับผลิตภัณฑ์หรือบริการ
5. และเรียกร้องให้ดำเนินการ : คำกระตุ้นการตัดสินใจที่มีประสิทธิภาพช่วยอำนวยความสะดวกในการซื้อหรือสมัครใช้งาน
6. ที่ช่วยให้พวกเขาหลีกเลี่ยงความล้มเหลว : อะไรคือความเสี่ยงสำหรับลูกค้า? พวกเขาจะเสียอะไรหากไม่ซื้อจากแบรนด์นี้?
7. และจบลงด้วยความสำเร็จ : บอกลูกค้าว่าการกระทำที่เฉพาะเจาะจงนี้สามารถเปลี่ยนแปลงชีวิตพวกเขาได้อย่างไร แสดงให้พวกเขาเห็นว่าชีวิตของพวกเขาจะเป็นอย่างไรหลังจากที่ซื้อผลิตภัณฑ์และความละเอียดนั้นจะทำให้พวกเขารู้สึกอย่างไร สามวิธีที่นักเล่าเรื่องจบเรื่องราวได้ชัดเจนคือการให้ตัวละครสามารถ:
   - ชนะอำนาจหรือตำแหน่ง
   - หาใครสักคนหรือสิ่งที่ทำให้พวกเขาสมบูรณ์
   - สัมผัสประสบการณ์การตระหนักรู้ในตนเองบางรูปแบบที่ทำให้พวกเขาสมบูรณ์

วิธีใช้ StoryBrand Framework ในโฮมเพจ

หน้าแรกไม่ควรเกี่ยวกับธุรกิจ ควรเกี่ยวกับลูกค้าที่มีศักยภาพ

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

แม้ว่ามันอาจจะฟังดูเรียบง่าย แต่ก็มีองค์ประกอบสำคัญเพียงห้าประการที่ต้องคำนึงถึงเมื่อออกแบบหน้าแรก

หัวข้อข่าว

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

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

สร้างความไว้วางใจโดยแสดงอำนาจ

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

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

คำกระตุ้นการตัดสินใจ

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

คำกระตุ้นการตัดสินใจมีสองประเภท:

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

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

รูปภาพที่น่าดึงดูด

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

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

ข้อความสั้น

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

นักออกแบบ UX ควรช่วยลูกค้าแบ่งปันเรื่องราวของพวกเขาด้วยวิธีที่ง่ายที่สุด

หน้าแรกที่ประสบความสำเร็จตอบคำถามสำคัญ

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

• พวกเขาทำอะไร?
• พวกเขาจะช่วยฉันได้อย่างไร
• ฉันต้องทำอย่างไรเพื่อซื้อหรือมีส่วนร่วม?

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

แจ้งให้เราทราบสิ่งที่คุณคิด! โปรดแสดงความคิดเห็น ความคิดเห็น และข้อเสนอแนะของคุณด้านล่าง

• • •

อ่านเพิ่มเติมเกี่ยวกับบล็อก Toptal Design:

• เทรนด์ทั้งหมดคุ้มค่าหรือไม่ 5 อันดับแรก ข้อผิดพลาด UX ที่พบบ่อยที่สุดที่นักออกแบบเว็บไซต์ทำ
• วิธีการออกแบบหน้า Landing Page ที่มีประสิทธิภาพ
• สร้างขึ้นเพื่อแปลง – แนวทางปฏิบัติที่ดีที่สุดสำหรับการออกแบบหน้า Landing Page
• สุดยอดคู่มือการออกแบบเว็บไซต์อีคอมเมิร์ซ
• คู่มือที่ครอบคลุมสำหรับสถาปัตยกรรมสารสนเทศ