Home » Web Review » Recent Articles:

YouTube Redesign หน้าตาใหม่ของ YouTube ในรอบหลายปี

December 2, 2011 Design, Web Review Comments

วันนี้หากใครได้เข้าไปในเว็บของ YouTube.com จะพบว่า หน้าตาที่เราคุ้นเคยมาหลายปี บัดนี้ได้เปลี่ยนไปเสียแล้ว

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

การออกแบบ

การออกแบบในเชิงของ Look & Feel นั้น เว็บในเครือของ Google ทั้งหมดจะถูกปูทางด้วย Google Plus ไม่ว่าจะเป็นเรื่องของปุ่ม พื้น background สีเทาอ่อนเหล่านี้เป็นต้น

youtube icon

icon ด้านบนในช่อง URL ที่ถูกปรับ

นอกจากนี้ตัวโลโก้ของ YouTube เองก็ถูกปรับให้มีสีที่เข้มและมืดขึ้น ตัวอักษรที่ถูกปรับ font ขนาด และ สี ให้ดูสวยขึ้น รวมไปถึง icon ด้านบนในช่อง URL ก็ถูกปรับด้วยเช่นกัน

หน้าที่การทำงาน

หากพูดในเชิงหน้าที่การใช้งานแล้ว YouTube ดีไซน์ใหม่ได้เน้นไปให้ความสำคัญกับ “Channel” มากขึ้น สิ่งที่เพิ่มขึ้นมาคือ

แถบสีเทาเข้มด้านซ้ายมือที่รวม list ของ Channel ต่างๆที่เราได้เป็นสมาชิก ให้เราสามารถกดเลือกเพื่อให้คลิปวิดีโอใหม่ๆ ถูกแสดงผลในพื้นที่ตรงกลางที่ YouTube เรียกว่า “Homepage Feed”

แน่นอนว่าเราสามารถเพิ่มรายชื่อ Channel เองได้ YouTube ได้จัดให้มีปุ่มสีน้ำเงินโดดเด่นทางด้านซ้ายบนเขียนว่า “Add Channels” โดยการ Add Channels นั้นสามารถเลือกเพิ่มได้ทีเดียวมากมายหนึ่งช่อง ตั้งแต่เครือข่ายดังๆ อย่าง MTV, Sony, Warners จนไปถึงกลุ่ม review สินค้าที่ทำกันง่ายๆ หรือคลิปวิดีโอ How-To

 

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

youtube-facebook

หลายคนที่เห็นอาจสงสัยว่า ทำไมถึงเอา Facebook เข้ามาอยู่ในตำแหน่งที่โดดเด่นขนาดนี้ ในขณะที่ Google เองก็มีตัว Google Plus ที่กำลังโปรโมทอยู่ แต่เนื่องจาก Facebook เองนั้นเป็นชุมชนขนาดใหญ่ YouTube เองก็ใหญ่ แต่ Google Plus เอง ยังไม่ใหญ่พอ และนี่คืออีกทางหนึ่งที่จะทำให้คนจาก Facebook สามารถรู้จักกับ Google Plus ได้

ด้านการตลาด

การออกแบบดังที่กล่าวมา แน่นอนว่า YouTube ไม่ได้ออกแบบมามั่วๆ แต่ด้วยการค้นคว้าและวิจัยผ่านโครงการของ YouTube ที่มีชื่อว่า Cosmic Panda ทำให้การพัฒนาด้านการใช้งานของ YouTube เวอร์ชั่นใหม่ออกมาได้อย่างสมบูรณ์และตรงตามความต้องการมากขึ้น

โดยทั้งนี้ทาง YouTube เองคาดหวังว่า การออกแบบใหม่นี้จะเพิ่มให้คน “ติด” YouTube มากขึ้น ทำให้คนหันมาใช้เวลาอยู่กับ YouTube นานขึ้น จากเดิมประมาณ 15 นาที ต่อวัน ต่อคน และด้วยเวลาที่ใช้มากขึ้น นั่นแปลว่า เม็ดเงินที่ได้จากการโฆษณาก็มากขึ้นเช่นกัน (ข้อมูลจาก The Wall Street Journal: YouTube Redesigns Around ‘Channels’ Strategy – http://blogs.wsj.com/digits/2011/12/01/youtube-redesigns-around-channels-strategy/?mod=google_news_blog)

สรุป

การเปลี่ยนดีไซน์ครั้งใหญ่ที่สุดของ YouTube ที่เพิ่งจะเปิดตัวได้ไม่ถึง 1 วันเต็ม แต่เป็นที่สนใจยิ่งจากสื่อทั่วโลก ซึ่งก็ไม่น่าแปลกเพราะ YouTube เป็นเว็บไซต์ที่ให้บริการด้านวิดีโอที่ใหญ่ที่สุดในโลก โดยการปรับเปลี่ยนนั้นได้วางแผนมาอย่างดีทั้งในด้านความสวยงาม การใช้งาน และ การสร้าง brand awareness ให้เห็นถึงการไปด้วยกันกับบริษัทแม่อย่าง Google โดยทั้งหมดทั้งปวงนั้นไม่ได้เกิดจากไอเดียของทาง YouTube อย่งเดียวแต่ยังมีการค้นคว้าที่ให้ผุ้ใช้งานได้ร่วมแสดงความคิดเห็นกันมาเกือบ 1 ปี

นอกจากนี้การเปลี่ยนดีไซน์ไม่ได้มีผลเฉพาะกับเว็บไซต์ปกติเท่านั้น แต่หากเข้า YouTube ด้วย iPhone ก็จะเห็นการเปลี่ยนแปลงเช่นกัน และการเปลี่ยนแปลงใหม่นี้ แหล่งข่าวอย่าง Mashable บอกว่าจะช่วยให้การเข้าถึงคลิปวิดีโอของ YouTube ผ่านทาง XBox ได้ดีขึ้นอีกด้วย!

ของแบบนี้ต้องลองเข้าไปเล่นเองถึงจะรู้ว่า เปลี่ยนแปลงแล้วดีขึ้นหรือแย่ลงอย่างไร

กรรมการ Porar Awards

วันหนึ่ง ขณะที่กำลังไปเที่ยวเกาะช้างอยู่กับทีมงาน rgb72 เสียงเตือนแจ้งว่ามีอีเมล์ใหม่ก็ดังขึ้น

ผมเปิดดู เห็นอีเมล์ของเพื่อนที่รู้จักกันมาเกือบๆจะสิบปี คุณสุรัตน์เจ้าของ porar ผู้ให้บริการด้าน server รายใหญ่ที่สุดรายหนึ่งในประเทศ

แม้ผมจะรู้จักเค้ามานาน แต่ก็ยังคงเรียกเค้าว่า “คุณสุรัตน์” มาจนถึงทุกวันนี้ อาจจะเป็นเพราะครั้งแรกที่รู้จักกันนั้นผมอยู่ในฐานะลูกค้าแบบแบ่งเช่าพื้นที่ server

คุณสุรัตน์แจ้งมาว่า มีเรื่องรบกวน อยากให้เป็นกรรมการตัดสินผลงานเว็บไซต์ที่คิดว่าดีเลิศในด้านการออกแบบ ความสวยงาม การใช้งาน ความคิดสร้างสรรค์ และเรื่องการเขียน programming นิดหน่อย ซึ่งเหล่านี้ เป็นทางผมอยู่แล้วครับ เลยไม่ลังเลที่จะตอบกลับไป โดยในเนื้อความนั้นมีเขียนลงท้ายว่า เว็บทั้งหมดที่เข้าประกวดเป็นเว็บที่จับจองพื้นที่อยู่ใน server ของ porar และ porar นั้นต้องการทำเพื่อฉลองครบรอบ 10ปี ของบริษัท ดังนั้นจึงเรียกชื่อการประกวดครั้งนี้ว่า “Porar Awards

แจ่มไปเลย.. ผมคิด..

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

“ตายล่ะ” ผมคิด เพราะช่วงนี้งานเข้าอยู่ ยุ่งมากๆ ทำงานถึงตี4 ตี5 เป็นว่าเล่น แต่เป็นกรรมการตัดสินก็อยากจะเป็น ดังนั้นยังไงก็ต้องทำ

ไฟล์ excel แบ่งย่อยอีก 6 ช่อง เพื่อให้ลงคะแนน ซึ่งแต่ละช่องมีคำกำกับอยู่ด้านบนว่า
ความลงตัวของสี รูปภาพ ฟอนต์
การออกแบบและเลย์เอาต์
เอกลักษณ์ของเว็บและข้อความที่สื่อสาร
ความคิดสร้างสรรค์
เทคนิคและวิธีการเขียนโปรแกรม
คำแนะนำ

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

การให้คะแนนไม่ใช่เรื่องง่ายเลย ผมใช้เวลาถึง 4 คืนในการ review ทั้งหมด ซึ่งนั่นหมายถึงการทดสอบเว็บกับ browser อื่นๆ และ operating system อื่นเช่น Mac เป็นต้น

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

ที่น่าสนใจคือ หลังจากการให้คะแนนเสร็จสิ้น ผมได้เข้าไปดูรายชื่อกรรมการทั้งหมดที่เว็บไซต์ แล้วบังเอิญเจอชื่อ “พี่อั้ม” programmer ระดับพระกาฬ ที่ชอบแฮก แกะ แคะ นู่นนี่ไปเรื่อย เป็นหนึ่งในคณะกรรมการด้านความปลอดภัยของเว็บไซต์ พี่อั้มบอกว่า เว็บไซต์บางตัวได้คะแนนด้านความปลอดภัยไปแค่ 1 เต็ม10 !!

ผมตกใจแล้วก็คิดว่า หรือว่าพี่อั้มโหด??!!

พี่อั้มบอกว่า จะไม่ให้มันได้แค่ 1 คะแนนได้ไง ในเมื่อ username กับ password ที่ตั้งในการเข้าหน้า admin นั้นตั้งไว้ว่า username: admin, password: admin

ผมถึงกับเหงื่อตก

หลังจากการให้คะแนนผ่านไปแค่หนึ่งวัน ผมได้รับโทรศัพท์ SMS และ การทักทายทาง Facebook จากเพื่อนบริษัทต่างๆ

บางคนก็มาบอกว่า “ไม่บอกเลยว่าเป็นกรรมการจะได้บอกให้ใส่คะแนนเยอะๆหน่อย” บางคนก็บอกว่า “คุณเก่งน่าจะหักคะแนนบริษัทคู่แข่งไปเลย” ฮ่า ฮ่า ฮ่าาาา.. นึกแล้วขำ

ใจจริงน่ะอยาก แต่ว่าคงต้องรักษามาตรฐานไว้ก่อน เวลาเขียนคะแนนลงไปก็แค่กำปากกาแน่นจนปากกาแทบจะแหลกคามือก็เท่านั้นเอง

การได้เป็นกรรมการ Porar Awards ถือว่าเป็นเกียรติมากครับที่ได้รับเชิญจากคุณสุรัตน์ เหนื่อย แต่สนุกดี ได้เห็นงานดีดีแปลกๆ จากทั้งคนที่รู้จัก และไม่รู้จักมากหน้าหลายตา คิดว่าถ้ามีการเปิดเผยหน้าคนทำบ้างก็น่าจะสนุกดี

คิดแล้วอยากจะทำบ้าง อยากให้มีกลุ่ม web designer ในประเทศไทยอย่างจริงจังบ้าง ไหนๆพวก web programmer ก็มีแล้ว กลุ่ม online marketing ก็มี ว่าแล้วใครคิดเหมือนผม ผมว่าเรามาจัดตั้งกลุ่มกันหน่อยดีมั้ยครับ?

ปล. ตอนนี้ใครอยากจะเข้าไปร่วม Vote หาผู้ชนะที่เป็นสุดยอด สามารถทำได้แล้วนะครับ ง่ายๆ แค่เข้าไปในเว็บตาม link นี้ http://www.porar.com/awards2010.html จากนั้น กด “LIKE” หนึ่งที แค่นี้ก็เรียบร้อยแล้วครับ

Twitter.com interface ใหม่

September 15, 2010 Software, Tech, Web Review Comments

New Twitter

ประเด็นที่น่าสนใจสำหรับวันนี้คงหนีไม่พ้นเรื่อง หน้าตาใหม่ หรือ interface ใหม่ของ Twitter ที่ได้แอบ ออกมาเผยโฉมให้บุคคลทั่วไปอย่างเราๆได้ดูกันในรูปแบบของ video (สามารถดูได้จาก link นี้ : http://twitter.com/newtwitter)

จากภาพที่เห็นใน video พบว่า การทำใช้งาน twitter ผ่านเว็บของ twitter.com นั้นจะสามารถทำงานได้ง่ายขึ้น feature หลักคือความสามารถในการอ่านรายละเอียดของ user หรือการดู link ได้จากหน้าจอเดิม ไม่ต้องเปลี่ยนหน้า ซึ่งหากได้ดู App ของ iPad ตัวใหม่ที่ทาง Twitter เอง ออกมาให้ใช้ฟรีๆ นั้น จะพบว่ามีระบบการใช้งานที่เหมือนกันมาก

twitter ipad app

ภาพ Twitter app version iPad

โดยส่วนตัวแล้วผมชอบ interface ใหม่ของ Twitter version iPad นะครับ หลังจากที่ล่าสุดชื่นชอบ interface ของ Wired Magazine ที่หน้าปกเป็นรูป Toy Story แล้วก็ไม่พบว่าจะมี App ไหนที่ทำ interface ออกมาได้น่าสนใจ จนกระทั่งเจ้า Twitter ตัวใหม่นี่แหละ

wired for ipad

Wired Magazine สำหรับ iPad ที่พูดถึง

ขณะนี้เจ้า Twitter.com version ใหม่ เปิดให้ใช้ได้เฉพาะคนที่ถูกเชิญเท่านั้นครับ ยังเป็นช่วงทดลองอยู่ หากเปิดให้ใช้ได้จริงเมื่อไร่ คงน่าสนใจไม่น้อย

dribbble.com

September 4, 2010 Design, Web Review Comments

dribbble

ได้ยินชื่อเสียงมาพอสมควร สำหรับเว็บไซต์แนวคิดใหม่ที่ชื่อว่า dribbble.com (ผมพิมพ์ไม่ผิดครับ ตรงกลางมีตัว B 3 ตัว)ครั้งแรกจากแมกกาซีนที่อ่านอยู่ ครั้งนี้รับรู้ผ่านประเด็นเรื่อง icon ใหม่ของ itunes10 ที่มีดีไซน์เนอร์คนหนึ่งเขียนอีเมล์หา Steve Jobs ว่า icon ใหม่นั้น ดูไม่ได้เรื่องเลย จึงทำให้มีดีไซน์เนอร์อีกมากมายลองทำ icon สำหรับ itunes10 ขึ้นมาประชันโฉมกัน

เว็บไซต์ dribbble.com มี concept ที่น่าสนใจก็คือ เป็นเว็บไซต์สำหรับให้เหล่าดีไซน์เนอร์บอกผู้คนว่า ตัวเองกำลังออกแบบอะไรอยู่ จากนั้นก็ให้เพื่อนเข้ามา follow ได้ด้วย

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

แวะเวียนเข้าไปดู สิ่งที่ได้อีกอย่างคือ ได้เห็นงานสวยๆของดีไซน์เนอร์ทั่วโลกครับ

>รู้จัก TED

>

วันนี้จะแนะนำให้รู้จักกับเว็บไซต์หนึ่งที่มีชื่อว่า TED.com

TED ย่อมาจากคำว่า Technology, Entertainment, Design เป้นสถานที่ที่ใครก็ได้ที่อยากจะพูดอยากจะบอกอะไรเกี่ยวกับสิ่งที่ตัวเองได้ค้นพบ โดยที่ผ่านมาได้มีการจัดเป็นงาน conference เพื่อให้คนที่มีความรู้ได้เข้ามาพูด และคนที่ต้องการได้ความรู้ก็เข้ามาฟัง

ที่เว็บไซต์นี้จะมีการนำวิดีโอในงาน conference ที่ได้บันทึกไว้มาเผยแพร่ โดยมีการจัดเป็น categories เอาไว้ให้สามารถค้นหาได้ง่ายดาย ไม่ว่าจะเป็นกลุ่ม technology, entertainment, design, business, science, culture, arts และอื่นๆอีกมากมาย หรือเราจะค้นหาดูจากชื่อของคนพูดก็ได้

นอกจากนี้ยังมีการให้บริการด้านภาษาเพิ่มเข้ามาด้วย ในกรณีที่บางคนฟังไม่รู้เรื่อง สามารถเปิด sub ได้ อย่างไรก็ตาม sub ภาษาไทยในนี้มีไม่มากนัก ซึ่งสามารถเลือกดูได้จากเมนูที่เขียนว่า “Translations” จากนั้นก็สามารถเลือกดูภาษาไทยได้

เว็บนี้ให้ความรู้ต่างๆมากมาย ดังตัวอย่างที่จะ cap มาให้ดูนี้ เป็นตัวอย่างของนาย Johny Lee ที่เปลี่ยน remote ของเครื่อง Wii ให้กลายเป็น digital whiteboard

หรืออีกตัวอย่างหนึ่งคือ งานของกลุ่มนศ. MIT ที่คิด computer ที่เค้าเรียกกันว่า Six Sense… จะเป็นยังงัยลองดูกันได้ครับ

Search This Site:



rgb72 on Facebook

คำศัพท์ Internet วันละคำ

Air (คำที่เกี่ยวข้อง: Adobe, Flash, HTML, JavaScript)
– หนึ่งใน technology ที่พัฒนาโดย Adobe ซึ่งมีคุณสมบัติที่ช่วยให้นักพัฒนาสามารถสร้างโปรแกรมสำหรับคอมพิวเตอร์ได้ใช้เทคนิคเดียวกันกับการเขียน code สำหรับเว็บ ไม่ว่าจะเป็น HTML, JavaScript หรือ Flash โดยคำว่า AIR นั้นย่อมาจาก Adobe Integrated Runtime

72's Friends

Useful Links

rgb72


being72 คือหนังสือที่รวบรวมเรื่องราวความเป็น rgb72 บริษัทออกแบบเว็บไซต์ ตั้งแต่อดีตถึงปัจจุบัน โดยจัดทำเนื่องในโอกาสครบรอบ 10ปี

+ บทความจากผู้เขียน
+ ตอนที่1: Pre-rgb72 / ทำงานกับ Martha Stewart
+ ตอนที่2: Pre-rgb72 / Arcadian
+ ตอนที่3: Pre-rgb72 / ewit
+ ตอนที่4: เริ่มต้นอย่างเงียบๆ
+ ตอนที่5: Generation 1 (ยุคที่1:บุกเบิก) / เริ่มต้นที่ศูนย์
+ ตอนที่6: โทร โทร โทร...
+ ตอนที่7: นามบัตร
+ ตอนที่8: หนังสือพิมพ์และโทรทัศน์
+ ตอนที่9: MATCHING STUDIO
+ ตอนที่10: มีเงินที่ไหน ให้ไปที่นั่น
+ ตอนที่11: พนักงานคนแรก
+ ตอนที่12: ภาพแทรก ออฟฟิสที่สองของ rgb72
+ ตอนที่13: เพื่อนจาก ewit
+ ตอนที่14: GettyImages ฟ้องจริง ถึงจริง
+ ตอนที่15: เว็บไซต์ที่ทำแบบมากที่สุด
+ ตอนที่16: ความฝันที่ 1 พบชื่อลูกค้าทุกๆ ห้านาทีที่ขับรถ
+ ตอนที่17: สมุย.. สร้างเสร็จได้ในวันเดียว
+ ตอนที่18: ขึ้นศาล.. มันไม่สนุก
+ ตอนที่19: นักธุรกิจต่างชาติ
+ ตอนที่20: ความฝันที่ 2 เที่ยวต่างประเทศ
+ ตอนที่21: Super AE
+ ตอนที่22: สินบน
+ ตอนที่23: ผู้หญิงที่ผมไม่รับ
+ ตอนที่24: งานที่คุณไม่ได้ดู
+ ตอนที่25: นักออกแบบ
+ ตอนที่26: คู่แข่งที่รัก
+ ตอนที่27: เซียนหลังกระดานหุ้น ตอนที่ 1/2
+ ตอนที่27: เซียนหลังกระดานหุ้น ตอนที่ 2/2
+ ตอนแทรก: หาาา?... อะไรนะ!!??
+ ตอนที่28: ยิ่งให้... ยิ่งได้
+ ตอนที่ 29: Wall of Frames
+ ตอนที่ 30: ผี 72
+ ตอนที่ 31: เพื่อนจากตะวันออกกลาง
+ ตอนที่ 32: Photography
+ ตอนที่ 33: Too Far from the Dream





Recent Comments

Powered by Disqus