ออกแบบเว็บไซต์ให้ตรงใจ ต้องบรีฟยังไงให้ทีมออกแบบเว็บไซต์เข้าใจ

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

บรีฟบริษัทออกแบบเว็บไซต์ ต้องบอกอะไรบ้าง?

1. บอกเป้าหมายของเว็บไซต์

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

2. บอกว่าธุรกิจทำอะไร และลูกค้าคือใคร

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

• ธุรกิจทำอะไร
• ลูกค้าหลักคือใคร
• ลูกค้ามักถามเรื่องอะไรก่อนตัดสินใจ
• บริการหรือสินค้าหลักที่อยากดันคืออะไร
• จุดที่อยากให้คนจำแบรนด์ได้คืออะไร

3. บอกหน้าเว็บและข้อมูลที่ต้องมี

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

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

4. บอก Mood สี และสิ่งที่ไม่อยากได้

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

• Mood ที่อยากได้
• สีที่ใช้ได้
• สีที่ไม่อยากใช้
• ภาพลักษณ์ที่อยากให้ลูกค้ารู้สึก
• สไตล์ที่ไม่อยากให้เว็บออกมาเป็น

5. ส่ง Reference พร้อมเหตุผล

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

• ชอบส่วนไหน เช่น สี Layout ฟอนต์ ภาพ ปุ่ม Card หรือการวาง Section
• ไม่ชอบอะไร เช่น เว็บมืดเกินไป Animation เยอะ ตัวหนังสือเล็ก หรือหน้าแรกยาว
• ส่วนไหนที่ต้องการนำมาใช้เป็นแนวทางในการออกแบบ 
• ส่วนไหนที่ไม่ต้องการให้นำมาเป็นแนวทางในการออกแบบ 

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

6. ส่งเนื้อหา รูปภาพ และไฟล์ที่มีอยู่

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

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

ก่อนเริ่มงาน ต้องตกลงอะไรกับทีมออกแบบบ้าง

นอกจากบรีฟเรื่องหน้าตาและเนื้อหาแล้ว ควรตกลงขอบเขตงานก่อนเริ่มออกแบบด้วย เพื่อไม่ให้ต้องวนแก้หลายรอบโดยไม่รู้ว่าขอบเขตอยู่ตรงไหน เรื่องที่ควรถามและตกลงก่อนเริ่มงาน เช่น

1. ออกแบบทั้งหมดกี่หน้า
2. มีรอบแก้กี่รอบ
3. เว็บไซต์จะรองรับการแสดงผลบนมือถือรูปแบบใด
4. ใครเป็นคนลงเนื้อหาจริง
5. ใครมีสิทธิ์อนุมัติงาน
6. หลังเว็บเสร็จ ลูกค้าแก้ข้อมูลเองได้ไหม
7. เว็บต้องเตรียมโครงสร้างเพื่อรองรับการทำ SEO หรือเชื่อมต่อเครื่องมือทางการตลาดเพิ่มเติมหรือไม่
8. รายการส่งมอบหลังจบโครงการมีอะไรบ้าง และเป็นไปตามขอบเขตหรือเงื่อนไขใด 

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

ตัวอย่างการบรีฟออกแบบเว็บไซต์ที่ดี

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

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

ตัวอย่างบรีฟแบบนี้ช่วยให้บริษัทออกแบบเว็บไซต์เห็นทั้งเป้าหมายของเว็บ กลุ่มลูกค้า Mood ที่ต้องการ Reference ที่ชอบ ข้อมูลที่มีอยู่ และส่วนที่ต้องการให้ทีมช่วยต่อยอดตั้งแต่ต้น

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

คำถามที่พบบ่อย

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

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

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

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

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