User Interface

Humanized Advance Search

Blekko เป็น Search Engine หน้าใหม่ที่เปิดตัวมาได้ระยะนึงแล้ว โดยจุดเด่นอยู่ที่ความสามารถในการกำหนดเฉพาะสิ่งที่เราต้องการให้แสดงในผลการค้นหาด้วยวิธีง่ายๆ แค่เพิ่ม "/" (slash) ตามด้วยคำต่างๆ เข้าไป ซึ่งหลายคนก็หวังว่ามันจะเป็นทางออกของปัญหาสแปมครอง Search Engine ที่น่าเบื่อหน่าย (ถ้ากรองด้วย slash แล้วยังมีพวกนี้หลุดมาอีกก็กดปุ่ม "spam" แล้วเว็บนั้นจะไม่โผล่มาให้เราเห็นอีกเลย เจ๋งมาก!)

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

อีกประเด็นที่ไม่รู้เหมือนกันว่าทางผู้พัฒนาคิดไว้หรือเปล่า แต่ผมมองว่านี่เป็น Natural Language Processing ที่ใช้งานได้จริงและมาพบกันครึ่งทางระหว่างโปรแกรมกับผู้ใช้งาน โดยในฝั่งของโปรแกรมก็แทนที่จะต้องมาประมวลผลประโยคของมนุษย์ที่มีความหลากหลายมากมายมหาศาลก็เปลี่ยนเป็น input ที่รูปแบบค่อนข้างจะมีความแน่นอน ส่วนในฝั่งของผู้ใช้งานก็ใช้ "/" ที่น่าจะคุ้นเคยจากการใช้ tag มาบ้างแล้วเพื่อสั่งงานโปรแกรม แทนที่จะต้องมาจำข้อกำหนดที่ยุ่งยาก

แล้วก็คิดถึง Humanized ที่เหมือนจะคิด Enso ออกมาได้ "Ahead of Time" ไปเสียหน่อย

Solution for Home Button

อ่านเจอบล็อกของ Aza Raskin เรื่องปุ่ม Home ของโทรศัพท์มือถือแล้วน่าสนใจดี

สรุปสั้นๆ คือการออกแบบปุ่ม Home ของ iPhone หรือ Back ของ Android ยังคงสร้างความสับสนให้คนใช้อยู่โดยบน iPhone นั้นอาจเผลอกดปุ่ม Home ตอนที่อยากจะกลับมาหน้าแรกของแอพฯ ส่วนปุ่ม Back ของ Android ก็ไม่รู้จะ Back ไปไหน (แถมไม่มี Forward กลับไปเผื่อกดผิดอีกต่างหาก) ซึ่งส่วนใหญ่เกิดจากที่เราอยากกลับไปหน้าแรกของแอพฯเหมือนกันเลยน่าจะแบ่งปุ่ม Home ออกเป็น 2 ระดับ คือ ระดับ OS ที่กดแล้วกลับไปหน้า Home Screen ของโทรศัพท์ กับระดับแอพฯ ที่กลับไปหน้าแรกตอนที่เราเข้าแอพฯมาครั้งแรก

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

อาจเอามาใช้จริงไม่ได้แต่ถือว่าสร้างสรรค์มาก (น่าเสียดายที่จะไม่ได้อยู่เป็น Creative Lead ให้ Firefox แล้ว)

The Third Device

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

  • ปีหน้า (2011) คงเห็นแท็บเล็ตเปิดตัวกันเยอะ ที่น่าคิดต่อไม่ใช่ว่ามันจะออกมา "ยังไง" แต่คือมันจะอยู่ "ตรงไหน"
  • อย่างที่รู้กันคือแท็บเล็ตมันอยู่ "กึ่งกลาง" ระหว่างโทรศัพท์กับคอมพิวเตอร์ส่วนบุคคลพอดี คงไปแทนที่ใครตรงๆ ไม่ได้ (แต่ในอนาคตเป็นอีกเรื่องนึง)
  • เท่าที่จำความได้ ยุคที่มีอุปกรณ์ตัวใหม่เข้ามาในชีวิตก็คือการมาของโทรศัพท์มือถือ
  • มีโทรศัพท์บ้านกับสาธารณะอยู่แล้วแต่เราก็ยอมแบกมือถือกัน
  • เพราะถ้ามันคุ้มค่ากับสิ่งที่เสียไป เราก็ยอมแลก (เหตุผลเดียวที่เรายอมเจ็บปวดกับความรัก)
  • ฉะนั้นถ้ามองตามโมเดลของโทรศัพท์ คอมพิวเตอร์ส่วนบุคคล (รวมถึง Laptop) ก็จะกลายเป็นคอมพิวเตอร์ "บ้าน" ส่วนแท็บเล็ตก็จะกลายเป็นคอมพิวเตอร์ "มือถือ"
  • ทำให้แท็บเล็ตเป็นสิ่งที่ต้องมีเพิ่มจากคอมพิวเตอร์ส่วนบุคคลและโทรศัพท์มือถือ
  • คอมพิวเตอร์ส่วนบุคคลน่าจะมีการใช้ในงานที่เฉพาะทางมากขึ้น (ต้องการพลังประมวลผล ความเสถียร และ input ที่คล่องตัว)

แต่โลกเราเปลี่ยนแปลงด้วย the unexpected ฉะนั้นกรณีข้างบนจะไม่จริงถ้า

  • มีการคิดค้นช่องทาง input ข้อมูลที่แทนที่คีย์บอร์ดและเม้าส์ได้สิ้นเชิง หรือโปรแกรมต่างพากันปรับตัวให้ใช้งานบนหน้าจอสัมผัสได้หมด คอมพิวเตอร์ส่วนบุคคลจะไม่จำเป็นอีกต่อไป (แต่ก็อย่าลืมประเด็น Gollira Arm Syndrome)
  • เครือข่ายมีความเสถียรพอที่จะทำ VDO Call ได้ตลอดเวลา โทรศัพท์มือถืออาจจะลดความจำเป็นลงแล้วใช้แท็บเล็ตติดต่อกันแทน (ไม่ใช่เพราะสะดวกกว่าแต่เพราะจะได้ตัดของที่ต้องแบกเมื่ออยู่นอกบ้านไปได้ชิ้นนึง)
  • คอมพิวเตอร์ส่วนบุคคลเพิ่มความ mobility ได้มาก หรือโทรศัพท์มือถือเพิ่มพลังประมวลผล การแสดงผล และแบตเตอรี่ ได้มากพอ แท็บเล็ตก็จะอาจจะหายไป (ว่าแต่ไอ้พวกนั้นมันไม่เรียกว่าแท็บเล็ตเรอะ)

อาจไม่ตรงตามนี้เลย แต่คิดเล่นๆ ก็สนุกดี

Twitter for iPad

จากที่เคยเขียนถึง Tablet ไปก็พูดถึงเรื่องส่วนติดต่อผู้ใช้ซะส่วนใหญ่ พอดี Twitter ออก Twitter for iPad มา ได้ลองเล่นดูพบว่าส่วนของการออกแบบ UI ตรงกับที่เคยเขียนไว้เกี่ยวกับ gesture-based navigation ว่าต้องลดปุ่มลงและใช้การเคลื่อนไหวของนิ้วมือในการเรียกใช้ฟังก์ชั่นต่างๆ แทน ซึ่ง Twitter for iPad ทำส่วนนี้ออกมาได้ดีมากๆ จนน่าจะเป็นอีกหนึ่งมาตรฐานของการออกแบบ UI สำหรับ Tablet เลยก็ว่าได้ ส่วนที่น่าสนใจก็มีตามนี้

  • UI เป็นแบบ 3 column ฝั่งซ้ายเป็นเมนู ช่องกลางเป็นเนื้อหาที่มาจากการกดเมนู (เช่น timeline หรือ รายชื่อ list) และขวาสุดจะเป็นส่วนขยายของช่องกลางอีกที ทำให้ flow ของ information เรียงตัวจากซ้ายไปขวา เรียบง่ายไม่สับสน
  • สามารถลาก column ไปมาเพื่อปรับขนาดตามความสนใจต่อเนื้อหาใน column นั้นๆ ได้ สิ่งเล็กๆ น้อยๆ ที่คิดว่าเจ๋งคือเมนูในฝั่งซ้ายที่ตามปกติแล้วจะแสดงทั้งไอคอนและตัวอักษร แต่เราสามารถลาก column ไปทับบริเวณเมนูได้โดยไม่ทำให้บังเมนูทั้งหมดเพราะจะทับแค่ส่วนที่เป็นตัวอักษรเท่านั้น ส่วนที่เป็นไอคอนยังคงแสดงผลอยู่ ถือว่าจัดสรรพื้นที่ใช่สอยได้ฉลาดมาก
  • column กลางกับขวาจะสามารถซ้อนเป็น stack ทับกันไปได้เรื่อยๆ ตามแต่ข้อมูลที่เรากดดู เช่น ข้อมูลผู้ใช้ บทสนทนาในกรณีที่ใช้ reply to (เลิก rt เพื่อตอบกันเถอะนะ) และที่เจ๋งสุดคือแสดงผลเว็บได้เลยภายใน column จากลิงค์ที่มีคนทวีตมา
  • ใช้ multi-touch ได้น่าสนใจ เช่น กางนิ้วในลักษณะ pinch zoom บนทวีตแล้วจะแสดง user's profile ของเจ้าของทวีต หรือ ในกรณีที่ reply กันไปมาใช้สองนิ้วแตะที่ทวีตแล้วลากลงมาจะแสดงบทสนทนาให้เลย
  • ไม่รู้มีอันอื่นอีกไหม หลายอย่างก็เจออย่างไม่ตั้งใจเพราะส่วนใหญ่ไม่มีปุ่มมากำกับ (ยกเว้นหน้า user's profile กับ ตอนที่แสดงผลเว็บ ซึ่งก็ make sense ดี)

ปิดท้ายด้วยวีดีโอรีวิวที่หาได้จาก YouTube ละกัน

My Thought on Tablet Device

คิดเรื่องเกี่ยวกับ tablet มาระยะนึงแล้ว ช่วงนี้ได้ลองเล่นของจริงบ้างก็มีที่ไม่ตรงกับที่คิดไว้หรือคิดอะไรเพิ่มเติมได้อีกจำนวนนึง จดเก็บไว้หน่อยกันลืม

  • เหมาะกับการบริโภคข้อมูลมาก (บางคนใช้คำว่า "เสพย์สื่อ") ด้วยขนาดหน้าจอที่พอดี ไม่ใหญ่ไปจนน่ารำคาญหรือเล็กไปจนมองอะไรไม่เห็น (แต่ถ้าคิดประเด็นเรื่องความสะดวกในการพกพาเพิ่มเข้าไปขนาด 5" - 7" น่าจะกำลังดี) และการที่ไม่มี physical keyboard ทำให้ไม่มี distraction มาดึงความสนใจจากเนื้อหาที่กำลังรับ
  • เลยทำให้การป้อนข้อมูลเป็นปัญหาที่หลีกเลี่ยงไม่ได้ ถ้าใช้งานเล็กๆ น้อยๆ เช่น ค้าหาในกูเกิล หรืออัพเดตข้อความในเฟสบุ๊ค ก็ไม่เป็นปัญหาเท่าไหร แต่การพิมพ์รายงานเป็นเล่มบนจอสัมผัสคงไม่สนุกแน่ ถ้าจะนำมาใช้ทดแทนคอมพิวเตอร์ในแง่ของการ "ป้อนข้อมูล" แล้วคงต้องแก้ด้วยการรื้อแนวคิดการป้อนข้อมูลแบบเดิมด้วยคีย์บอร์ดแล้วไปใช้วิธีที่เหมาะสมกับสรีระร่างกายตอนใช้งานมากกว่า เช่น การสั่งงานด้วยเสียง (natural language processing มาแน่นอน) การใช้ปุ่มหรือผิวสัมผัสหลังตัวเครื่อง (มีหลายเจ้าเริ่มทำวิจัยแล้ว แต่บางคนยังเห็นว่ามันตลกและไร้สาระอยู่) ใช้เซนเซอร์ตรวจความเคลื่อนไหวจากภายนอก หรือกลับสู่เบสิคด้วยการใช้ดินสอเขียนบนหน้าจอเอา ฯลฯ (ยังคิดอย่างอื่นไม่ออก)
  • ซึ่งถ้าการป้อนข้อมูลทำได้ดี ตอบสนองรวดเร็ว ผลลัพธ์เชื่อถือได้ คงจะทำให้การบันทึกข้อมูลที่เราเพิ่งรู้ (ขอเรียกข้อตะกี้ว่าข้อมูลที่เรารู้อยู่แล้ว ซึ่งไม่ต้องการสื่อช่วยบันทึกที่ตอบสนองรวดเร็วนักเพราะข้อมูลยังคงอยู่ในความจำหรือสื่ออื่นๆ) เช่น หัวข้องานที่ต้องทำที่ได้ในระหว่างการประชุม ประเด็นที่อาจารย์สอนในคาบเรียน หรือความคิดต่างๆ ที่แล่นอยู่ในหัว ซึ่งล้วนต้องบันทึกให้เร็วพอก่อนที่ข้อมูลในความจำระยะสั้นจะหายไป มาบันทึกด้วยวิธีแบบดิจิทัลมากขึ้น แทนที่เครื่องมือที่ดีที่สุดอย่างดินสอและกระดาษในตอนนี้
  • (ซึ่งโดยส่วนตัวผมเองก็สงสัยในประเด็นของการเขียนด้วยดินสอว่าที่มันเร็วเนี่ยเพราะมันเป็นวิธีที่เหมาะสมที่สุดหรือเพราะเราชินกับมันมากที่สุด แต่ผมคงหาตัวอย่างทดลองที่บันทึกข้อมูลด้วยวิธีอื่นที่ไม่ใช่การเขียนมาตั้งแต่เกิดไม่ได้ในเร็ววันนี้)

  • ส่วนติดต่อผู้ใช้ที่ต้องค้นคว้าและออกแบบกันเพิ่มเติมอีก ที่จริงตอนแรกคิดว่าเอารูปแบบของ desktop มาใช้เลยก็ไม่น่ามีปัญหา แต่พอได้ลองใช้ tablet จริงๆ แล้วก็เข้าใจทันทีว่าทำไม Windows Tablet รุ่นที่ผ่านๆ มาถึงไม่รุ่งซะที (แต่ใน Windows 7 ก็ทำมารองรับระบบสัมผัสพอสมควรแล้วนะ) และ Ubuntu Netbook Remix นั้นมองการไกลขนาดไหน การมีพื้นที่ใช้สอยบนจอภาพแบบสัมผัสได้มากจนถึงระดับนึงจะทำให้มีแนวทางใหม่ๆ มากมายในการสร้างส่วนติดต่อกับผู้ใช้ ตอนนี้หลายเจ้าคงได้เรียนรู้ข้อดีข้อเสียจาก iPad ของแอปเปิลที่ออกตัวไปก่อนแล้ว
  • ระบบ navigation คงต้องลดการใช้ปุ่มลงและเพิ่มการใช้ gesture ให้มากขึ้นเพราะระยะห่างจากนิ้วมือผู้ใช้ถึงบริเวณต่างๆ นั้นเพิ่มขึ้นอย่างมีนัยยะสำคัญ และการจับอุปกรณ์อาจจะมีรูปแบบที่หลากหลาย การสร้าง "Menu ที่เรียกใช้ตรงไหนก็ได้" น่าจะเป็นทางออกที่ดีอันนึง
  • เกมที่บังคับด้วย virtual button บนหน้าจอคงจะน้อยลง เพราะขนาดหน้าจอที่ใหญ่ขึ้นทำให้เอานิ้วไปเล่นบนหน้าจอได้โดยไม่บดบังเนื้อหาเกินระดับที่ยอมรับได้ (เหมือนใช้ stylus บน Nintendo DS) แอบหวังลึกๆ ว่าจะมี remake ของเกม Black & White หรือเกมอารมณ์ประมาณนี้ออกมาให้เล่นนะ

ตอนนี้คิดประเด็นที่เป็นรูปเป็นร่างออกแค่นี้ หนทางที่มองไม่เห็นคงยังอีกยาวไกล

A common design of elevator buttons

เหตุเกิดเพราะไปขึ้นลิฟต์ต่างถิ่น

...

เวลาเราจะกดปุ่มในลิฟต์ที่ไม่เคยเข้า คงจะต้องเล็งกันก่อนนิดนึงว่า

  • แผงปุ่มกดอยู่ฝั่งไหน ลิฟต์ใหญ่พอทีจะมีทั้งสองฝั่งหรือเปล่า
  • ปุ่ม เปิด-ปิด ประตูอยู่เหนือหรือใต้แผงปุ่มเลขชั้น
  • ปุ่มเลขชั้นเรียงแบบไหน บนลงล่าง หรือ ล่างขึ้นบน
  • ถ้าแผงปุ่มเลขชั้นมีมากกว่าหนึ่งแถว เลขชั้นถัดไปจะอยู่ข้างๆ หรืออยู่ข้างบน
  • ฯลฯ

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

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

แต่สิ่งผมเห็นคือปุ่ม เปิด-ปิด ประตูยิ้มเยาะความคิดที่ตื้นเขินว่าทุกอย่างมันจะธรรมดาแบบนั้น เพราะไม่มีป้ายบอกไว้เลยว่าปุ่มไหนคือ เปิด หรือ ปิด ! (ผมไม่ได้สังเกตเลยตั้งแต่ตอนเข้ามา)

ความหวังที่จะไม่ต้องรอลิฟต์อีกนานโขของคนที่วิ่งมานั้นกำลังจะหายไปพร้อมกับภาพภายในลิฟต์ที่กำลังถูกหรี่ลงด้วยประตูอัตโนมัติ

จะด้วยความเคยชินหรืออะไรดลใจไม่ทราบได้ ผมเลือกกดปุ่มซ้ายในจังหวะที่ประตูงับตัวเองตัดขาดลิฟต์จากโลกภายนอก

และประตูก็เปิด

...

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

การดีไซน์ที่มันมีความเป็น "Common" มีประโยชน์เช่นนี้เอง