วันอังคารที่ 4 สิงหาคม พ.ศ. 2552

Balsamiq เครื่องมือแสนสะดวกสำหรับออกแบบ UI

ด้วยฝีมือของ Peldi หรือ Giacomo Guilizzoni นักพัฒนาเครื่องมือออกแบบผู้มากความสามารถ ที่ผ่านประสพการณ์ในการทำงานกับบริษัทที่เป็นผู้นำด้านการออกแบบ เช่น Adobe และ Macromedia มาแล้ว เครื่องมือออกแบบอินเทอร์เฟสชิ้นใหม่ ที่เน้นความเรียบ ง่าย แต่ใช้ได้จริงอย่างมีประสิทธิภาพ ที่เรียกว่า Balsamiq ชิ้นนี้จึงได้ถือกำเนิดขึ้นในปี 2008 และผ่านไปเพียง 5 เดือนเท่านั้นก็ได้รับความนิยมจากบริษัทชั้นนำที่หลากหลาย เช่น GE, BT, Oracle เป็นต้น?

Balsamiq เป็นเครื่องมือออกแบบอินเทอร์เฟสที่เน้นความเร็วในการทำงานเป็นหลัก โดยปรกติวิธีการที่เราจะออกแบบอินเทอร์เฟสได้เร็วที่สุดก็คือการใช้ปากกากับ กระดาษ นักออกแบบหลายคนอาจจะใช้เครื่องมือช่วยนำเสนอ เช่น Powerpoint หรือเครื่องมือออกแบบแผนผังเช่น Visio ในการทำงาน แต่อย่างไรก็ดีทุกวิธีที่กล่าวมาล้วนมีความไม่สะดวกเกิดขึ้น เช่น

  • การวาดบนกระดาษ วิธีนี้รวดเร็วแต่ต้องเสียเวลา digitize ให้อยู่บนหน้าจอ เมื่อมีการลบ หรือปรับเปลี่ยนแบบ เช่น ตำแหน่งของปุ่ม จะกระทบกับดีไซน์มาก อาจต้องวาดแผ่นใหม่ ?

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

  • ใช้ Visio วิธีนี้จะได้แบบที่เป็นระเบียบ และไม่ค่อยมีข้อจำกัดด้านพื้นที่ในการออกแบบ นักออกแบบบางท่านอาจจะใช้ชุด stencil ที่ทำขึ้นเป็นพิเศษสำหรับการออกแบบอินเทอร์เฟสโดยเฉพาะ ซึ่งก็ช่วยลดเวลาไปได้มาก อย่างไรก็ดี ชุดต้นแบบอินเทอร์เฟสเหล่านี้ก็ยังมีอยู่จำกัด ไม่ตอบสนองต่อการใช้งานเท่าที่ควร ส่วนตัวซอฟต์แวร์นั้นก็มีราคาสูงพอสมควร (ราคา Microsoft Visio 2007 Professional ?อยู่ที่ $559.95 ที่ไมโครซอฟท์ หรือ $419.99 ที่ Amazon) ทำให้ไม่เหมาะกับนักออกแบบอินเทอร์เฟสทั่วไปนัก แต่ก็เป็นเครื่องมือมาตรฐานที่นักออกแบบอินเทอร์เฟสใช้กันอยู่ทุกวันนี้

Balsamiq นั้นเน้นความเร็วในการทำงาน จึงเตรียมอินเทอร์เฟสสำหรับคอนโทรลต่างๆมาไว้ให้ถึงมากกว่า 60 แบบ โดยจัดแยกเป็นหมวดหมู่ชัดเจน เพื่อให้เข้าถึงได้ง่าย รวมถึงมีคอนโทรลเฉพาะ เช่น browser window, media-player, chart, datepicker เตรียมไว้ให้นักออกแบบได้เลือกใช้งานในทันที ทำให้ประหยัดเวลาลงไปได้มาก



ถึงแม้จะมีคอนโทรลเตรียมไว้ให้มาก แต่ตัวโปรแกรมก็ถูกออกแบบให้เรียนรู้วิธีการใช้งานได้เร็ว มี shortcuts ช่วยในการเข้าถืงคอนโทรลที่ต้องการจากการสืบค้น มี property inspectors ช่วยในการกำหนดคุณลักษณะของคอนโทรลที่เลือก โดยจะโผล่มาเฉพาะเมื่อเราเลือกใช้งานคอนโทรลที่ต้องการ ทำให้การออกแบบอินเทอร์เฟสนั้นเป็นไปได้หลากหลาย และใช้เวลาแค่ไม่กี่วินาทีในการทำงาน เช่น
Desktop Application




Dialog Boxes



Web Applications




Websites





Rich Internet Applications




เราสามารถเลือกบันทึกไฟล์ไว้เป็นฟอร์แมตเฉพาะของ Balsamiq (ซึ่งแท้จริงแล้วเป็น markup ชนิดหนึ่งที่เปิดแก้ไขด้วย Notepad ได้ตลอดเวลา) หรือจะเลือกบันทึกเป็น .png เพื่อนำไปใช้ประกอบกับงานอื่นๆต่อก็ได้?

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

สนใจนำไปลองใช้งาน เชิญทดลองใช้ก่อนได้ที่ http://www.balsamiq.com/ โปรแกรมใช้เทคโนโลยี Adobe AIR เป็นพื้นฐานในการทำงาน การติดตั้งและเริ่มใช้งานง่าย (ใช้เวลาเพียงไม่ถึง 5 นาที) โปรแกรมตัวอย่างทำงานได้เหมือนโปรแกรมจริงทุกประการ เพียงแต่จะไม่สามารถบันทึก หรือเก็บ Snapshots เป็น .png ได้ หากถูกใจราคาไม่แพงครับ แค่ $79 เหรียญเท่านั้น หรือถ้าคุณเป็นคนที่ทำงานเพื่อสังคม / blogger ที่ต้องการเขียนเรื่องเกี่ยวกับ balsamic หรือนักจัดแคมป์ที่จะนำ Balsamic ไปพูดถึง ก็สามารถเขียนอีเมลไปขอ license มาใช้ได้ฟรีครับ ขอให้สนุกกับการใช้งาน


เนื้อหาจาก http://www.marketingbyte.com/articles/article-345-balsamiq-ui

อ้างอิง

http://www.balsamiq.com/company

http://www.balsamiq.com/products/mockups/examples

ไม่มีความคิดเห็น: