wireframe คืออะไร
โพสต์แล้ว: 06/09/2019 4:36 pm
wireframe คืออะไร
ปกติแล้วก่อนที่จะทำอะไรสักอย่าง ก็ควรที่จะร่างแผนงานออกมาคร่าวๆก่อนเสมอ ถ้าจะให้พูดตัว Wireframe ก็คือการออกแผนงานที่ถูกร่างคร่าวๆขึ้นมา ฉะนั้น Wireframe คือการเอาเนื้อหาในเว็บไซต์มาลองจัดเรียงลงบน Layout ของเว็บไซต์ การออกแบบ ว่าต้องเอาข้อมูลตรงนี้ มาใส่ส่วนใหนของหน้าเว็บไซต์
ง่ายๆก็คือ Wireframe ก็คือการออกแบบเค้าโครงแบบให้มองเห็นภาพรวมของเว็บไซต์ ว่าต้องมีอะไรอยู่ในหน้านี้ และส่วนนี้ทำอะไรได้บ้าง และเชื่อมโยงกับหน้าของส่วนใหนของเว็บไซต์
เป็นการทำโดยคร่าวๆไม่ต้องออกแบบให้สวยงามเหมือนของจริง จะใช้คอมพิวเตอร์หรือใช้มือวาดเองก็ได้ โดย Wireframe นั้นจะไม่มีรายละเอียดด้านความสวยงาม ตัวอย่างเช่นสี หรือรูปภาพที่ใช้บนหน้าเว็บไซต์ แต่จะแสดงเฉพาะ layout, ส่วนประกอบบนหน้าเว็บไซต์ และอาจมีรายละเอียดเพิ่มเติมของส่วนต่างๆบนหน้าเว็บไซต์ ยกตัวอย่าง เช่นการเชื่อมโยงของลิ้งต่างๆ หรือ animationเป็นต้น Wireframe นี้อาจเรียกรวมไปถึงการเขียน mind map และ sitemap ด้วย
สุดท้ายนี้ ในการสร้าง wireframe สามารถ รู้ทิศทางการทำงานของเว็บไซต์ ทราบจุดประสงค์ของแต่ละหน้าว่าต้องการนำเสนออะไรก่อนล่วงหน้า ทำให้ไม่งงเวลาตัดสินใจที่จะเลือก เพิ่ม หรือตัดเนื้อหาบนหน้าเว็บไซต์
ภาพโดย : wikimedia
https://commons.wikimedia.org/wiki/File ... e_-_03.png
ปกติแล้วก่อนที่จะทำอะไรสักอย่าง ก็ควรที่จะร่างแผนงานออกมาคร่าวๆก่อนเสมอ ถ้าจะให้พูดตัว Wireframe ก็คือการออกแผนงานที่ถูกร่างคร่าวๆขึ้นมา ฉะนั้น Wireframe คือการเอาเนื้อหาในเว็บไซต์มาลองจัดเรียงลงบน Layout ของเว็บไซต์ การออกแบบ ว่าต้องเอาข้อมูลตรงนี้ มาใส่ส่วนใหนของหน้าเว็บไซต์
ง่ายๆก็คือ Wireframe ก็คือการออกแบบเค้าโครงแบบให้มองเห็นภาพรวมของเว็บไซต์ ว่าต้องมีอะไรอยู่ในหน้านี้ และส่วนนี้ทำอะไรได้บ้าง และเชื่อมโยงกับหน้าของส่วนใหนของเว็บไซต์
เป็นการทำโดยคร่าวๆไม่ต้องออกแบบให้สวยงามเหมือนของจริง จะใช้คอมพิวเตอร์หรือใช้มือวาดเองก็ได้ โดย Wireframe นั้นจะไม่มีรายละเอียดด้านความสวยงาม ตัวอย่างเช่นสี หรือรูปภาพที่ใช้บนหน้าเว็บไซต์ แต่จะแสดงเฉพาะ layout, ส่วนประกอบบนหน้าเว็บไซต์ และอาจมีรายละเอียดเพิ่มเติมของส่วนต่างๆบนหน้าเว็บไซต์ ยกตัวอย่าง เช่นการเชื่อมโยงของลิ้งต่างๆ หรือ animationเป็นต้น Wireframe นี้อาจเรียกรวมไปถึงการเขียน mind map และ sitemap ด้วย
สุดท้ายนี้ ในการสร้าง wireframe สามารถ รู้ทิศทางการทำงานของเว็บไซต์ ทราบจุดประสงค์ของแต่ละหน้าว่าต้องการนำเสนออะไรก่อนล่วงหน้า ทำให้ไม่งงเวลาตัดสินใจที่จะเลือก เพิ่ม หรือตัดเนื้อหาบนหน้าเว็บไซต์
ภาพโดย : wikimedia
https://commons.wikimedia.org/wiki/File ... e_-_03.png
