การสร้างเสียงภาพประกอบให้ Slack: เมื่อแซ่บซิ่งเจอกับเทคโนโลยี! 🚀🎨

การสร้างเสียงภาพประกอบให้ Slack

เบื้องหลังการวิจัย, การวางแนวคิด, และการสร้างเสียงและระบบภาพประกอบ พร้อมห้องสมุดที่มีมากกว่า 40+ ทรัพย์สินเฉพาะ

เมื่อตอนที่ Slack ติดต่อฉันในเดือนมกราคม 2017 เพื่อสร้างเสียงและห้องสมุดภาพประกอบ ฉันตื่นเต้นมากที่จะได้ทดลองอะไรใหม่ๆ

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

ตั้งแต่เปิดตัวในปี 2017 สุนทรียศาสตร์นี้กลายเป็นเทรนด์ในวงการเทคโนโลยี ฉันไม่คิดว่านั่นเป็นเรื่องแย่ แต่ฉันเชื่อว่าการสร้างเอกลักษณ์ภาพประกอบที่โดดเด่น ใหม่ และทรงพลัง จำเป็นต้องใช้วิธีการที่ตั้งใจและเป็นกระบวนการ

ในกรณีศึกษานี้ ฉันจะพาคุณไปดูวิธีการวิจัย, การวิเคราะห์ทางเทคนิค, และการรวบรวมความอบอุ่นและการออกแบบตัวละครเข้าไปในเสียงภาพประกอบของ Slack

รู้จักแหล่งอ้างอิงของคุณ

ขั้นตอนที่หนึ่ง: วิจัยและบอร์ดอารมณ์ (Moodboards)

เมื่อเราเริ่มต้นเฟสบอร์ดอารมณ์ของโปรเจกต์นี้ เราได้รับการแนะนำโดยค่านิยมระดับสูงของเรา: เพื่อสร้างเสียงภาพประกอบสำหรับ Slack ที่รู้สึกอบอุ่นและเป็นมิตร แต่ยังคงความเรียบหรูและปราณีต — และไม่เหมือนภาพสต็อก ฉันถูกดึงดูดไปยังสาขาที่เล่าเรื่องเช่นแอนิเมชั่นและสำนักพิมพ์ เพื่อเรียนรู้ว่าพวกเขาสร้างสมดุลนี้อย่างไร

เราได้เรียนรู้มากมาย ฉันอ้างอิงถึงผลงานการพัฒนาภาพในตำนานของ Mary Blair ที่ Disney เพื่อออกแบบตัวละครที่อบอุ่นและมีเสน่ห์ และยากที่จะไม่หลงรักความสมดุลขององค์ประกอบที่ "เรียบง่ายในความเป็นจริง" ที่ Charley Harper สร้างขึ้น โดยเฉพาะในงานโฆษณาและสำนักพิมพ์ของเขา ประวัติศาสตร์ของการประกอบภาพเต็มไปด้วยแหล่งอ้างอิงที่มีค่าให้เราได้ศึกษา และฉันตื่นเต้นที่จะนำคิวเหล่านี้เข้าไปในภาพประกอบเทคโนโลยีองค์กร

เสียงและแนวคิด

ขั้นตอนที่สอง: วิธีการสร้างระบบแบบสองส่วน

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

สำหรับภาพประกอบผลิตภัณฑ์ ข้อจำกัดรวมถึงการปรับสมดุลพื้นที่หน้าจอที่จำกัด, การเรียกร้องให้ดำเนินการเฉพาะ, และความสนใจของผู้ใช้ที่มีจำกัดในรูปแบบดิจิทัล ภาพประกอบผลิตภัณฑ์ยังต้องดึงดูดความสนใจของคุณทันทีในฐานะการอ่านที่รวดเร็วในองค์ประกอบที่มีข้อความเฉพาะ

ภาพประกอบนี้ถูกออกแบบให้เหมาะสมกับภาพหน้าจอของผลิตภัณฑ์ที่เฉพาะเจาะจงทั้งในองค์ประกอบ (การใส่ขอบเขตการค้นหา UI) และเนื้อหา (การแสดงแนวคิดของ "การค้นหา")

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

แต่เราสามารถศึกษาหลักการของสิ่งที่ได้ผลจากแรงบันดาลใจของเราในการสร้างเสียงที่เป็นเอกลักษณ์ของเราเอง ตัวอย่างเช่น คุณภาพสองอย่างที่ฉันชื่นชอบในงานของ Charley Harper และ Mary Blair คือองค์ประกอบที่ดูเรียบง่ายแต่ซับซ้อนและการใช้สีที่โดดเด่น ฉันนำคิวเหล่านี้มาใช้ในงานบรรณาธิการ Slack ของฉันเป็นจุดเริ่มต้น

เข้าสู่โลกแห่งความจริง

ขั้นตอนที่สาม: สร้างห้องสมุดภาพประกอบมากกว่า 40 ภาพ

การทำงานร่วมกับทีมออกแบบภายในของ Slack รวมถึงนักออกแบบของ Ueno, Gene Ross ฉันได้วาดภาพประกอบมากกว่า 40 ภาพแยกต่างหากสำหรับห้องสมุดของ Slack ตั้งแต่ส่วนหัวถึงจุดเล็กๆ ใน UI คุณสามารถพบพวกมันได้ทั่ว slack.com!

เข้าสู่การออกแบบผลิตภัณฑ์

ขั้นตอนที่สี่: การใช้มุมมองการออกแบบผลิตภัณฑ์ในระบบของเรา

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

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

อ่านเพิ่มเติม ได้จาก Link นี้ 🔗 : https://www.byalicelee.com/slack