ส่วนเสริมของ Google Workspace ควรสอดคล้องกับรูปแบบและเลย์เอาต์ของแอปพลิเคชันโฮสต์ที่ขยาย โดยควรขยาย UI อย่างเป็นธรรมชาติโดยใช้การควบคุมและลักษณะการทำงานที่คุ้นเคย หลักเกณฑ์ที่แสดงที่นี่อธิบายวิธีจัดการข้อความ รูปภาพ การควบคุม และการสร้างแบรนด์ที่ส่งเสริมประสบการณ์ของผู้ใช้ที่มีคุณภาพสูง
หากส่วนเสริมเปิดหน้าเว็บแยกต่างหากซึ่งเป็นส่วนหนึ่งของการทํางานของส่วนเสริม (เช่น หน้าการตั้งค่าสําหรับส่วนเสริม) โปรดตรวจสอบว่าหน้าเว็บเหล่านั้นเป็นไปตามหลักเกณฑ์ด้านสไตล์เหล่านี้ด้วย
ข้อความและรูปภาพ
ส่วนนี้จะอธิบายวิธีใช้ข้อความและรูปภาพในส่วนเสริมอย่างถูกต้อง
ชื่อส่วนเสริม
คุณต้องตั้งชื่อส่วนเสริมในไฟล์ Manifest ของโปรเจ็กต์และเมื่อคุณกำหนดค่าส่วนเสริมเพื่อเผยแพร่ ชื่อจะปรากฏในหลายๆ ที่ เช่น ข้อมูลใน Google Workspace Marketplace และภายในเมนู สิ่งที่ควรทราบเมื่อเลือกชื่อ
- ใช้ตัวพิมพ์ใหญ่สำหรับชื่อ
- หลีกเลี่ยงเครื่องหมายวรรคตอน โดยเฉพาะวงเล็บ เว้นแต่ว่าจะเป็นองค์ประกอบของแบรนด์
- โปรดใช้ข้อความสั้นๆ โดยควรมีความยาวไม่เกิน 15 อักขระ ระบบอาจตัดชื่อที่ยาวในข้อมูล Google Workspace Marketplace และที่อื่นๆ โดยอัตโนมัติ
- อย่าใส่คำว่า "Google", "Gmail" หรือชื่อผลิตภัณฑ์อื่นๆ ของ Google ในชื่อส่วนเสริม
- อย่าใส่คำว่า "ส่วนเสริม" ในชื่อส่วนเสริม
- ละเว้นข้อมูลเวอร์ชัน
รูปแบบการเขียน
คุณไม่จำเป็นต้องเขียนมาก การดำเนินการส่วนใหญ่ควรแสดงอย่างชัดเจนผ่านไอคอน เลย์เอาต์ และป้ายกำกับสั้นๆ หากพบว่าส่วนหนึ่งของส่วนเสริมต้องมีคำอธิบายที่ละเอียดกว่าที่ป้ายกำกับสั้นๆ จะระบุได้ แนวทางปฏิบัติแนะนำคือให้สร้างหน้าเว็บแยกต่างหากที่อธิบายส่วนเสริมและลิงก์ไปยังหน้านั้น
เมื่อเขียนข้อความ UI
- ใช้ตัวพิมพ์ตามแบบประโยค (โดยเฉพาะสำหรับปุ่ม ป้ายกำกับ และการดําเนินการของการ์ด)
- โปรดใช้ข้อความสั้นๆ ง่ายๆ ที่ไม่มีศัพท์เฉพาะหรือคำย่อ
การดำเนินการแบบทั่วไปและการดําเนินการกับการ์ด
หากคุณใช้การดำเนินการแบบสากลหรือการดำเนินการกับการ์ดในส่วนเสริม การดำเนินการดังกล่าวจะปรากฏเป็นรายการเมนูในการ์ดที่คุณกำหนด คุณเลือกข้อความที่จะใช้ในเมนูเหล่านี้สําหรับการดําเนินการเหล่านี้ได้ เมื่อเลือกข้อความที่จะใช้
- หลีกเลี่ยงข้อความเมนูที่ซ้ำกันเพียงชื่อของส่วนเสริม
- เริ่มรายการเมนูแต่ละรายการด้วยคำที่เป็นคำสั่ง เช่น "เรียกใช้" "กำหนดค่า" หรือ "สร้าง"
- อธิบายงาน ไม่ใช่คอมโพเนนต์ UI ที่การดำเนินการแสดง
- หากการดําเนินการเริ่มต้นเวิร์กโฟลว์และไม่มีคำกริยาที่อธิบายสิ่งที่ทํา ให้ตั้งชื่อเป็น "เริ่ม"
- กำหนดจำนวนรายการในเมนูให้น้อยเพื่อไม่ให้ผู้ใช้ต้องเลื่อนดูรายการจำนวนมาก หากต้องการใช้การดําเนินการเพิ่มเติม ให้พิจารณาใช้การ์ดหลายใบที่มีการดําเนินการที่แตกต่างกันในแต่ละใบ
ข้อความแสดงข้อผิดพลาด
เมื่อเกิดข้อผิดพลาดขึ้น คุณควรใช้ภาษาที่เข้าใจง่าย อธิบายปัญหาจากมุมมองของผู้ใช้และแนะนำวิธีแก้ไข
- ไม่อนุญาตให้ผู้ใช้เห็นข้อยกเว้นที่โค้ดของคุณแสดง แต่ให้ใช้คำสั่ง
try...catchเพื่อขัดจังหวะข้อยกเว้น แล้วแสดงข้อความแสดงข้อผิดพลาดที่ผู้ใช้เข้าใจง่าย - ก่อนเผยแพร่ ให้ตรวจสอบว่าส่วนเสริมไม่ได้แสดงข้อมูลการแก้ไขข้อบกพร่องใน UI
เนื้อหา Help
คุณอาจต้องออกแบบการ์ดที่แสดงข้อมูลความช่วยเหลือหรืออธิบายวิธีการทำงานของส่วนเสริมให้ผู้ใช้ทราบ หากคุณสร้างเนื้อหาช่วยเหลือสำหรับส่วนเสริม โปรดอย่าลืมทำสิ่งต่อไปนี้
- แสดงวิธีการเป็นรายการสัญลักษณ์หัวข้อย่อยหรือรายการที่เรียงลำดับเลข หากเป็นไปได้ แนะนำผู้ใช้ให้เห็นภาพขั้นตอนต่างๆ จนกว่าจะได้ผลลัพธ์ที่ต้องการ โดยอ้างอิงถึงองค์ประกอบ UI ที่มีชื่ออย่างชัดเจน
- ตรวจสอบว่าวิธีการอธิบายข้อกำหนดต่างๆ อย่างชัดเจน เช่น การตั้งค่าสเปรดชีตในลักษณะหนึ่งๆ
- คุณลิงก์ไปยังเนื้อหาความช่วยเหลือภายนอกได้ เช่น หน้าเว็บที่รองรับ
รูปภาพ
รูปภาพที่ใช้ในส่วนเสริมต้องเป็นไอคอนประเภทต่างๆ ที่มีให้อยู่แล้วหรือรูปภาพที่โฮสต์แบบสาธารณะซึ่งระบุด้วย URL เมื่อใช้รูปภาพที่โฮสต์ ให้ตรวจสอบว่าทุกคนที่อาจใช้ส่วนเสริมของคุณเข้าถึงรูปภาพเหล่านั้นได้
การควบคุม
ส่วนนี้จะแสดงหลักเกณฑ์ด้านประสบการณ์ของผู้ใช้สำหรับวิดเจ็ตแบบอินเทอร์แอกทีฟ
ปุ่ม
ใช้ปุ่มเพื่อควบคุมการดําเนินการหลักของอินเทอร์เฟซผู้ใช้แทนวิดเจ็ตอื่นๆ
- ป้ายกํากับปุ่มข้อความส่วนใหญ่ควรขึ้นต้นด้วยคํากริยา
- ในกรณีส่วนใหญ่ แถวปุ่มควรมีปุ่มไม่เกิน 3 ปุ่ม
DecoratedText
วิดเจ็ต DecoratedText ช่วยให้คุณนำเสนอเนื้อหาข้อความด้วยไอคอน ปุ่ม หรือสวิตช์ได้
- ขึ้นต้นประโยคด้วยตัวพิมพ์ใหญ่ หรือใช้ตัวพิมพ์ใหญ่กับอักษรตัวแรกของคำและวิสามานยนาม (สำหรับภาษาอังกฤษ) สำหรับเนื้อหาข้อความ
- ระบบจะตัดข้อความของวิดเจ็ต DecoratedText หากข้อความไม่พอดีกับพื้นที่ที่มีอยู่ ดังนั้น โปรดพยายามเขียนเนื้อหาข้อความให้สั้นที่สุดเสมอ
อินพุตการเลือก
คุณสามารถใช้วิดเจ็ตอินพุตแบบเลือกได้หลายประเภทในส่วนเสริม เช่น ช่องการเลือกแบบเลื่อนลง ช่องทำเครื่องหมาย และปุ่มตัวเลือก
- ใช้ช่องทําเครื่องหมายเมื่อผู้ใช้เลือกตัวเลือกได้หลายรายการ หรือไม่มีตัวเลือกใดเลย ใช้ปุ่มตัวเลือก (หรือเมนูตัวเลือก) เมื่อต้องเลือกตัวเลือกเพียงรายการเดียว ใช้เมนูแบบเลื่อนลงเมื่อระบุรายการทางเลือกสั้นๆ ขณะพยายามประหยัดพื้นที่ใน UI
- ใช้การขึ้นต้นประโยคด้วยตัวพิมพ์ใหญ่สำหรับข้อความที่กำหนดให้กับแต่ละตัวเลือก
- หลีกเลี่ยงการใช้การเปลี่ยนแปลงการเลือกเพื่อทริกเกอร์การดำเนินการที่สำคัญซึ่งแก้ไขได้ยาก เนื่องจากผู้ใช้มักทำผิดพลาดเมื่อทำการเลือก แต่ให้ลองเพิ่มปุ่มที่อ่านค่าการเลือกปัจจุบัน แล้วทริกเกอร์การดำเนินการแทน
- สำหรับเมนูแบบเลื่อนลง ให้จัดเรียงตัวเลือกตามลําดับตัวอักษรหรือตามรูปแบบที่ผู้ใช้ทุกคนเข้าใจได้ (เช่น แสดงวันของสัปดาห์ตามลําดับโดยเริ่มจากวันอาทิตย์หรือวันจันทร์)
- จํากัดจํานวนตัวเลือกในวิดเจ็ตอินพุตการเลือกหนึ่งๆ เป็นจํานวนที่เหมาะสม หากมีตัวเลือกมากเกินไป ผู้ใช้อาจใช้วิดเจ็ตได้ยาก ในกรณีดังกล่าว ให้พิจารณาแบ่งตัวเลือกออกเป็นหมวดหมู่ต่างๆ และวิดเจ็ตหลายรายการ
การป้อนข้อความ
อินพุตข้อความเป็นพื้นที่สำหรับให้ผู้ใช้ป้อนข้อมูลสตริง
- อย่าใช้การป้อนข้อความเพื่อบังคับให้ผู้ใช้พิมพ์รายการที่เป็นไปได้จากชุดที่เจาะจง ใช้เมนูแบบเลื่อนลงแทน
- ใช้คำแนะนำและคำใบ้เพื่อช่วยผู้ใช้ป้อนข้อความที่มีรูปแบบและเนื้อหาที่ถูกต้อง
- ใช้การป้อนข้อความหลายบรรทัดหากข้อความที่จะป้อนมีความยาวมากกว่า 2-3 คำ
การสร้างแบรนด์
ส่วนนี้จะแสดงหลักเกณฑ์ด้านประสบการณ์ของผู้ใช้สำหรับการเพิ่มองค์ประกอบการสร้างแบรนด์ลงในอินเทอร์เฟซของส่วนเสริม
ในส่วนเสริม
หากต้องการใส่การแสดงแบรนด์ใน UI ของส่วนเสริม ให้ใช้ข้อความสั้นๆ และเบาสบาย วิธีนี้ช่วยให้ผู้ใช้มุ่งเน้นที่ฟังก์ชันการทำงานของส่วนเสริม
- ส่วนต่างๆ ทั้งหมดของส่วนเสริมต้องเป็นไปตามหลักเกณฑ์การใช้แบรนด์
- อย่าใส่คำว่า "Google", "Gmail" หรือชื่อผลิตภัณฑ์อื่นๆ ของ Google
- อย่าใส่ไอคอนผลิตภัณฑ์ของ Google แม้ว่าจะมีการดัดแปลงไอคอนก็ตาม
- อย่าใส่คำว่า "ส่วนเสริม" ในข้อความการสร้างแบรนด์
- ข้อความการสร้างแบรนด์ควรมีความยาวไม่เกิน 2-3 คำ
ใน Google Workspace Marketplace
เมื่อกำหนดค่าส่วนเสริมเพื่อเผยแพร่ คุณจะต้องระบุชิ้นงานกราฟิกและข้อความจำนวนหนึ่งเพื่อสร้างข้อมูลผลิตภัณฑ์ใน Google Workspace Marketplace
ทุกแง่มุมของข้อมูลผลิตภัณฑ์ใน Store และชิ้นงานเหล่านี้ต้องเป็นไปตามหลักเกณฑ์การใช้แบรนด์