• ภาษาภาพของแอป Gemini ถูกออกแบบมาเพื่อให้ผู้ใช้เข้าใจและเชื่อมั่นในความสามารถของ AI Assistant ที่พัฒนาอย่างต่อเนื่องได้อย่างเป็นธรรมชาติ
  • เพื่อช่วยให้ผู้ใช้เข้าใจและไว้วางใจ AI จึงกำหนดเป้าหมายหลักไว้ที่ ความเป็นธรรมชาติ การดื่มด่ำ ความเป็นมิตร และความน่าเชื่อถือ
  • การไล่เฉดสี รูปทรงที่อิงกับวงกลม และโมชั่นที่มีเจตนา ถูกผสานเข้าด้วยกันเพื่อถ่ายทอดกระบวนการคิดและพลังงานของ Gemini ในเชิงภาพ
  • โดยอิงจาก โลโก้และมรดกด้านการออกแบบ Material ของ Google จึงสร้างระบบภาพแบบใหม่ที่ทั้งคุ้นเคยและลื่นไหล
  • ผ่าน การเคลื่อนไหวและการเปลี่ยนแปลงของสี ระบบจะแสดงให้เห็นกระบวนการที่ Gemini คิดและตอบสนอง พร้อมเสริมความรู้สึกว่าผู้ใช้กำลังทำงานร่วมกับระบบ
  • แนวทางนี้คือ โมเดลการออกแบบที่เชื่อมปฏิสัมพันธ์ระหว่าง AI กับมนุษย์ให้ลื่นไหลและน่าเชื่อถือ และชี้ทิศทางของอินเทอร์เฟซแบบวิวัฒนาการในอนาคต

การสำรวจเชิงภาพของแอป Gemini

  • Gemini เป็น AI Assistant ที่เรียนรู้และปรับตัวอย่างต่อเนื่อง จึงต้องการภาษาภาพแบบใหม่ที่ก้าวข้ามแนวทางการออกแบบเชิงเส้นแบบดั้งเดิม
    • เป้าหมายคือการมอบ ประสบการณ์ที่เข้าใจง่าย ดื่มด่ำ และไว้วางใจได้
    • ช่วยให้ผู้ใช้สำรวจความสามารถที่เปลี่ยนแปลงอยู่เสมอและสร้างความมั่นใจในการใช้งาน
  • นอกจาก ไอคอน “sparkle” ซึ่งเป็นสัญลักษณ์หลักแล้ว ยังมีการผสานองค์ประกอบภาพหลากหลายอย่าง เช่น การไล่เฉดสี คอนเทนเนอร์แบบ responsive และโมชั่นที่มีเจตนา
    • องค์ประกอบเหล่านี้เมื่อรวมกันแล้วก่อให้เกิด ความชัดเจนและความคุ้นเคยที่ให้ความรู้สึกเหมือนเวทมนตร์

ประวัติของความลื่นไหลและบทบาทของการไล่เฉดสี

  • เช่นเดียวกับ งานออกแบบไอคอนของ Susan Kare ในอินเทอร์เฟซ Macintosh ยุคก่อน Gemini ก็มีโจทย์ในการเชื่อมแนวคิด AI ที่เป็นนามธรรมให้มองเห็นได้
    • หากไอคอนของ Kare เป็นสะพานเชื่อมความเข้าใจระหว่างมนุษย์กับเครื่องจักร Gemini ก็ทำหน้าที่คล้ายกันผ่าน การไล่เฉดสี
  • การไล่เฉดสีช่วยถ่ายทอด การไหลของพลังงานและทิศทาง พร้อมดึงความสนใจของผู้ใช้ไปยังองค์ประกอบสำคัญ
    • ระหว่างการป้อนข้อมูลด้วยเสียง จะใช้ การไล่เฉดสีแบบรวมศูนย์และแบบกระจายตัว เพื่อทำให้กระบวนการคิดของ AI มองเห็นได้
  • ต่างจากผู้ช่วยในอดีตอย่าง Clippy ที่นี่มุ่งไปสู่ การแสดงออกที่ปรับตัวได้และค้นพบได้

รูปทรงพื้นฐานและมรดกการออกแบบของ Google

  • ภาษาภาพของ Gemini ได้แรงบันดาลใจจาก โครงสร้างโลโก้แบบวงกลม ของ Google เพื่อสื่อถึงความเรียบง่ายและความกลมกลืน
    • โลโก้ Gemini ก่อตัวขึ้นจากพื้นที่เงาที่เกิดจากวงกลมสี่วง
  • ด้วยการดัดแปลง จุดสี่สีและรูปทรงใน Material Design จึงยังคงภาษาภาพที่คุ้นเคยของ Google เอาไว้ ขณะเดียวกันก็พัฒนาไปสู่การแสดงออกของ AI ที่ลื่นไหลยิ่งขึ้น
    • องค์ประกอบ UI เช่นปุ่มและคอนเทนเนอร์ก็ใช้ มุมโค้งมน เพื่อรักษาความสอดคล้อง
  • รูปทรงวงกลมสื่อถึง การรวมศูนย์และการกระจายตัวของพลังงาน และแสดงให้เห็นในเชิงภาพว่า Gemini ประมวลผลและขยายไอเดียอย่างไร
  • Anna Sera Garcia ผู้นำด้านการออกแบบอธิบายว่างานภาพประกอบควรมี คุณภาพที่อบอุ่นและให้มิติของพื้นที่
    • โดยตั้งเป้าไปที่ความรู้สึกแบบ “มองโลกในแง่ดี สนุกสนาน แต่ยังประณีต” เพื่อสะท้อน กระบวนการคิดแบบไม่เป็นเส้นตรง

โมชั่นที่มีเจตนาและปฏิสัมพันธ์

  • การเคลื่อนไหวของ Gemini ไม่ใช่ของตกแต่ง แต่เป็นองค์ประกอบนำทางหลัก ที่เชื่อมการกระทำของผู้ใช้กับการตอบสนองของระบบ
    • แอนิเมชันแต่ละชุดมีจุดเริ่มต้นและจุดสิ้นสุดที่ชัดเจน เพื่อมอบ ทิศทางและความรู้สึกของการทำงานร่วมกัน
    • การเคลื่อนไหวภายในสื่อถึง การคิด การวิเคราะห์ และความฉลาด ช่วยเพิ่มความโปร่งใสของ AI
  • ตัวอย่าง:
    • ความเร็วของการเคลื่อนไหวถ่ายทอด ความคาดหวังและความโล่งปล่อย
    • ระลอกของ radial gradient ใช้แทนคลื่นเสียง
    • แอนิเมชันของไอคอน ใช้แจ้งฟีเจอร์ใหม่
  • Garcia กล่าวไว้ว่า “เช่นเดียวกับที่เทคโนโลยีเปลี่ยนวิธีการสนทนาของเรา Gemini ก็กำลังสำรวจ หลักการพื้นฐานของปฏิสัมพันธ์ที่เป็นธรรมชาติ

ความนุ่มนวลและความเชื่อมั่นท่ามกลางการเปลี่ยนแปลง

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

บทบาทของนักออกแบบ: ผู้ทำแผนที่ของการเปลี่ยนแปลง

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

ยังไม่มีความคิดเห็น

ยังไม่มีความคิดเห็น