top of page

Design new functions: Google meet
(Case study)

Google meet Redesign (11)_edited.jpg

Overview

Objective - เป็น Project ที่เริ่มขึ้นจากการที่ได้ใช้ Google meet เพื่อเรียนในช่วง Covid-19 ที่ผ่านมา ทำให้ผมได้เห็นถึงจุดด้อยบางอย่างที่ Google meet ไม่สามารถตอบสนอง User ได้ หรือเป็นสิ่งที่ไม่มี
ทั้ง ๆ ที่เป็นจุดสำคัญ

My role - Project นี้เป็น Case study ที่ผมสร้างขึ้นเพราะเห็นถึงปัญหาเหล่านี้ งานทั้งหมดนี้จึงเป็น
ฝีีมือของผมทั้งหมด

‍Challenge - จะปรับปรุงยังไงให้สามารถตอบสนองความต้องการของ User ได้ แล้วจะต้องใช้งานง่าย และสวยงาม

‍Final product showcase  - New design of google meet

Research

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

Observe - เป็นการ research โดยการสังเกตจากพฤติกรรมของผู้ใช้ในระหว่างที่ผมเรียนออนไลน์ผ่าน Google meet

Internet searching - เป็นการ research ผ่านทาง internet โดยจะรวบรวมปัญหาที่ผู้ใช้ส่วนใหญ่ติ หรือบ่นกันบนรีวิวของ Play store 

User inquiry - ทำโดยการสัมภาษณ์ผู้ใช้งาน โดยจะถามถึงปัญหาที่เกิดจากการใช้ google meet และสิ่งที่ต้องการเพิ่มเติมเพื่อทำให้การใช้ Google meet นั้นง่าย และมีประสิทธิภาพมากขึ้น

Observe

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

     ซึ่งจากการที่ผมได้สังเกตพฤติกรรมของอาจารย์ และเพื่อนร่วมคลาสเรียนของผมแล้ว ก็จะมีปัญหาการใช้งาน Google meet ดังนี้

1.การไม่อยู่จอของผู้ใช้ โดยไม่ได้แจ้งให้คนอื่นทราบ

2.การที่ไม่ทราบชื่อคนที่พูดเนื่องจากไม่ได้เปิดแท็บ Google meet อยู่

3.การต้องการจะไปทำธุระ แต่ไม่มีช่องทางบอกแบบไม่ขัดการประชุม

4.ต้องเข้า Google classroom ก่อน เพราะไปเอารหัส Meeting

Internet searching

Internet searching เป็นการ research ที่เหมาะสำหรับการทำ case study มาก เนื่องจากเรายังไม่มีกลุ่มผู้ใช้ที่จะสัมภาษณ์ชัดเจน โดยวิธีการของมันก็มีอยู่มากมาย ทั้งการหาประเภทของผู้ใช้, ข้อได้เปรียบเสียเปรียบของแต่ละ product หรือการหา feedback จากรีวิวของผู้ใช้

     ซึ่งในส่วนนี้ผมก็ได้ใช้การหา feedback จากบน Play store ของ Google meet โดยจะนำรีวิวที่เป็นสิ่งที่เห็นบ่อย ๆ และเป็นรีวิวที่เป็นข้อเสียจากการใช้งาน หรือความต้องการของผู้ใช้ โดยจะมีปัญหา และความต้องการดังนี้

1.กล้องปิดเอง ทำให้โดนอาจารย์ตำหนิ

2.อยากให้สามารถปรับเสียงรายคนได้

3.เวลาไมค์มีปัญหา แล้วพิมพ์ไป ถ้าอาจารย์ไม่เปิด Chat ดู หรือไม่มีคนบอกให้ก็จะไม่มีคนรู้

4.ไม่มีที่จำรหัส meeting ทำให้ใช้เวลานานกว่าจะได้เข้า meeting

User inquiry

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

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

1.รู้สึกรำคาญเวลาต้องเห็นอาจารย์ เรียกชื่อคนซ้ำ แล้วคนนั้นไม่อยู่

2.อยากให้มีอะไรก็ได้ที่จะทำให้ไม่ต้องเปิดไมค์บอกอาจารย์ตอนจะไม่อยู่จอ เพราะไม่อยากขัดการเรียน

3.อยากให้มีปุ่มเปิดไมค์ตอนไม่ได้เปิดแท็บ

4.รหัส Meet ชอบหายเวลาจะเข้าเรียน

5.แชร์ได้แค่ทีละหน้าจอ ถ้าจะให้คนอื่นแชร์ต้องยกเลิกการแชร์ของเราก่อน

How To Fix?

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

1.แถบสมาชิกผู้ร่วมประชุมที่จะออกมาเมื่อไม่ได้เปิดแท็บ Google meet

2.ปุ่่มไม่อยู่จอ

3.featuer เพิ่ม/ลด เสียงรายบุคคล

4.Memo meeting

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

Problem

ในส่วนขั้นตอนนี้ ผมจะทำการแยก feedback ของผู้ใช้ที่เราได้รับมาจาก Research มาทำการวิเคราะห์ว่าปัญหาที่แท้จริงของมัน เกิดขึ้นจากอะไร เช่น ไม่มี feature ที่ตอบสนองความต้องการของผู้ใช้ได้ หรือมันเป็นปัญหาทางเทคโนโลยี ตัวเราไม่สามารถแก้ไขมันได้ เป็นต้น

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

Sketches

Google meet Redesign (7)_edited.jpg

Meeting member bar

Memo meeting feature

Working
Principle

Meeting member bar

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

     เพื่อจะแก้ปัญหาเหล่านี้ ผมจึงได้สร้าง Meeting member bar ขึ้นมาเพื่อให้อาจารย์สามารถดูได้ว่า ใครกำลัง interact กับอาจารย์อยู่ 

โดยตัว Meeting member bar จะเป็นแถบที่ขึ้นอยู่ข้าง ๆ เมื่อเราทำการย่อหน้า Google meet ลง 

ซึ่งส่วนประกอบของ Meeting member bar ก็จะประกอบด้วย 3 ส่วน
1. Moving bar zone -
เป็นส่วนบนสุดของตัว Meeting member bar โดยมันจะมีไว้ลากตัว Meeting member bar ของเราไปไว้ตรงจุดที่เราต้องการเผื่อตรงตำแหน่ง default จะไปบังอะไร
2. Member zone - เป็นโซนที่จะแสดงรูปภาพของสมาชิกในการประชุมนี้ โดยมันจะมีไว้แสดงสถานะต่าง ๆ เมื่อสมาชิกมีการ interact เช่น การเปิดไมค์ เป็นต้น
3. Button zone - เป็นส่วนล่างสุดของ Meeting member bar โดยจะประกอบไปด้วย 2 ปุ่่มคือ ปุ่่มเปิดไมค์ และHamburger button ที่รวมปุ่่มอื่น ๆ ที่ใช้ในการ interact


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

ตัวอย่าง สัญลักษณ์เมื่อเรา interact

เมื่อเราทำการกด hamburger button ก็จะมีสิ่งที่เราจะสามารถ interact ได้ทั้งหมด 4 อย่าง คือ
1. Chat
2. Video camera
3. Raise your hand
4. Out of screen

ซึ่งเมื่อเราทำการเปิดมันขึ้นมา หากเราไม่ได้ทำการใช้ feature อะไรอยู่ มันก็จะขึ้นสถานะ off แต่หากเราเปิดใช้อยู่ มันก็จะขึ้นสถานะ on และเป็นเลนสีทึบ

เริ่มต้นด้วย Chat 
หากเราทำการเลือก chat ก็จะมี text box ขึ้นมาข้าง ๆ กับตัว Meeting member bar เพื่อให้เราพิมพ์ข้อความ ซึ่งก็เป็น feature ที่มีเดิมอยู่แล้วของ Google meet แต่เพื่อให้ไม่ต้องสลับแท็บไปมา หากกำลังใช้แท๊บ หรือโปรแกรมอื่นอยู่ ผมจึงได้นำมาใส่ใน Humburger bar

และเมื่อเราทำการส่งข้อความ ก็จะมี message box เด้งขึ้นมาข้าง ๆ กับ Meeting member bar โดยจะมี Gmail name อยู่ด้านบน และข้อความที่พิมพ์ไปด้านล่าง 

     โดยตัว feature นี้จะทำให้เราสามารถรับรู้ได้ตลอดเวลาว่าใครส่งข้อความอะไรมา

ตัวต่อมาคือ Video camera

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

Raise your hand

ปุ่่มยกมือเป็น feature ดั้งเดิมของ Google meet ที่เหมาะสมมากกับการเรียนการสอน หรือการประชุม แต่ว่าปัญหาของมันก็คือ หากต้องการที่จะดูว่าใครเป็นคนยกมือก็ต้องเปิดหน้า Google meet ถึงจะเห็น

11_edited.jpg

การที่จะทำให้มันแสดงขึ้นที่ Meeting member bar จึงเป็นสิ่งที่ตอบโจทย์เป็นอย่างมาก เพื่อให้การสอน หรือการประชุมนั้นเป็นไปได้อย่างลื่นไหล

สุดท้าย Out of screen

ในส่วน feature นี้เป็นสิ่งที่ผมสร้างขึ้นมาเองเพื่อตอบสนอง และแก้ไขสิ่งที่ Google meet นั้นขาดไป ก็คือการต้องการที่จะไม่อยู่จอนั่นเอง

หากต้องการจะดูการสร้างแบบระเอียดสามารถคลิกที่นี้ได้เลย "ปุ่่มไม่อยู่จอ" Google meet

13_edited.jpg

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

User volume

สำหรับ application ที่มีเสียงจากหลากหลายผู้ใช้มารวมกันอยู่ที่เดียว การที่สามารถปรับเสียงได้เป็นรายบุคคลถือเป็นสิ่งที่จำเป็นเป็นอย่างมาก เพราะแต่ละผู้ใช้ ก็ใช้ก็มีค่า default ของไมค์แตกต่างกัน ยกตัวอย่างเช่น Discord จะมี feature ที่เราสามารถปรับ volume ไมค์ของผู้ใช้รายคนได้
แต่ Google meet นั้นไม่มี

Thank you for the photo. Photo by D on Discord support

เพื่อเป็นการตอบสนองความต้องการของผู้ใช้ในจุดนั้น ผมจึงได้ทำการสร้าง User volume feature ขึ้นมา โดยได้อิงการทำงานคล้าย ๆ กับของ Discord

ตัวอย่าง User volume

Memo meeting

Feature นี้เป็นสิ่งที่ผมคิดขึ้นมาเพื่อแก้ปัญหาของผู้ใช้หลาย ๆ คนที่ผมได้สังเกต และสัมภาษณ์ โดยปัญหานั้นก็คือ การที่เราต้องจด หรือเข้า Google classroom ก่อนเพื่อไปเอารหัสเข้า meeting ทำให้เราต้องเสียเวลาประมาณ 2-3 นาทีกว่าที่จะได้เข้า meeting 1 ครั้ง ทั้ง ๆ ที่มันก็เป็นห้องเดิม รหัสเดิมทุกสัปดาห์
     โดย feature นี้ก็จะทำงานเหมือนกับชื่อของมันเลย คือการจดรหัส meet ที่เราเข้าประจำไว้ เพื่อให้การเข้าครั้งต่อไปสะดวก และรวดเร็วยิ่งขึ้น

Memo meeting นั้นจะเป็น feature ที่อยู่ที่หน้าแรกของ Google meet โดยจะอยู่บนมุมขวาใกล้ ๆ กับ options อื่น ๆ ของ Google meet เพื่อให้เป็น Design system เดียวกัน

ตัวอย่าง Memo meeting

Google meet Redesign (2).png

ตัวอย่าง หากใส่ข้อมูลไม่ครบ

14_edited.jpg

โดยหากเราทำการคลิกที่รูปของเพื่อนร่วมประชุมของเราบน Meeting member bar ก็จะมีแถบของผู้ใช้ขึ้นมา โดยจะมีข้อมูลคือ รูป, Gmail name, Gmail account และ User volume ซึ่งเราสามารถปรับเสียงไมค์ของผู้ใช้รายคนได้จากตรงนี้เลย

ซึ่งหากเราทำการคลิก ก็จะมี pop-up ของ Memo meeting ขึ้นมาให้เราสามารถเลือกเข้าได้ตามลิงค์ที่เราได้บันทึกไว้ 

     ซึ่งในหน้า Memo meeting นี้จะมี 3 จุดที่เราสามารถ interacti ได้ คือ

 

1. Meeting name - จะเป็นชื่อที่เราตั้งไว้ให้กับรหัส meeting นั้น ๆ โดยเราจะสามารถคลิกที่ชื่อเพื่อไปที่ meeting นั้น ๆ ได้เลย

2. Added meeting button - เป็นปุ่่มที่เป็นเครื่องหมาย + ใช้เพื่อเพิ่ม meeting ใหม่ ๆ ที่เราต้องการบันทึก

3. Button zone - เป็นโซนปุ่่มข้างหลัง meeting name มีไว้เพื่อ interact ต่าง ๆ ซึ่งจะประกอบด้วย edit, copy และ remove 

Copy of 02_edited.jpg

หากเราคลิกที่ปุ่่ม + เพื่อมเพิ่ม meeting มันก็จะมี pop-up เด้งขึ้นตรงการ โดยข้อมูลที่เราจะต้องใส่ก็จะประกอบด้วย 2 ส่วน คือ Meeting name และ Code meeting จากนั้นให้เรากดปุ่่ม Accept เพื่อทำการเพิ่ม meeting ใหม่ของเราใน Memo

Copy of 03_edited.jpg
Copy of 05_edited.jpg

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

Final layout

Clickable Prototype

Figjam mmb.png

Figjam - ดูการขั้นตอนการคิด

Figma mmb.png

Figma - ดูผลงาน (Meeting member bar)

14_edited.jpg

ลองเล่น Feature (Meeting member bar)

Figma mm.png

Figma - ดูผลงาน (Memo meeting)

Copy of 05.png

ลองเล่น Feature (Meeting member bar)

bottom of page