มารู้จักกับ Wireframe กันเถอะ

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

Wireframe 
Wireframe คือการออกแบบเว็บไซต์คร่าวๆ โดยมีการออกแบบจัดเรียงข้อมูลคร่าวๆว่าเเตะละหน้าควรมีอะไรบ้าง ส่วนไหนอยู่ตรงไหน ซึ่งขั้นตอนนี้เป็นขั้นตอนก่อนที่จะนำไปออกแบบต่อไปใน Photoshop นั้นเอง

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

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

ที่มา : designil