คำถาม & คำตอบเกี่ยวกับการออกแบบหน้า Landing Page กับนักออกแบบภาพอาวุโส Freddierick Mesias
เผยแพร่แล้ว: 2017-07-05ที่ Instapage เรายึดมั่นในความคาดหวังสูงสุด: ของคุณ เราได้ยินจากนักการตลาดจำนวนมากว่าแพลตฟอร์มของเราใช้งานง่ายและช่วยให้แคมเปญของพวกเขาได้รับอัตรา Conversion ที่สูงขึ้น เรารู้ว่าโดยเฉพาะอย่างยิ่งนักออกแบบใช้เครื่องมือสร้างของเราเนื่องจากคุณลักษณะเฉพาะบางอย่างที่เราได้เผยแพร่ในช่วงไม่กี่ปีที่ผ่านมา
ทีมงานของเราได้รับคำติชมจากนักออกแบบอย่างต่อเนื่องในการทดสอบการใช้งาน การสัมภาษณ์ที่ผ่านการกลั่นกรอง และคะแนน NPS เราให้ความสำคัญกับความคิดเห็นนั้นอย่างจริงจังเพื่อสร้างแพลตฟอร์มที่ไม่เพียงตอบสนองความต้องการในปัจจุบันของนักออกแบบเท่านั้น แต่ยังรวมถึงความต้องการในอนาคตด้วย
ฉันนั่งลงร่วมกับนักออกแบบภาพอาวุโส Freddierick Mesias เพื่อรับประสบการณ์เกี่ยวกับหน้า Landing Page หลังคลิกและแพลตฟอร์ม Instapage
BW: พื้นหลังการออกแบบของคุณและบทบาทของคุณใน Instapage คืออะไร?
FM: ประสบการณ์การออกแบบของฉันมีตั้งแต่การออกแบบเว็บ การสร้างแบรนด์ และการออกแบบส่วนต่อประสานผู้ใช้ เครื่องมือออกแบบหลักที่ฉันใช้คือ Sketch (เพื่อสร้างแบบจำลองที่มีความเที่ยงตรงสูง), Adobe Photoshop และ Illustrator (เพื่อสร้างแอสเซทภาพหน้า Landing Page หลังคลิก เช่น ไอคอน การแก้ไขรูปภาพ ภาพประกอบ ฯลฯ)
ที่ Instapage ทีมออกแบบของเราได้รับการเสริมด้วยชุดทักษะที่หลากหลาย: การออกแบบเว็บ ภาพประกอบ และการสื่อสารแบรนด์ วัตถุประสงค์หลักของเราคือการสื่อสารอย่างมีประสิทธิภาพกับผู้ชมของเราผ่านภาพ บทบาทของฉันโดยเฉพาะคือการออกแบบหน้า Landing Page หลังการคลิกที่สวยงามและมี Conversion สูงสำหรับทีมการตลาดของเรา
BW: ประสบการณ์ครั้งแรกของคุณเป็นอย่างไรเมื่อคุณออกแบบหน้า Landing Page หลังคลิกด้วย Instapage
FM: สำหรับฉัน ไม่มีช่วงการเรียนรู้มากนักเพราะผลิตภัณฑ์นั้นค่อนข้างล้ำหน้าเมื่อตอนที่ฉันเข้าร่วมในเดือนพฤศจิกายน 2016 เมื่อฉันเริ่มใช้งาน Instapage ครั้งแรก ฉันประทับใจกับวิธีการสร้างแพลตฟอร์มโดยคำนึงถึงนักออกแบบ . ตัวสร้างไม่ได้เต็มไปด้วยตัวเลือกเมนูมากมายซึ่งคุณอาจหลงทางได้
แน่นอน มีไกด์สีเขียวในตัวสร้างเพื่อช่วยจัดองค์ประกอบ แต่คุณลักษณะมือถือ การจัดกลุ่ม และการจัดตำแหน่งทำให้ฉันประหลาดใจเมื่อออกแบบหน้า Landing Page หลังการคลิกครั้งแรก แทนที่จะต้องจัดองค์ประกอบแต่ละองค์ประกอบและเว้นระยะห่างสำหรับมือถือ ตอนนี้ฉันสามารถจัดกลุ่มรายการต่างๆ เข้าด้วยกันและย้ายองค์ประกอบทั้งหมดพร้อมกันในขณะที่รักษาอัตราส่วนกว้างยาวสำหรับมือถือไว้ได้
ส่วนสุดท้ายนั้นมีความพิเศษเป็นพิเศษ เนื่องจากในขณะที่อินเทอร์เน็ตใช้มือถือบ่อยขึ้น หน้า Landing Page หลังการคลิกของนักการตลาดจะต้องได้รับการปรับให้เหมาะสมสำหรับมือถือ ด้วยคุณสมบัติดังกล่าว ฉันสามารถใช้เวอร์ชันเดสก์ท็อปที่สมบูรณ์และแปลงเป็นมือถือได้โดยอัตโนมัติด้วยการคลิกปุ่ม การทำเช่นนี้ช่วยฉันประหยัดเวลาได้มาก และทำให้ฉันสามารถเผยแพร่หน้าเว็บได้เร็วขึ้นสำหรับทีมของเรา
ถ้าฉันต้องกำหนดคุณลักษณะสองประการสำหรับ Instapage ฉันจะบอกว่ามันปรับแต่งได้และไม่เจ็บปวด
BW: คุณใช้เวลานานเท่าใดจึงจะคุ้นเคยกับการใช้ Instapage?
FM: ไม่นานเลย สิ่งที่เกี่ยวกับ Instapage คือเป็นมิตรกับนักออกแบบ หากคุณคุ้นเคยกับเครื่องมือออกแบบอื่นๆ เช่น Sketch, Illustrator หรือ Photoshop คุณจะไม่มีปัญหาในการใช้แพลตฟอร์มนี้
ใช้หน้า Landing Page หลังการคลิกการรวม HubSpot ที่ฉันสร้างขึ้น หน้าทั้งหมดถูกสร้างขึ้นใน Instapage แต่ฉันสร้างกราฟิกหน้าสามชั้นใน Photoshop และแทรกลงในแพลตฟอร์มของเราซึ่งเพิ่มองค์ประกอบภาพที่ดี (ไปที่นี่เพื่อดูหน้า Landing Page แบบเต็มหลังจากคลิก):

BW: สิ่งที่นักออกแบบผิดหวังทั่วไปต้องเผชิญเมื่อสร้างหน้า Landing Page หลังคลิก?
FM: โดยธรรมชาติแล้ว นักออกแบบคือพวกชอบความสมบูรณ์แบบ งานของเราขึ้นอยู่กับคุณลักษณะนั้น ดังนั้นแม้ว่าบางสิ่งอาจ ดูเข้ากัน อย่างสมบูรณ์กับดวงตาที่ไม่ได้รับการฝึกฝน ตัวอย่างเช่น — แต่ไม่ใช่ — ลึกลงไป นักออกแบบจะรู้ว่ามันน่าจะดีกว่านี้
นั่นเป็นเหตุผลที่คุณลักษณะ Inline Style Editor มีประโยชน์อย่างยิ่ง เนื่องจากช่วยให้คุณสามารถเปลี่ยนแปลงการจัดสไตล์แบบกำหนดเองในระดับองค์ประกอบได้ ตั้งแต่การเปลี่ยนแปลงการเติมข้อความ รัศมีเส้นขอบ ความสูงของบรรทัด และอื่นๆ ไม่ต้องไปสบตาอะไรอีกต่อไป สร้างของเราช่วยให้คุณสามารถปรับแต่งลงไปพิกเซลสุดท้ายมากเพื่อให้คุณสามารถสร้างสิ่งที่คุณต้องการ
(นี่คือตัวอย่างวิธีที่คุณสามารถแยกองค์ประกอบและเพิ่มเงาให้กับปุ่มโดยใช้สไตล์แบบกำหนดเอง :)


BW: คุณร่วมมือกับใครมากที่สุดในการออกแบบเพจ?
FM: ขึ้นอยู่กับแคมเปญ เรามีผู้มีส่วนได้ส่วนเสียอย่างน้อย 3 ถึง 5 คน: นักเขียนคำโฆษณา 1 คน นักออกแบบ 1-2 คน และผู้นำการตลาด 1-2 คน นักเขียนคำโฆษณาสร้างภาษาที่โน้มน้าวใจบางอย่างเพื่อแสดงคุณค่าและประโยชน์หลักของข้อเสนอ ส่งต่อสำเนาให้ฉันเพื่อออกแบบขั้นสุดท้าย และผู้นำการตลาดดูแลโครงการและให้การอนุมัติไปพร้อมกัน นอกจากนี้ ขึ้นอยู่กับความต้องการในการออกแบบของหน้า Landing Page หลังการคลิก บางครั้งฉันสื่อสารกับนักออกแบบกราฟิกของเราเพื่อสร้าง gif หรือภาพอื่นๆ เพื่อช่วยในการสื่อสารข้อความ
คุณจะสังเกตเห็นว่าฉันไม่ได้รวมนักพัฒนา ในโอกาสที่หายากมาก เราจะนำนักพัฒนามาใช้ในการออกแบบที่ซับซ้อน การทำงานร่วมกันและให้ข้อเสนอแนะซึ่งกันและกันมีประสิทธิภาพมากขึ้น 2 เท่าเมื่อสร้างหน้า Landing Page หลังการคลิกด้วยโซลูชันการทำงานร่วมกันของเรา แทนที่จะใช้ภาพหน้าจอที่ส่งผ่าน Slack หรือเครื่องมือของบุคคลที่สาม เราสามารถวางฮอตสปอตบนองค์ประกอบหน้า Landing Page หลังคลิก และแจ้งผู้ออกแบบ (นักเขียนคำโฆษณาหรือผู้มีส่วนได้ส่วนเสียอื่น) เพื่อทำการอัปเดตที่จำเป็น
(เพื่อการทำงานร่วมกันที่ดีขึ้น โปรดดูที่ด้านล่าง — การสื่อสารผ่านฮอตสปอตและแชร์เพจกับทีมการตลาดของคุณ หรือคุณสามารถไปที่นี่) 

BW: คุณสมบัติ Instapage ที่คุณชื่นชอบคืออะไรและเพราะเหตุใด
FM: ในฐานะนักออกแบบ เป็นเรื่องยากสำหรับฉันที่จะตอบ แต่ฉันต้องบอกว่าฟีเจอร์ Instapage ที่ฉันชอบคือสามความสามารถในการออกแบบใหม่ที่เราประกาศในเดือนมิถุนายน 2017:
- การวัดขอบ
- แกนล็อค
- แป้นพิมพ์ลัด
นักออกแบบส่วนใหญ่ที่ฉันรู้จักมักต้องการเครื่องมือที่เหมาะสมเพื่อทำให้กระบวนการออกแบบมีประสิทธิภาพมากขึ้น แต่ยังต้องสร้างงานออกแบบที่สมบูรณ์แบบพิกเซลด้วย ที่กล่าวว่าฉันเชื่อว่า Instapage ทำอย่างนั้น
คล้ายกับการใช้แอป Sketch เรามี Edge Measurement และแป้นพิมพ์ลัด การวัดขอบนั้นยอดเยี่ยมเป็นพิเศษ เนื่องจากคุณสามารถย้ายและจัดแนวองค์ประกอบแบบพิกเซลต่อพิกเซลหรือช่วงของพิกเซลได้ เพื่อให้ได้สิ่งต่าง ๆ ตรงจุดที่คุณต้องการ การล็อคแกนช่วยให้คุณสามารถย้ายองค์ประกอบตามแกน X หรือ Y ได้อย่างราบรื่นโดยไม่ต้องจัดการกับเส้นนำที่ยุ่งเหยิง
คุณสมบัติเหล่านี้รวมกันทำให้ฉันสามารถสร้างหน้า Landing Page หลังการคลิกที่สวยงามและสมบูรณ์แบบด้วยพิกเซลภายในตัวแพลตฟอร์ม ตอนนี้คุณสามารถออกแบบได้โดยไม่มีข้อจำกัด! (สำหรับข้อมูลเพิ่มเติมเกี่ยวกับการวัดขอบและการล็อคแกน โปรดดูที่:) 

การเพิ่มประสิทธิภาพและทำซ้ำในการออกแบบเริ่มต้นของเราหลังจากเปิดตัวหน้า Landing Page หลังการคลิกของเราเป็นขั้นตอนที่สำคัญที่สุด นี่คือจุดที่ความสามารถในการทดสอบ Instapage A/B มีประโยชน์
BW: มีหน้า Landing Page หลังการคลิกที่คุณภาคภูมิใจมากที่สุดหรือไม่?
เอฟเอ็ม: แน่นอน! ไม่กี่เดือนที่ผ่านมา ฉันมีโครงการที่จะออกแบบและสร้างหน้า Landing Page หลังคลิกสำหรับการเปิดตัวโซลูชันการทำงานร่วมกันของเรา ฉันค่อนข้างใหม่กับทีม ดังนั้นการเรียนรู้และปฏิบัติตามแนวทางแบรนด์และแนวทางสไตล์ของเราจึงมีบทบาทสำคัญในกระบวนการนี้ ฉันสามารถสร้างหน้า Landing Page หลังคลิกได้อย่างง่ายดาย และฉันภูมิใจที่จะบอกว่าขณะนี้มีอัตราการแปลง 24% (ไปที่นี่เพื่อดูหน้าเต็ม)

มีคุณสมบัติการออกแบบที่คุณต้องการให้เราเพิ่มหรือไม่?
เราแสวงหาคำติชมจากลูกค้าของเราอยู่เสมอ และต้องการช่วยให้คุณสร้างหน้า Landing Page หลังการคลิกที่ดีขึ้นและมี Conversion สูงในวงกว้าง หากมีคุณลักษณะการออกแบบที่คุณต้องการให้เราเพิ่มในเครื่องมือสร้างของเรา โปรดส่งความคิดเห็นของคุณถึงเรา และเรายินดีให้คุณตรวจสอบ Instapage บน Capterra, Trustpilot หรือ G2 Crowd
จากนั้นเริ่มสร้างหน้า Landing Page หลังการคลิกที่ปรับแต่งได้ 100% ด้วย Instapage คุณไม่สามารถผิดพลาดได้ด้วยแพลตฟอร์มที่เป็นมิตรต่อนักออกแบบและความสามารถในการทดสอบ A/B ขั้นสูง อัตราการแปลงของคุณจะขอบคุณ ลงทะเบียนสำหรับการสาธิต Instapage Enterprise วันนี้
