Wireframing, Mockup, Prototyping ต่างกันอย่างไร?

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

• ไวร์เฟรม

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

• ม็อกอัป

เป็นการแสดงผลแบบคงที่ว่าหน้าตาของโปรดักต์สุดท้ายควรจะดูเป็นอย่างไร

• โปรโตไทป์

คือการเพิ่มการโต้ตอบ หรือ interaction เข้าไปในหน้าจอแบบคงที่ที่สร้างจากม็อกอัป