เคยเขียนเรื่อง อนาคตของโปรแกรมนำเสนอ ใต้โครงการ OpenOffice Renaissance ที่เปิดให้แฟนๆ ทางบ้านลองเสนอไอเดียว่า โปรแกรม OpenOffice Impress ควรปรับปรุงหน้าตาอย่างไร หลังจากเปิดรับไปเรียบร้อย ทีมงานของ Sun ได้นำไอเดียมาคัดเลือกและยำออกมาเป็นต้นแบบของ UI ใหม่ของ OOo ทั้งชุด (ไม่ใช่เฉพาะ Impress) ได้ออกมาหน้าตาแบบนี้

หน้าตาเหมือน Ribbon ของ Office 2007 ไหมครับ ผมว่าด้วยฟังก์ชันและข้อจำกัดของโปรแกรม มันคงไม่หนีจากนี้มาก

โปรแกรมข้างต้นมีเดโมให้ลองเล่น (เป็น Java ใหญ่มากประมาณร้อยกว่าเมก ผมยังไม่ได้ลอง) และใครอยากคอมเมนต์อะไรก็ตามสะดวกที่บล็อกของโครงการ Renaissance

ทางทีมของ OOo ยังได้เปรียบเทียบคุณสมบัติทาง UI ของโปรแกรมนำเสนอต่างๆ ในท้องตลาด เช่น PowerPoint (2010/2008), Keynote, Google Docs และ Zoho Office ใครสนใจอ่านเล่นๆ ได้ที่ Competitor Analysis

รอกันมานานครับสำหรับหน้าโฮมเพจใหม่ของ Yahoo! ในที่สุดวันนี้ก็มีการเปิดให้ทดลองใช้กันแล้ว (ยังไม่ทราบว่าจะเปลี่ยน 'บังคับ' มาให้ใช้จริงเมื่อไหร่นะครับ) ที่สังเกตได้อย่างแรกเลยคือมี white space เพิ่มขึ้น และมีความสามารถในการนำโมดูลต่างๆ มาใส่ในหน้าโฮมเพจของเรา (โมดูลจากใน Yahoo! เอง หรือจากเว็บไซต์ภายนอกอย่าง Twitter, Facebook ก็ได้) ดูรวมๆ แล้วความตั้งใจในการเปลี่ยนหน้าโฮมเพจครั้งนี้ Yahoo! คงต้องการเป็นหน้า "โฮม" ของผู้ใช้จริงๆ เรียกว่าเที่ยวเว็บเดียวไม่ต้องไปเว็บอื่นกันเลย

จุดหนึ่งที่ผมชอบมากในการเปลี่ยนแปลงหน้าโฮมเพจครั้งนี้ คือทาง Yahoo! ได้ปล่อยคลิปสั้นๆ เกี่ยวกับความคิดเบื้องหลังในการรีดีไซน์ออกมาด้วย โดยให้โปรแกรมเมอร์และวิศวกรต่างๆ มาพูดถึงหน้าที่ของตัวเอง แต่อย่างที่รู้ๆ กันครับ ว่าถ้าให้พูดอย่างเดียว คนทั่วไปก็คงไม่เข้าใจเท่าไหร่ เพราะไม่ใช่เนิร์ดไม่ใช่กี๊ก ในคลิปวิดีโอเลยมีตัวอักษรขึ้น (คล้ายๆ ซับไตเติล) และเรียกว่า Close Caption for Nerd-impair (คล้ายๆ Hearing-Impair) ด้วย ลองดูกันครับ

วันนี้เข้าเว็บโรงหนังเจ้าหนึ่ง ปรากฏว่าเป็นรูปดั่งด้านบน คาดว่ารูปของ Splash Page โหลดไม่ติด อะ ไม่เป็นไร เราพยายามหาลิงค์เข้าไปหน้าหลักเองก็ได้ แต่กลับต้องงง เพราะสิ่งที่ควรจะเป็นลิงค์ กลับเป็นอย่างด้านล่างนี้

เราจะเช็ครอบหนัง ก็ลองคลิกที่ "รอบฉาย" ก็แล้ว "รอบหนัง" ก็แล้ว ไม่ปรากฏสิ่งใดๆ พอ view source ดูจึงรู้ว่า้เป็น Title ของ img ซึ่งพยายามหวังผลทาง SEO แบบผิดๆ อีกแล้ว (ใช้คำหว่านแบบ ดูหนัง หนัง ตัวอย่างหนัง หนังตัวอย่าง รอบฉาย จองตั๋วหนัง รอบหนัง ภาพยนตร์ฯลฯ)

อนึ่ง ทำไมเว็บโรงหนังของไทยทุกโรงต้องมีั Splash Page และซ่อนลิงค์เข้าหน้าหลักให้หายากๆ (เช่น เมเจอร์ ก็จะเป็น Flash ซึ่งถ้าใช้เบราเซอร์ที่ไม่มี flash ก็จะเข้าหน้าหลักไม่ได้ - ล่าสุดเพิ่งมีปุ่ม Skip Intro จึงดีขึ้นมาหน่อย, ส่วนเว็บ SF ถ้าโหลดไม่ติดก็จะเป็นอย่างด้านบน ส่วนถ้าโหลดติด คำว่า "Enter Site: เข้าสู่หน้าหลัก" ก็เป็นรูปซะอย่างนั้น แถมไม่ใส่ Title ด้วย (ในขณะที่ส่วนอื่นๆ ที่ไม่จำเป็น ใส่ Title อย่างครบถ้วนและยืดยาว))

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

ความห่วยแตกของเว็บโรงหนัง #1: Title

พอดีไปเจอบทความที่เฉลยฟอนต์ในโลโก้ของเว็บดังๆ มา (ส่วนใหญ่จะไม่รู้จักชื่อ) เลยมาโพสท์ลิงค์สั้นๆ ครับผม (เผื่อจะหนีไปจาก Helvetica, Arial, ...) ได้ :p

Fonts Used In Logos of Popular Websites

Twitter เพิ่งปรับปรุงเปลี่ยนแปลงหน้าแรก หลังจากใช้แบบเดิมๆ มาเป็นเวลานานครับ โดยการปรับปรุงครั้งนี้ มีผู้สังเกตุว่า เป็นการผลักดันให้ผู้คนใช้ Twitter เพื่อการอัพเดทข่าวสาร - ไม่เฉพาะข่าวสารของตัวเอง - แต่เพื่อรับข่าวสารรอบโลกด้วย โดยจะสังเกตได้จากการที่นำ Trending Topics จำนวนมาก (20 กว่าหัวข้อ) มาแสดง พร้อมๆ กับคำโปรยที่เปลี่ยนไป

จากเดิม โปรยว่า "Twitter is a service for friends, family, and co-workers to communicate and stay connected through the exchange of quick, frequent answers to one simple question: What are you doing?" (ทวิตเตอร์เป็นบริการสำหรับกลุ่มเพื่อน ครอบครัว และผู้ร่วมงาน ที่จะติดต่อสื่อสารกันผ่านข้อความสั้นๆ ซึ่งเป็นคำตอบของคำถามง่ายๆว่า : คุณกำลังทำอะไรอยู่)

ส่วนคำโปรยใหม่ ก็แสดงให้เห็นถึงภารกิจมิชชั่นใหม่, ซึ่งถ้าเอาตามที่นักข่าวของ Mashable บอกไว้ ก็คือทวิตเตอร์อยากจะเป็น "World's Water Cooler" (ที่ที่พนักงานชอบหลบไปคุย อัพเดท เม้าท์ข่าวกัน หรืออู้งานกันนั่นแหละครับ), โดยเปลี่ยนคำโปรยเป็น

“Share and discover what’s happening right now, anywhere in the world” (แชร์และค้นพบว่าตอนนี้มีอะไรเกิดขึ้นบ้างทั่วโลก)

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

บทวิเคราะห์จาก Mashable

หลังจากที่คุณ mk พูดถึงคอนเซ็ปท์ที่ทาง Mozilla Team วางไว้สำหรับอินเตอร์เฟสของ Firefox ยุคหน้า (4.0 - ซึ่งกว่าจะได้เห็นจริงๆ ก็อีกนาน) วันนี้มีภาพ mock up ออกมาเพิ่มเติมครับ ดูจากภาพแล้วยังคงเห็นความไม่แน่ใจของทีมออกแบบ ว่าจะนำแท็บขึ้นมาข้างบน (รวมกับ Title bar) หรือว่าจะปล่อยไว้ข้างล่างเหมือนเดิมดี และนอกจากนั้นยังมีคอนเซปท์ในเรื่องการรวมปุ่ม Go, Stop, Refresh เป็นปุ่มเดียวกันด้วยครับ

อันนี้เป็นแบบเดิมครับ คือแท็บอยู่แยกจาก title bar

ส่วนแบบนี้เป็นแบบรวมกัน เหมือน Chrome

Read the rest of this entry »

ด้วยความกังวลว่าผู้ใช้ใหม่จะเข้าไม่ถึง "วัฒนธรรม" ของทวิตเตอร์ (หลายๆ คนก็คงเคยต้องอธิบายกับเพื่อนๆ ที่เล่นทวิตเตอร์ใหม่ๆ ว่า RT คืออะไร @ คืออะไร Hashtag คืออะไร) วันนี้ทวิตเตอร์เลยเปิดหลักสูตร Twitter 101 เพื่อสอนผู้ใช้เหล่านั้นแล้วครับ

ในหน้า Twitter 101 จะมีสอนตั้งแต่เริ่มต้น (Getting Started), ภาษาทวิตๆ (Learn the Lingo), Best Practice แล้วก็มียกตัวอย่าง Case Study ที่ใช้ทวิตในธุรกิจจนประสบความสำเร็จด้วยครับ

การทำ help ในลักษณะนี้ ผมคิดว่าจะมีคนอ่านมากกว่า help แบบเดิมๆ [กด F1] เยอะ เพราะว่ามันดูสนุก อ่านง่าย เข้าใจเร็ว ฝั่งคนทำก็ไม่ต้องใช้เวลานานด้วย ได้ประโยชน์หลายสถานจริง!

Twitter 101

โดยคุณ อธิคม อัศวานันท์ กรรมการผู้จัดการบริษัท Intersteps และ Marketing Director บริษัท Midas Creative ในเครือ JSL

ยกมาเฉพาะส่วนต้นๆ ที่เหลืออ่านต่อกันเองน่อ

“การทำ Usability Design ทำให้งานออกมาไม่สวย หรือไม่ตรง Brand” ซึ่งก็เป็นหัวข้อที่คงต้องถกกันไปอีกพักหนึ่ง เพราะถ้ามองในฐานะ User การที่เราจะเข้ามาใช้บริการหรือหาข้อมูลบน Web เราอยากจะให้ข้อมูลหาง่าย และไม่ซับซ้อน หรืออยากเห็น Graphic สวยๆ แต่หาข้อมูลอะไรไม่เจอเลย

สมัยที่ผมยังเรียนหนังสืออยู่ในต่างประเทศ User Experience ยังเป็นสิ่งที่ในตลาดยังไม่ให้ความสำคัญนัก แต่มีอาจารย์อยู่ท่านหนึ่งที่สนใจ และให้ความสำคัญมากเกี่ยวกับการทำ Usability Design โดยใน Class ที่สอน ท่านจะไม่ยอมให้นักเรียนใช้ Computer ในการออกแบบ website เลย จนกว่าจะออกแบบ Architecture วางโครงสร้าง และ Navigation ของ website ให้เสร็จ แล้วให้ทั้งชั้นเรียนทดสอบวิธีการใช้อย่างละเอียดให้เรียบร้อยก่อน ว่าใช้ได้ง่ายจริง และตรงตามจิตวิทยาของผู้ใช้

ในช่วงแรกก็มีนักเรียนหลายคนที่ไม่เห็นด้วยกับหลักคิดและต่อต้าน แต่ภายหลังจากเรียนกับอาจารย์ท่านนี้ ทำให้พวกเราส่วนใหญ่เริ่มเห็นด้วยว่าการออกแบบ website หรือระบบต่างๆ ถ้าผลออกมาแล้วใช้ยากและซับซ้อนเกินไป หรือไม่ตอบโจทย์การทำงานทั้งหมด ถือว่ากระบวนการทำงานนั้นๆ เปล่าประโยชน์ โดยปัจจุบัน อาจารย์ท่านนี้ได้เปิดบริษัทของตัวเอง และเป็นคนออกแบบ User Experience ให้กับ website ในเครือของ CNN รวมถึงบริษัทยักษ์ใหญ่หลายแห่ง และเพื่อนร่วมชั้นหลายๆ คน ก็เป็น User Experience Designer ให้กับบริษัทชั้นนำ อย่าง Sony Play Station, Fox News and Apple

Stephen Horlander ทีมออกแบบของ Mozilla ได้ลองออกแบบ UI ใหม่สำหรับ Firefox 3.7 (เปลี่ยนเล็กน้อย) และ Firefox 4.0 (เปลี่ยนเยอะเยอะ) เอามาให้ดูเล่นแก้เบื่อครับ UI ทั้งหมดยังเป็นแค่ wireframe mockup นะ ทั้งหมดเป็น UI ของวินโดวส์

Firefox 3.7 เปลี่ยนเล็กน้อย ปรับโน่นนี่นั่น

ของเวอร์ชัน 3.7 มีแบบ mockup สวยๆ แล้ว 3.7 Windows Theme Mockup (ข่าวที่ Mashable, Blognone)

ของ Firefox 4.0 จะเปลี่ยนเยอะหน่อย เอาแท็บไปไว้ด้านบนแบบเดียวกับ Chrome

ที่มา - Firefox Wiki

เคยเขียนเรื่อง ผลการประกวด Mozilla Labs Design Challenge Spring 09 ไปแล้ว คราวนี้เป็นผลการประกวดรอบ Summer 09 ในหัวข้อให้ออกแบบระบบ Tab แบบใหม่ให้ Firefox ครับ

รางวัลชนะเลิศแบ่งเป็น 5 หมวด ผมคัดที่ชอบมา 3 อันละกัน

Read the rest of this entry »