Traditional web หรือ Rich Internet web

ก่อนหน้านี้เว็บส่วนมากจะไม่มีลูกเล่นพิเศษ การกด Link หรือกดปุ่มใดๆ จะมีการ Refresh ทั้งหน้าจอเสมอ ซึ่งผมมองว่านั่นเป็นสิ่งที่ทำให้เว็บง่าย ทั้งการทำความเข้าใจได้เร็วและโอกาสที่จะเดาการทำงานผิดก็น้อยด้วย ผมจะเรียกเว็บแบบนี้ว่า Traditional web 

ส่วนเว็บในปัจจุบันที่สามารถทำหลายอย่างได้ในหน้าเดียว ตัวเว็บสามารถ refresh ได้เป็นจุดๆ สามารถ double click, drag & drop, right click ได้ เหมือนกับการยก Desktop Application มาไว้บนเว็บ บางทีเราเลยเรียกว่า Web Desktop Class Application หรือในที่นี้เราจะเรียกมันว่า Rich Internet Application 

ภาพเปรียบเทียบ Traditional web เทียบกับ Rich Internet App

RIA หรือ Rich Internet Application เติบโตมาจากเทคโนโลย Java Applet, Flash, SVG จนปัจจุบันเทคโนโลยี และมาตรฐานของ HTML/HTML5 พัฒนาขึ้นมาจนเราไม่ต้องใช้ plugin ทั้งสามตัวที่กล่าวมาก็สามารถทำ RIA ได้ ทำให้ผู้ใช้สะดวกสะบายขึ้นมาก เพราะไม่ต้องลงโปรแกรมเสริม

เมื่อความลำบากของผู้ใช้ลดลง สิ่งที่ขวางไม่ให้ใช้ RIA ก็น้อยลง เราสามารถใช้ RIA กับเว็บของเราได้ทันที การตัดสินใจจึงขึ้นอยู่กับว่า RIA เหมาะกับ Web ของเราหรือเปล่า?

ตัวอย่าง RIA จาก framework cappuccino

แนวทางง่ายๆ ในการเลือก ให้พิจารณาจากความต้องการของผู้ใช้และลักษณะของ web ของเราเป็นหลัก ถ้ากลุ่มเป้าหมายของเราเป็น Home use ความง่ายจะมาเป็นอันดับหนี่ง ผู้ใช้สามารถรอได้ สามารถ click หลายครั้งได้ ถ้ามันทำให้ง่ายขึ้น พวกนี้เราจะใช้ Traditional  web

แต่สำหรับให้มืออาชีพใช้ เช่น นักบัญชีมืออาชีพ นักออกแบบมืออาชีพ นักทำ presentation มืออาชีพ พวกนี้ความง่ายเป็นรอง ความรวดเร็วในการสร้างงาน จะมาก่อน คนกลุ่มนี้ยินดีแลกเวลาในการเรียนรู้กับเวลาในการทำงาน ดังนี้เราสามารถทำ web ให้ใช้งานยากได้ จึงเหมาะกับพวก RIA ครับ

ก่อนพัฒนาขอให้แน่ใจว่าเราเลือกรูปแบบการพัฒนา ให้เข้ากับผู้ใช้ของเราแล้ว และคุณลักษณะของโปรแกรมของเราแล้ว จึงค่อยเริ่มงานพัฒนานะครับ

หน้าจอสัมผัส: แตะกับแตะค้าง

อันนี้เน้นการประยุกต์และธรรมชาติการใช้งานการแตะกับแตะค้างบนหน้าจอของ app บน iOS ชื่อ Wikipanion ไม่ได้ค่าโฆษณานะ แต่ใช้อยู่ :-P

Wikipanion เป็นโปรแกรมอ่าน วิกิพีเดีย มีความสามารถหลายอย่าง เรื่องทำไมต้องใช้ app อ่านวิกินั้นไม่ใช่ประเด็นหลัก :-P แต่สิ่งที่น่าสนใจคือตัว app เองมีการประยุกต์การแตะกับการแตะค้างไว้อย่างน่าสนใจ

ถ้าใครติดวิกิพีเดียก็พอจะนึกออกว่า เวลาเราอ่านบทความใดๆ ก็ตาม เราจะอยากอ่านบทความอื่นๆ ที่ถูกเชื่อมโยงเนื้อหาไว้ด้วย ยกตัวอย่างเช่น ผมอ่านบทความวิกิเรื่อง Mars Science Laboratory แล้วก็อยากรู้ว่าจุดลงจอดของหุ่นมันอยู่ใน Gale Crater ซึ่งเป็นหลุมอุกาบาตบนดาวอังคารมันเป็นอย่างไร ในกรณีนี้ผมมีสองทางเลือกคือ

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

แสดงการเปิดลิงก์ที่อยากอ่านในวิกิพีเดียไปยังแท็บใหม่ รอไว้อ่านทีหลัง

 สิ่งที่น่าสนใจใน Wikipanion คือการออกแบบระบบคิวเพื่อรองรับพฤติกรรมการใช้งานนี้ โดยใช้การแตะและการแตะค้าง ในโปรแกรมรุ่นก่อนๆ ไม่แน่ใจว่ารุ่นไหน โปรแกรมออกแบบไว้ว่า

• แตะลิงก์เพื่อไปยังเนื้อหานั้น
• แตะลิงก์ค้างเพื่อเก็บลิงก์นั้นเข้าคิว

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

• แตะลิงก์เพื่อเก็บลิงก์นั้นเข้าคิว
• แตะลิงก์ค้างเพื่อไปยังเนื้อหานั้น

แตะลิงก์ Gale Crater เพื่อเก็บเข้าคิว

แตะค้างลิงก์ Gale Crater เพื่อไปยังเนื้อหาทันที

สิ่งที่น่าสนใจคือทำไม Wikipanion ถึงเลือกที่จะเปลี่ยนพฤติกรรมของผู้ใช้?

คำตอบที่เป็นไปได้คือ พฤติกรรมการใช้งานของผู้ใช้ที่ท่องเว็บบนอุปกรณ์ที่ใช้งาน Mobile Safari มักจะแตะที่ลิงก์ไปเพื่อไปยังหน้าต่างๆ ในทันที และแตะค้างเพื่อเปิดตัวเลือกเพิ่มเติมเช่น เปิดลิงก์ในแท็บใหม่ ทีหลัง

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

หากจะโต้วาทีเรื่องนี้ก็อาจจะต้องย้อนไปว่า พฤติกรรมการอ่านวิกิพีเดียควรจะเป็นแบบไหนถึงจะได้ความรู้สูงสุด อ่านให้จบเป็นชิ้นๆ หรืออ่านกระโดดไปกระโดดมา?

Microsoft แสดงหน้าจอ Metro สำหรับงาน Enterprise

หลายคนพอเห็น Theme Metro มักจะนึกว่า รูปแบบโล่งๆ แบบนี้เวลาเอาไปทำงาน Enterprise ที่มันซับซ้อนมากๆ จะออกแบบให้มันเข้ากับ Metro ได้อย่างไร

ช่วงต้นปี Microsoft เปิด video keynote บนเว็บ msconvergence.com แสดงให้เราดูว่าเจ้า Metro ก็สามารถเป็น Enterprise Application ได้เหมือนกันนะ

หน้าจอ Dashboard

หน้าจอบริหารงาน Finance แบบภาพรวม

หน้าจอรายละเอียดทาง Finance แบบสองส่วนในหน้าเดียว

หน้าจอรายละเอียดทาง Finance แบบตาราง

หน้าจอ Approve Project

จะเห็นว่า Metro ก็ทำ Application แบบนี้ได้เหมือนกันครับ แต่ผมมองว่า Developer คงต้องคิดกันหัวปูดเลยทีเดียวเพราะไม่สามารถใส่ลงไปชุ่ยๆ ได้อีกแล้ว

ผมยังนึกหน้าจอตอนที่กรอก Invoice ด้วย Metro ไม่ออก แต่เท่าที่เห็นในภาพก็มีแนวโน้มจะทำได้ดีครับ

ที่มา - get-spblog.com

Outlook New look พื้นที่ทำงาน

โปรแกรม mail กลายเป็นโปรแกรมสำคัญเพื่อให้ ecosystem ของทั้่ง google, microsoft และ apple สมบูรณ์ ดังนั้นเราจึงสามารถวิเคราะห์ยุทธศาสตร์ที่แต่ค่ายวางแผนไว้ได้โดยผ่านโปรแกรม Mail ที่ทั้งสามค่าส่งออกมา

ล่าสุดทาง Microsoft ปรับปรุง Outlook เพื่อให้เข้ากับแผน "Metro" ที่ได้วางเอาไว้

การเปลี่ยนจาก Transitional web ไปเป็น Web application เป็นความกล้าที่เข้ากับยุคสมัย หลายคนคิดว่าการทำแบบนั้นทำให้ web ใช้ยากขึ้น แต่ต้องอย่าลืมว่าคนในยุคนี้ถูกสอนให้ใช้ Application และ Web application มาระยะนึงแล้ว การเปลี่ยนแปลงครั้งนี้จึงไม่ได้สร้างความตกใจ แต่ทำให้เกิดความพึงพอใจมากกว่า

ยิ่งหน้าจอแบบ Metro บังคับให้ Microsoft ตัดความฟุ่มเฟือยทิ้งไปทั้งหมด ไม่ว่าจะเป็น Logo Microsoft, Banner ด้านบน, Menu ที่เชื่อมไปยังบริการอื่นๆ, การ custom photo themes, ช่องค้นหาของ bing ทั้งหมดถูกตัดออกจน Outlook เรียบร้อยมากขึ้น ดูสมกับเป็น Metro และที่สำคัญคือมันช่วยลดระยะเวลาในการเรียนรู้ของผู้ใช้ลงไปได้มาก

แต่ถ้าเทียบกับคู่แข่งทั้ง Google และ Mac ผมมองว่าจุดยืนของ Microsoft เป็นจุดที่ต้องทำการบ้านหนักกว่าคู่แข่งทั้งสองมากๆ 

เมื่อลองเทียบกับ Google จะเห็นว่า Google ยังคงความเป็น web เอาไว้ และ แยกหน้าจอ Subject ออกจากหน้าจอเนื้อหา mail ทำให้สามารถแสดงข้อมูลของ Mail เยอะในแบบที่คนที่ใช้ Mail แบบ Hardcore ต้องการ

สำหรับ Apple  จะมีหน้าตาเป็น Application ชัดเจน โดยเน้นเอา Element ต่างๆ ของ Application ในไว้บนเว็บ ตัดตัวหนังสือ และคำสั่งออกไปเป็นจำนวนมาก คงเหลือไว้แต่คำสั่งที่ใช้กันบ่อยๆ อันไหนที่ไม่ค่อยได้ใช้ก็จะซ่อนเอาไว้ และจะใช้ได้ก็ต่อเมื่อเป็นผู้ใช้เริ่มเรียนรู้มากขึ้น เช่น เราสามารถเลือก mail ทีละหลายๆ อันได้ แต่ต้องกด shift หรือ control ค้างไว้ เป็นต้น Apple จึงเหมาะกับผู้ใช้ตามบ้าน ไม่ใช้คนที่ใช้ Mail จริงๆ จังๆ

จากการออกแบบที่ดูยากก็ไม่ยาก ง่ายก็ไม่ง่ายนักเราเลยเดาว่า Outlook ต้องการให้ทั้งผู้ใช้ตามบ้าน และผู้ใช้แบบ Hardcore สามารถใช้ได้ทั้งคู่ คือทั้งสองคนต้องมีความสุขกับ ​Outlook ไม่ว่าคุณจะส่ง Mail วันละแค่สองสามฉบับ หรืองานของคุณคือการส่ง mail ทั้งวัน Outlook จึงดูกึ่งๆ ไม่เป็นทั้ง Pro และ Home

ทีนี้เราลองมาดูผลลัพธ์ที่เกิดจากจุดยืนที่แตกต่างกันของทั้งสามค่ายกัน เริ่มจากพื้นที่ใช้งานก่อน เพราะพื่นที่อ่านของตัว Mail เป็นตัวสำคัญที่บอกว่า กลุ่มเป้าหมายของคุณมี Content ส่วนใหญ่เป็นอะไร 

Google มีพื่นที่แนวกว้าง ไม่เหมาะกับ วีดีโอ และรูปภาพ แต่น่าจะเหมาะสำหรับการอ่าน Text โดยยอมแลกพื้นที่ด้านบนเพื่อแสดงความเป็น Google ผ่าน search ขนาดใหญ่ คน google อาจจะคิดว่ากลุ่มเป้าหมายของเค้าเป็นคนจอใหญ่ ไม่ใช่คนที่ใช้จอเล็กๆ กว้างๆ ซึ่งปกติพวก Pro มักมีจอใหญ่

Apple ให้ความสำคัญกับพื่นที่เนื้อหา Mail เป็น  50% ของจอ และแทบจะเป็นสี่เหลี่ยมจัตตุรัส แสดงว่าเน้นข้อมูลที่เป็นรูปภาพ หรือ Multimedia มากกว่า Text ทำให้คิดว่า iCloud เหมาะกับผู้ใช้บ้านๆ ที่เน้นส่งรูปหากันมากกว่า

Microsoft มีขนาดของพื้นที่น้อยที่สุด แต่ก็มีขนาดเป็นสี่เหลี่ยมเช่นเดียวกัน ก็พอจะเดาได้ว่าเน้น Multimedia เหมือนกัน แสดงว่าตั้งจะจับกลุ่มบ้านๆ ด้วย แต่ก็ไม่ได้ทิ้งกลุ่ม Pro เพราะถ้าสังเกตุในช่องแสดงเนื้อหา Mail จะมีส่วนที่เป็นข้อมูลประกอบ Mail สูงเป็น 1 ใน 5 ของเนื้อที่เลยทีเดียวครับ

ผมไม่แน่ใจว่า Default ของการแสดงผลบน Outlook เป็นแบบในภาพ หรือเป็นแบบสลับ list กับ detail แต่อย่างไรก็ตามเมื่อ Microsoft คิดจะจับทั้งสองตลาดจึงต้องทำการบ้านมากกว่าอีกสองค่าย และต้องคิดให้หนักเพื่อที่จะซ่อน feature จากกลุ่มผู้ใช้ตามบ้าน และแสดง feature เหล่านั้นกับกลุ่ม Pro 

ส่วนตัวผมมีความสุขกับการใช้ gmail เพราะมี function ครบและ function ต่างๆ มันกระจายอยู่ตาม content ที่มันจะ action ด้วย จึงทำให้หาง่าย ติดที่มันให้พื้นที่ใช้งานน้อยมากทำให้ขัดใจอยู่เสมอโดยเฉพาะตอนดูรูป ส่วนของ mac ผมสามารถใช้ Application ได้สะดวกกว่า จึงไม่ค่อยเปิด iCloud ขึ้นมาใช้ครับ