Digital Blog - Ourgreenfish

เช็กลิสต์ สิ่งสำคัญที่ Web Designer ต้องทำ ถ้าไม่อยากแก้งานซ้ำซ้อน

เขียนโดย สุพัตรา อัมรานนท์ - 17 ก.ย. 2020, 3:04:00

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

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

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

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

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

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

  • ชื่อ-นามสกุล
  • อายุ
  • อาชีพ
  • เงินเดือน
  • งานอดิเรก

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

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

Design System
กระบวนการคิดสร้างสรรค์โดยออกแบบให้ใช้งานได้ง่ายและมีประสิทธิภาพที่สุด โดยมีส่วนประกอบดังนี้

  • Typography
  • สี
  • ฟอร์ม
  • ปุ่มต่าง ๆ

ซึ่งกระบวนการนี้ ทำให้ Web Developer เวลาที่รับงานต่อจาก Web Designer ทำให้การเขียนโค้ดทั้งด้านการใช้งาน สีและธีมต่าง ๆ เขียนได้อย่างง่ายดาย ไม่ต้องมาคอยนั่งแก้ทีละจุด ถ้าหากว่าตัวเว็บเองไม่สามารถเขียนโค้ดตามที่ดีไซน์ออกแบบมาได้ 

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