Wireframe เครื่องมือฟรี ช่วยออกแบบโครงสร้างเว็บไซต์ให้เป็นมาตรฐาน( ตอนที่ 1 )

6. Mockflow   |  mockflow.com

Mockflow เป็น Collection program สำหรับนักออกแบบ  ซึ่งประกอบไปด้วย WireframePro , WireframePro Desktop , BannerPro , BrochurePro , AnnotatePro , DesignCollab

•  WireframePro เป็นโปรแกรมออกแบบโครงสร้างเว็บไซต์บนเว็บไซต์ สามารถสร้างWireframe ได้ง่ายๆเพียงแค่คลิก ลาก วาง เท่านี้ก็สามารถออกแบบเว็บไซต์ได้แล้ว หน้าตาของโปรแกรมก็ออกแบบมาให้ดูง่าย มีเครื่องมือช่วยสร้างมากมาย มีรูปแบบของโครงสร้างเว็บไซต์ตัวอย่างมาให้ใช้ด้วย เช่น Facebook   ในระหว่างออกแบบก็สามารถพูดคุยกับผู้อื่นได้ และสามารถแบ่งปันผลงานให้กับผู้อื่นได้ หากต้องการจัดเก็บผลงานก็สามารถเก็บไว้ในบัญชีสมาชิกได้เลย หรือไม่ก็ Export ออกมาจัดเก็บไว้ใน PC ก็ได้
•  WireframePro Desktop เป็นโปรแกรมที่ใช้ออกแบบโครงสร้างเว็บไซต์เช่นกัน แต่เป็นโปรแกรมบน PC จึงจะต้อง Download มาติดตั้งบนเครื่องก่อนจึงจะใช้งานได้
• BannerPro เป็นโปรแกรมที่ใช้ออกแบบ Banner ของเว็บไซต์บนเว็บไซต์ สามารถสร้าง Banner เป็นของตัวเอง ในโปรแกรมก็จะมี Template Banner ไว้ให้อยู่แล้ว ซึ่งสามารถนำมาแก้ไขได้ ในโปรแกรมมีลูกเล่นมากมาย เช่น พวก Effect ต่างๆของรูปภาพ หรือตัวอักษร
• BrochurePro เป็นโปรแกรมที่ใช้ออกแบบและสร้างโปรชัวร์บนเว็บไซต์ ภายในโปรแกรมก็จะมี Template Brochure ไว้ให้เลือกมากมาย ซึ่งสามารถนำมาปรับปรุงแก้ไขเป็นของตัวเองได้ เมื่อออกแบบเสร็จสามารถ Export ออกมาเป็นไฟล์ PDF ได้
• AnnotatePro เป็นโปรแกรมที่ใช้สร้างคำอธิบายประกอบภาพบนเว็บไซต์ ซึ่งจะมีเครื่องมือช่วยสร้าง เช่น การแทรกตัวอักษรลงบนภาพ ก็สามารถปรับแต่ง ขนาด สี เงา รูปแบบ ของตัวอักษรนั้นได้ และสามารถแทรกสัญลักษณ์เข้าไปได้ด้วยซึ่งภายในโปรแกรมจะมีมาให้ เป็นต้น เมื่อตอกแต่งจนพอใจแล้วสามารถเลือกว่าจะบันทึกลง Cloud ของตัวเอง หรือว่าจะบันทึกลงเครื่องของตัวเองก็ได้ และสามารถแบ่งปันให้กับผู้อื่นได้ด้วย
•  DesignCollab เป็นโปรแกรมจัดอับดับผลงานการออกแบบโดยผ่านการโหวตจากทีมงานของคุณเอง เพื่อที่จะช่วยตัดสินใจให้เร็วขึ้น โดยเพียงแค่ Upload ผลงานตามที่ต้องการเข้าไปในโปรแกรม หลังจากนั้นทำการส่งในเพื่อนๆของคุณช่วยโหวตผลงานของคุณ และสามารถที่จะ Comment ผลงานนั้นได้อีกด้วย

โปรแกรมทุกตัวของ Mockflow ใช้งานได้ฟรีแต่จะต้องเป็นสมาชิกขอเว็บไซต์ก่อนจึงจะสามารถใช้งานได้ แต่คุณสามารถเข้าใช้งานโปรแกรมด้วยบัญชีของ Gmail ก็ได้เช่นกัน

mockflow

—

7. Simple Diagrams  |  simplediagrams.com

Simple Diagrams  เป็นโปรแกรมช่วยสร้างแผนภาพบน PC ในแพลตฟอร์ม Adobe AIR  ซึ่งสามารถใช้ได้กับระบบปฏิบัติการ Windows และ Mac

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

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

simple-diagrams

—

8. Denim  |  dub.washington.edu

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

โปรแกรมนี้เป็นโปรแกรมง่ายๆ มีเครื่องมือใช้ไม่มาก ซึ่งเหมาะสำหรับเครื่องสเปคต่ำ สามารถโหลดมาติดตั้งบนเครื่องได้ฟรี

Denim

—

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