Botnoi Voice
20 ธ.ค. 2566
Label
UX/UI
นักศึกษาฝึกงานกลุ่มหนึ่ง ได้รับมอบหมายที่น่าทึ่งในการทำกิจกรรม Hack ในโปรเจ็กต์ “Redesign หน้าสตูดิโอ:การสร้างเสียง” เป็นที่ทุกคนต้องท้าทายตัวเองและทำงานร่วมกันเพื่อเสริมสร้างประสบการณ์ที่ไม่เหมือนใครในระยะเวลาสั้น ๆ ที่มีเพียง 3 วันเท่านั้น!
ความท้าทายของโจทย์
การที่ทุกคนต้องเข้ามาแก้ไขและปรับปรุงหน้าสตูดิโอของ Botnoi voice ในการสร้างเสียงนั้นถือเป็นความท้าทายที่ต้องการความคิดสร้างสรรค์และทักษะการทำงานทีมที่ดี เนื่องจากเวลาที่มีจำกัดและมีขอบเขตของโปรเจ็กต์ที่ต้องทำในระยะเวลาที่กำหนด เพื่อนๆจึงต้องรวมพลังกันในการแก้ปัญหาและพัฒนาประสบการณ์ผู้ใช้ให้ดียิ่งขึ้น.
Botnoi voice หน้าสตูดิโอ : การสร้างเสียง
ขั้นตอนการดำเนินงาน
1. Empathy Phase
1.1 User Research + Pain Points
ในขั้นตอนนี้ทีมของเราได้ศึกษาและสำรวจข้อมูลในกลุ่มเป้าหมายที่มีลักษณะต่างๆ เพื่อรับข้อมูลและความรู้สึกจากผู้ใช้จริงๆและจับประโยชน์ที่ได้จากการใช้แบบสอบถามที่ทำผ่าน Google Forms.
กลุ่มเป้าหมาย:
> เพศ: ทั้งชายและหญิง
> อายุ: 18–40 ปี
> ไลฟ์สไตล์: คนที่สนใจในการสร้างเสียงเพื่อใช้ในการสร้างสื่อต่าง ๆ
Insights:
ผู้ใช้ต้องการการใช้งานที่ intuitively และ user-friendly
ความสะดวกในการปรับแต่งเสียงตามความต้องการ
ความสนใจในการใช้งานเพื่อการสร้างสื่อและนำไปใช้ในทางธุรกิจ
จากผลสำรวจสรุปสิ่งที่ต้องแก้ไขได้ ดังนี้
การให้ข้อมูลและฟังก์ชัน: ปรับให้ปุ่มแก้ไขและฟังก์ชั่นต่าง ๆ ของเว็บไซต์มีการเน้นและเด่นชัดขึ้น เพื่อลดความสับสนและทำให้ผู้ใช้เข้าใจได้ง่ายขึ้น
ไอคอนกรรไกรและนาฬิกา: เพิ่มคำอธิบายประกอบที่ช่วยให้เข้าใจว่ากรรไกรและนาฬิกามีหน้าที่อะไรและใช้ยังไง
การใช้ธีมสี: ปรับใช้ธีมสีที่เข้ากับความเรียบง่าย สื่อความหมาย และน่าสนใจเพื่อเพิ่มความสมดุลในหน้าเว็บ พร้อมกับแก้ขนาดตัวหนังสือให้ใหญ่ขึ้น
1.2 Competitor Analysis
เราได้ทำการหยิบยกข้อดี-ข้อเสีย จากคู่แข่งที่น่าสนใจมาเปรียบเทียบเพื่อให้เห็นภาพในสิ่งที่เราคววรปรับปรุงชัดเจนยิ่งขึ้น
ตัวอย่าง การหยิบข้อดีที่น่าสนใจของ competitor มาดู
2.Define phrase
2.1 User Journey
ภาพรวมของ flow การใช้งาน เช่น โจทย์การสร้างเสียงเราจะดูว่าจะมีขั้นตอนอะไรบ้างที่ผู้ใช้ต้องเจอ นำ insight ที่ได้มาพล็อตตามflow ว่าจุดไหนที่มีปัญหา คิดว่าจะแก้ยังไง โดยมีขั้นตอนดังนี้
1.ผู้ใช้กดเลือกเสียงที่ต้องการ
2. เลือกภาษา ที่ต้องการสร้างเสียง
3. พิมพ์ข้อความเพื่อสร้างเสียง(ข้อความต้องเป็นภาษาเดียวกับเสียงที่เลือก)
4. กดปุ่ม สร้างเสียง
5. กดปุ่ม เล่นเสียง
6. กดปุ่มแก้ไขเสียง
— ปุ่ม ปรับความเร็วเสียง
— ปุ่ม ปรับความดังของเสียง
— ปุ่ม หน่วงเวลาเสียงพูด
— ปุ่ม ตัดแบ่งข้อความสร้างเสียงใหม่
— ปุ่ม ลบกล่องข้อความ
7. เมื่อแก้ไขเสร็จ กดปุ่มสร้างเสียงอีกครั้ง
8. เมื่อได้เสียงที่ต้องการ กดปุ่ม ดาวน์โหลด
User Journey ปัจจุบัน คือเพิ่มฟังก์ชั่นกดปุ่มอัดเสียง(สร้างเสียงด้วยการกดปุ่มไมค์เพื่ออัดเสียง)
3. Ideate Phase
3.1 Mid-Wireframe
การออกแบบใหม่มีการแก้ไขปัญหาต่างๆ ทั้งจอแบบ website และphone ดังนี้:
ปรับดีไซน์ใหม่ การวางองค์ประกอบต่างๆ
ปุ่มต่างๆ มีคำอธิบายสั้นๆเพื่อให้เข้าใจ
เพิ่มฟังก์ชันโคลนเสียงได้ด้วยการเปิดไมค์พูด หรือเอาไฟล์เสียงมาใส่
ขยายปุ่ม ต่างๆให้ใหญ่ขึ้น
ปรับขนาดฟอนต์
ปรับสีปุ่ม ที่สื่อความหมาย
ยังคงConceptเดิม เข้าใจง่าย มองแล้วสบายตา
4. Prototype Phase + Test Phase
4.1 Usability Test
ทดสอบกับกลุ่มตัวอย่างเก่าเพื่อวัดประสิทธิภาพด้วย Google from จากผลสำรวจพบว่าประมาณ 80% เห็นชอบกับรูปแบบใหม่
ข้อเสียที่ยังคงอยู่:
ปรับขนาดตัวหนังสือให้เล็กลง
ทำปุ่มอัดเสียงให้เห็นชัดมากขึ้น
การบันทึกและดาวน์โหลดยังไม่ชัดเจน
ข้อดีที่แก้ไขแล้วได้ผล:
การแสดงตัวอย่างการใช้งานทำให้เข้าใจง่ายขึ้น
ปรับแต่งที่ชัดเจนและใช้งานได้ง่ายขึ้น
ตัวอย่าง Usability Test
5. Future Phase
5.1 Opportunities
พวกเราในทีมได้ช่วยกันแสดงความคิดเห็นและข้อเสนอแนะต่างๆได้ดังนี้
ปรับปรุง UX/UI:
ปรับ Graphic ให้ชัดเจน
ลดปริมาณตัวหนังสือที่หน้าแรก
ปรับ Icon เพิ่มขนาดและความชัดเจน
ทำให้ Button ชัดเจนและใช้สีแยกเพื่อลดความสับสน
ปรับปรุงดาวน์โหลด:
เปลี่ยนการดาวน์โหลดทั้งหมดเป็นการเลือกเสียงที่จะ Download
เพิ่มความสามารถในการเลือกติ้กเสียงทีละเสียงหรือทั้ง Project หรือทุกเสียง
ปรับ Point System:
แปลง “แต้ม” ที่ใช้ไปเป็น “Point” สำหรับส่วนลดหรือแลกรับสิทธิพิเศษต่างๆ ใช้เป็นกระตุ้นให้ user ใช้งานมากขึ้น
การแจ้งเตือนและคำเตือน:
ปรับปรุงคำเตือนให้เหมาะสมและเข้าใจง่าย
เพิ่มคำเตือนที่มีประโยชน์ เช่น เลือกเสียงจีนแต่พิมพ์ภาษาไทยเสียงจะไม่ออก ก็มีคำเตือนขึ้นมา หรือการนำไฟล์เข้า ผิดไฟล์หรือใช้ไม่ได้ พร้อมกับกล่องที่ไม่ต้องแจ้งเตือนให้ฉันอีก
ปรับปรุงประวัติและ Sign-in:
เพิ่มประวัติดาวน์โหลดและเสียงที่ลบ
ทำให้ Sign-in ค้างไว้ในเว็บเพื่อความสะดวก
Auto Save Project:
เพิ่ม Auto Save ในปุ่ม “บันทึก Project” เพื่อประหยัดเวลาและประสิทธิภาพ
การให้สิทธิ์เข้าถึง:
สามารถให้เข้าถึงได้ทันทีก่อน Sign-in ในบางส่วนที่ไม่ได้เกี่ยวข้องกับการแก้ไขข้อมูล
คู่มือ Import File:
ให้มีคู่มือ(ข้อกำหนด)ในหน้าสร้างเสียงเพื่อความสะดวก
ตัวอย่างภาพที่ทีมได้ช่วยกันแสดงความคิด
“Intern Botnoi (Team UI/XI design)-Redesign หน้าสตูดิโอ : การสร้างเสียง”
การทำโปรเจ็กต์ “Redesign หน้าสตูดิโอ:การสร้างเสียง” ของ Botnoi Voice เป็นการประสบการณ์ที่น่าทึ่งสำหรับทีมนักศึกษาฝึกงาน 7 คน ที่ต้องแก้ไขและปรับปรุงหน้าสตูดิโอ ซึ่งเป็นอะไรที่ท้าทายมากในระยะเวลาเพียง 3 วันเท่านั้น.
ประโยชน์ที่ได้จากกิจกรรมนี้
User-Centric Approach:
ทีมศึกษาและเข้าใจความต้องการของผู้ใช้จริง ๆ ผ่าน User Research และประสบการณ์จริง ๆ ในการใช้งาน.
การทำงานร่วมกัน:
แสดงถึงความสำคัญของการทำงานเป็นทีม ทีมได้ร่วมกันในการแก้ไขปัญหาและพัฒนาฟีเจอร์ที่ดีขึ้น.
Innovative Solutions:
นำเสนอแนวคิดใหม่เพื่อสร้างประสบการณ์ที่ไม่เหมือนใครและทำให้ Botnoi Voice เป็นเครื่องมือที่สนุกและใช้งานได้ง่าย.
สรุป:
ทีมทำงานร่วมกันเพื่อท้าทายตัวเองและสร้างประสบการณ์ที่น่าสนใจ ในเวลาอันจำกัด ผลลัพธ์คือ Botnoi Voice หน้าสตูดิโอ:การสร้างเสียง ได้รับการปรับปรุงมากมายที่ทำให้การสร้างเสียงเป็นที่สนุกและใช้งานได้ง่าย ด้วยแนวคิดใหม่ๆที่ดีกว่าเดิม.
Back
