เมื่อไรควรจะใช้ Web Animations ?

Suranart Niamcome
SiamHTML
Published in
1 min readFeb 17, 2015

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

ใช้ Animation ช่วยในเรื่อง Usability

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

  • แสดงถึงที่มา (ของการเปลี่ยนแปลง) ตัวอย่างที่เห็นได้ชัดๆ เลยก็คือปุ่ม Back to top ครับ การค่อยๆ เลื่อนหน้าจอจากด้านล่างกลับขึ้นสู่ด้านบนนั้นดูดีกว่าการเลื่อนกลับในทันทีตรงที่ผู้ใช้เค้าจะรู้ว่ากำลังเกิดอะไรขึ้นอยู่ครับ หรือพวกไอคอนปุ่ม +(add) ที่พอกดแล้วจะค่อยๆ หมุนแล้วกลายเป็นปุ่ม x(close) ก็เช่นเดียวกันครับ หากมันไม่หมุน เราอาจจะไม่ทันสังเกตเลยก็ได้ว่าปุ่มมันได้เปลี่ยนหน้าที่ไปแล้ว
  • ทำให้เด่น บางทีเราอยากจะบอกให้ผู้ใช้งานรู้ว่าส่วนนี้สามารถมีปฏิสัมพันธ์กับเค้าได้ หรือต้องการให้สะดุดตา เราก็อาจเอา animation เข้ามาช่วยได้ครับ เช่น การกระพริบของข้อความหรือปุ่ม การเลื่อน พลิก ฯลฯ สิ่งเหล่านี้ หากไม่ได้ใช้ animation เลย บางทีผู้ใช้งานอาจจะมองผ่านไปเลยก็ได้ครับ แต่อย่าเพิ่งเข้าใจผมผิดนะว่าผมสนับสนุนให้ทำแบบนี้ เพราะถ้าใส่มาเยอะไป มันก็จะกลายเป็นน่ารำคาญแทนได้ครับ อันนี้ต้องระวังนิดนึง
  • บอกว่ากำลังทำงาน (Active) แค่ขึ้นข้อความว่า Now loading อาจยังไม่ค่อยเตะตาผู้ใช้เท่าไรครับ บางทีคนอาจไม่ทันสังเกตเลยด้วยซ้ำ การใช้ animation เข้ามาช่วยกับส่วนนี้นอกจากจะทำให้มันดูเด่นขึ้นแล้ว ยังจะช่วยให้ผู้ใช้งานรู้สึกว่าระบบมันกำลังทำงานอยู่จริงๆ ด้วยครับ (แม้ว่าจริงๆ แล้วจะไม่ใช่ก็ตาม :p)
  • ทำให้เข้าใจง่ายขึ้น บางเว็บจะใช้ animation เพื่อช่วยอธิบายกลไกบางอย่างให้เข้าใจได้ง่ายขึ้นครับ เช่น จำลองระบบสุริยะจักรวาล หรือ อธิบายวิธีการใช้เครื่องชงกาแฟ เป็นต้น

ใช้ Animation สื่อถึงอารมณ์

นอกจากเรื่อง Usability แล้ว หากเราต้องการจะสื่ออารมณ์ถึงความสนุกสนาน น่าตื่นตาตื่นใจ เราก็อาจนำ animation เข้ามาช่วยได้นะครับ เรามักจะเห็นได้จากเว็บไซต์ของหนังดังต่างๆ ที่มักจะทำออกมาแบบหวือหวาๆ ดูน่าสนใจ ลองคิดดูว่าถ้าเราเข้าไปดูเว็บหนัง Action sci-fi แล้วเจอแต่ตัวหนังสือ เราจะอยู่หน้าเว็บนี้ได้นานสักกี่วินาทีกัน

เว็บเราไม่ใช่ Portfolio !

นอกจาก 2 เหตุผลหลักๆ ข้างต้นแล้ว ยังเหลืออีกเหตุผลนึงครับที่เราจะใช้ animation นั่นก็คือเพื่อที่จะแสดงว่าเราใช้ animation เป็นนั่นเอง ^0^ เรามักจะพบการใช้ประเภทนี้ได้ตามเว็บแนว portfolio หรือ resume ซึ่งเป็นสถานที่โชว์ของของคนๆ นั้นครับ และแน่นอนว่าไม่ว่าเค้าจะใส่มาเยอะแค่ไหนมันก็ไม่มีวันผิด

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

--

--