สำหรับอาชีพนักพัฒนาโปรแกรมแล้ว คงไม่มีอะไรน่าตื่นเต้นไปกว่าการได้ลองจับอะไรใหม่ๆ ไม่ว่าจะเป็นอุปกรณ์ ระบบปฏิบัติการ หรือ OS ใหม่ๆ ตอนที่ได้ยินว่า Google TV เปิดให้เราเขียนโปรแกรมบนทีวีได้ก็รู้สึกน่าสนใจ เลยตามไปดู Session ใน Google I/O (อ่านเพิ่มได้จากบล็อก “On Google TV” ของ @markpeak)
เราผ่านโลกในยุค PC มานานแล้ว โปรแกรมแทบทุกชนิดในโลกของ PC มี Pattern ของมันจนแทบจะดิ้นไปทางอื่นลำบาก จนมาเมื่อ 4-5 ปีนี้ที่โลกของ Smart Phone เข้ามา ตามมาด้วย Tablet ซึ่งก็เริ่มสร้าง Pattern ของตัวเองขึ้นมาได้ระดับหนึ่ง
- PC รับคำสั่งผ่านเมาส์และคีย์บอร์ด ซึ่งมีความแม่นยำสูง เหมาะกับโปรแกรมประเภทหน้าต่าง
- Smart Phone รับคำสั่งผ่านนิ้ว อาจจะมีคีย์บอร์ดบางรุ่น ความแม่นยำต่ำ หน้าจอเล็ก โปรแกรมจึงควรออกแบบให้ปุ่มใหญ่ Simplify ทุกอย่างให้น้อยที่สุดเท่าที่จะทำได้
- Tablet มีขนาดใหญ่กว่า Smart Phone โปรแกรมสามารถแสดงผลแบบ 2-3 column ได้ ควรรองรับการหมุนเครื่องแนวตั้งและแนวนอน
คำถามคือแล้วสำหรับโลกใหม่ที่ยังเพิ่งเริ่มก่อตัวอย่างเงียบๆ อย่างการเขียนโปรแกรมบนทีวีที่นำโดย Google TV และอาจจะมี Apple TV ตามมาในอนาคต นักพัฒนาโปรแกรมอย่างเราจะมี Pattern ในการออกแบบโปรแกรมอย่างไร
เราอยู่กับทีวีมานาน ก่อนจะรู้จัก PC ด้วยซ้ำไป แต่การพัฒนาโปรแกรมบนทีวีเพิ่งจะเกิดขึ้นไม่นาน
- ทีวีรับ input ผ่านทางรีโมท โดยมากจะมีเพียง D-pad (บน ล่าง ซ้าย ขวา) และปุ่มเลข 0-9
- ทีวีมีหลากหลายมาก ทั้งขนาด การแสดงผล ความกว้างยาวของหน้าจอ จำนวน DPI
- ผู้ใช้ส่วนใหญ่นั่งห่างจากทีวี 2 – 10 เมตร ซึ่งตรงนี้ต่างจาก PC, Smart Phone และ Tablet มาก
TV Application Pattern ที่ทีมงานกูเกิลแนะนำสำหรับนักพัฒนาโปรแกรมมีดังนี้
โปรแกรมสามารถลงผ่าน Google TV และเรียกใช้งานได้เหมือนโปรแกรมบน PC หรือ Smart Phone
มีระบบ Install, Update, Uninstall แบบเดียวกัน
ทีวีไม่มีระบบสัมผัสหน้าจอ บังคับได้ 3 ทาง
- D-Pad บน ล่าง ซ้าย ขวา
- (อาจจะมี) คีย์บอร์ด
- (อาจจะมี) เมาส์
ถึงแม้ปัจจุบันจะมีคีย์บอร์ดและเมาส์สำหรับทีวีแล้ว แต่ผู้ใช้จำนวนน้อยมากที่มี
เพราะฉะนั้นทุกโปรแกรมที่เขียนบททีวีควรจะสนับสนุน D-Pad ซึ่งมีอยู่ในรีโมททีวีแทบทุกตัวในปัจจุบัน
สำหรับการออกแบบโปรแกรมบน PC และ Tablet มักจะใช้หลักการของ Tab และ Scroll Bar ดังรูปข้างบน การออกแบบหน้าจอลักษณะนี้มีประโยชน์มากสำหรับอุปกรณ์ที่มี Pointing Device อย่างเมาส์หรือนิ้วสัมผัสจอ
แต่สำหรับทีวีที่มีเพียง D-Pad หากผู้ใช้ต้องการเลือกดูข้อมูลใน Tab 1 เลือก item 2 จะเห็นว่าผู้ใช้ต้องกดปุ่มลงมาเรื่อยๆ จนกว่าจะได้กดปุ่ม Button ข้างล่าง ซึ่งเป็นระยะทางที่ลำบากเกินไปสำหรับโปรแกรมบนทีวี
การออกแบบโปรแกรมบนทีวี จึงควรให้ Tab อยู่ทางซ้ายมือ รายการย่ออยู่ตรงกลาง และปุ่มสั่งการอาจจะอยู่ขวาสุดดังรูป
ถ้าผู้ใช้ต้องการเลือก Tab 1 และ item 2 หากจะไปที่ปุ่ม Button ก็กดปุ่มขวาเพียงครั้งเดียวก็เพียงพอ
ต่างกับ PC และ Smart Phone ที่ผู้ใช้สามรถเลื่อนไปกดปุ่มต่างๆ ได้ตามใจชอบ แต่กับทีวีและ D-Pad นักพัฒนาควรใส่ใจกับ State ของ Cursor ในแต่ละจุด ว่าตอนนี้อยู่ที่จุดไหนแล้ว กำลังจะไปที่ไหนต่อ ต้องใช้ระยะทางเท่าไหร่
ตัวอย่างการปรับ Action Bar จากบน Tablet มาอยู่บน Google TV นอกจากที่เราควรจะลดจำนวนปุ่มแล้วยังต้องปรับเมนูมาอยู่ทางซ้าย
ถ้าวัดขนาดกว้างยาวของหน้าจอ แน่นอนว่าทีวีมีขนาดใหญ่กว่าหน้าจอบนอุปกรณ์อื่นๆ มาก แต่ในความเป็นจริงแล้วจำนวน Pixel หรือ DPI ถ้าวัดจริงๆ ก็ไม่ได้มากกว่ากันซักเท่าไหร่ เราสามารถมองเห็น Pixel บนทีวีได้ถ้ามองใกล้ๆ ด้วยตาเปล่า
จากตารางข้างบน ทีวีจึงจัดอยู่ในกลุ่ม Large Screen และมี DPI อยู่ในช่วง 240-320 DPI
ถ้าหากเรานั่งห่างจากทีวีซัก 5 เมตร เราจะเห็นขนาดของจอทีวีไม่ได้ใหญ่กว่า Tablet ในมือมากนัก การทดสอบโปรแกรมบน Simulator จึงให้ผลไม่ต่างกับการทำงานจริงบนทีวีมากนัก
ด้วยเหตุผลทางการผลิตหลายอย่าง ทำให้ผู้ผลิตทีวีหลายรายจำเป็นต้องสร้างขอบขึ้นมาจากขนาดของจอจริงๆ เพราะฉะนั้นบางครั้งทีวีขนาด 1,920 x 1,080 อาจจะแสดงผลได้เพียง 1,692 x 952
ส่วนขอบที่หายไปจะถูก Crop ออกไป เพราะฉะนั้นเราควรออกแบบโรแกรมโดยเผื่อขอบที่หายไปด้วย
การวางตำแหน่ง UI ไม่ควรที่จะเขียนโค้ดระบุตำแหน่ง X – Y ที่ชัดเจน ควรออกแบบให้ UI เผื่อการยืดและหดได้ ตามขนาดของจอทีวีที่ไม่เท่ากัน
สำหรับ QA ควรจะมีการทดสอบโปรแกรมบนทีวีหลากหลายเท่าที่จะหาได้
ตัวอย่างการพอร์ทโปรแกรมจาก Tablet มาบน Google TV
จากรูปนี้คือโปรแกรม Pandora ในเวอร์ชัน Tablet ทุกอย่างดูเรียบง่ายดีอยู่แล้ว แต่ก็ยังมีสิ่งที่ต้องเปลี่ยนเมื่อมาอยู่บนทีวี
- ปรับขนาดของรูปหน้าปกให้มี Resolution ที่มากกว่าเดิม (จอใหญ่ขึ้น)
- เรียงปุ่มที่ใช้บ่อยอย่างเช่น เมนู, หยุด, เล่นเพลงต่อไป ไว้ทางซ้าย และปุ่มที่ใช้ไม่บ่อยนักไว้ทางขวา
- UI หลายอย่างที่เขียนบน Android Tablet สามารถ Reuse มาใช้่บน Google TV ได้เลย
อีกตัวอย่างนึงจาก CNBC ที่ต้องคิดใหม่ โดยการรวมโปรแกรมเวอร์ชันมือถือกับหน้าเว็บเข้าด้วยกัน
- แสดงวิดีโอหรือเนื้อข่าวทางซ้าย
- แสดงส่วนของ Stock ทางขวา
- ใช้ D-Pad เลื่อนไปตาม item ต่างๆ ได้ง่าย
- ถ้ารีโมทมีปุ่น Play, Pause, Forward ควรเขียนโปรแกรมให้รองรับด้วย
สุดท้าย หน้าตาของ Android Market สำหรับ Google TV หน้าตาเป็นเช่นนี้
- การเขียนโปรแกรม, SDK, โค้ด ไม่ต่างจากเดิมเท่าไหร่
- สำคัญที่สุดคือการวาง Layout ของโปรแกรม เพื่อรองรับ D-Pad
- ทีวีมีหลากหลาย(มาก) ควรคิดเผื่อในการแสดงผลบนทีวีหน้าจอแบบอื่นๆ ด้วย
- TV Application Development ยังเป็นช่วงเริ่มต้น อาจจะต้องลองผิดลองถูกไปอีกซักพักจนกว่าจะได้ Pattern ที่เหมาะสม
- โมเดลการหารายได้จากโปรแกรมบนทีวีจะมีหน้าตาเป็นอย่างไร
- โปรแกรมประเภทใช้ฟรีแล้วเก็บค่าโฆษณา พอมาอยู่บนทีวี บริการโฆษณาอย่าง Adsense, Admob จะมีหน้าตาเป็นอย่างไร เก็บรายได้กันอย่างไร (ตามเวลาที่โฆษณาโชว์ ?)
- เมื่อไหร่ที่ Apple TV จะลงโปรแกรมเพิ่มเติมได้ และเมื่อลงได้จริง ตลาด TV Application จะเป็นขุมทรัพย์ได้เท่ากับตลาด Smart Phone และ Tablet จริงหรือเปล่า ?
