เมื่อผมเริ่มลงมือสร้างเว็บไซต์แรก ความตื่นเต้นนั้นเป็นของจริง ผมทึกทักเอาเองว่าส่วนที่ยากที่สุดคือการเรียนเขียนโค้ด—การท่องจำแท็ก การทำความเข้าใจฟังก์ชัน และการเขียนไวยากรณ์ให้ถูกต้อง แต่ผมคิดผิด การเขียนโค้ดกลับกลายเป็นส่วนที่ง่ายที่สุด ความท้าทายที่แท้จริงคือการเปลี่ยนบรรทัดเหล่านั้นให้กลายเป็นสิ่งที่ผู้คนสามารถใช้งานได้จริงโดยไม่เกิดความสับสนหรือหงุดหงิด โปรเจกต์แรกนั้นสอนผมว่า การพัฒนาซอฟต์แวร์ไม่ใช่แค่เรื่องของการนั่งพิมพ์โค้ดอยู่คนเดียว แต่เป็นเรื่องของการแก้ปัญหาให้กับมนุษย์ที่ไม่สนใจหรอกว่าคุณจะใช้ Stack อะไร ผมทำพลาดจนต้องเสียทั้งเวลา การนอน และผู้ใช้งานกลุ่มแรกไป มีอยู่ 5 ข้อที่ผมจำได้แม่นที่สุด

ไล่ล่าความสมบูรณ์แบบก่อนที่จะปล่อยงาน

ผมตกหลุมพรางของความสมบูรณ์แบบ ทั้งที่ยังไม่มีสิทธิ์เรียกอะไรว่าสมบูรณ์แบบด้วยซ้ำ ผมใช้เวลาทั้งบ่ายไปกับการเปลี่ยนรหัสสี Hex เพียงแค่เฉดเดียว ขยับค่า border-radius จาก 8 พิกเซล เป็น 10 พิกเซล แล้วก็เปลี่ยนกลับไปมา และเขียนคำพาดหัวใหม่ถึง 5 รอบ ทั้งที่ยังไม่มีผู้เข้าชมคนไหนเห็นหน้าเว็บเลยด้วยซ้ำ ผมบอกตัวเองว่ากำลังขัดเกลาผลงาน แต่จริงๆ แล้วผมแค่กำลังผลัดวันประกันพรุ่งภายใต้หน้ากากของคุณภาพ ผลลัพธ์น่ะหรือ? ผมปล่อยเว็บช้าไปถึงสามสัปดาห์ เมื่อเว็บไซต์ออนไลน์ได้จริงๆ กลับไม่มีผู้ใช้คนไหนมาคอมเมนต์เรื่องความโค้งของปุ่มที่ผมนั่งเครียดอยู่เลย สิ่งที่พวกเขาสนใจคือฟอร์มนั้นส่งข้อมูลได้โดยไม่ค้างหรือเปล่าต่างหาก

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

สร้างเยอะเกินไปตั้งแต่เริ่มแรก

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

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

ละเลยประสบการณ์การใช้งานเพราะมัวแต่สนใจความสวยงาม

ผมใช้เวลาหลายชั่วโมงในการเลือกฟอนต์ที่ดูหรูหราและพาเลตต์สีที่ดูดี ผมหมกมุ่นอยู่กับสีไล่ระดับ (gradient) ของส่วน Hero Section แต่กลับละเลยความรู้สึกในการใช้งานจริงของเว็บไซต์ หน้าเว็บโหลดช้าอืดอาดเพราะผมใช้ไฟล์ PNG ความละเอียดสูงโดยไม่บีบอัดเลย ชื่อเมนูนำทางใช้คำที่ดูฉลาดและสวยงามแต่กลับทำให้คนต้องเดาว่าลิงก์นั้นจะพาไปไหน ส่วนปุ่มก็ดูบางและมีสไตล์แต่เล็กเกินกว่าจะกดบนหน้าจอมือถือได้

ผมเรียนรู้บทเรียนราคาแพงว่า การออกแบบภาพ (Visual Design) และประสบการณ์ผู้ใช้ (User Experience) นั้นแทนกันไม่ได้ อินเทอร์เฟซที่สวยงามจะล้มเหลวทันทีหากผู้เข้าชมต้องรอรูปแบนเนอร์หลายวินาที หรือหากพวกเขาไม่สามารถหาวิธีติดต่อคุณได้ภายในสองคลิก จงทำให้ทุกการโต้ตอบเป็นเรื่องง่าย ใช้ภาษาที่เข้าใจง่ายสำหรับเมนูนำทาง บีบอัดไฟล์ทรัพยากรต่างๆ และตรวจสอบว่าปุ่มกดมีขนาดใหญ่พอ ความเร็วและความชัดเจนไม่ใช่ "โบนัส" ที่คุณจะมาเพิ่มทีหลัง แต่มันคือรากฐานที่ทุกอย่างต้องตั้งอยู่บนนั้น

ทดสอบแค่บนเครื่องของตัวเองเท่านั้น

ผมพัฒนาเว็บไซต์ทั้งเว็บด้วยแล็ปท็อปเครื่องเดียว บนเบราว์เซอร์เดียว และที่ความละเอียดหน้าจอเดียว บนเครื่องของผมทุกอย่างดูไร้ที่ติ แต่แล้วเพื่อนคนหนึ่งเปิดดูผ่าน iPhone ปุ่มต่างๆ ก็ซ้อนทับกัน ข้อความล้นออกจากกรอบ เพื่อนอีกคนใช้ Safari บน Mac แล้วเลย์เอาต์ CSS Grid ทั้งหมดก็พังกลายเป็นกองข้อความที่อ่านไม่ออก ผมแอบทึกทักเอาเองเงียบๆ ว่าถ้ามันใช้งานได้สำหรับผม มันก็น่าจะใช้งานได้สำหรับทุกคน ความคิดนั้นทำให้ผมต้องเสียเวลาช่วงวันหยุดสุดสัปดาห์ไปกับการไล่แก้บั๊กอย่างบ้าคลั่งและต้องกล่าวคำขอโทษด้วยความอับอาย

อย่าทำผิดพลาดซ้ำรอยผม ก่อนที่คุณจะเผยแพร่ ให้ลองเปิดเว็บไซต์ของคุณใน Chrome, Firefox, Safari และ Edge ใช้เครื่องมือสำหรับนักพัฒนา (Developer Tools) ของเบราว์เซอร์เพื่อจำลองหน้าจอมือถือ แท็บเล็ต และแล็ปท็อปที่มีความกว้างต่างกัน คลิกทุกลิงก์ ส่งทุกฟอร์ม และลองย่อขยายหน้าต่างแบบสุดๆ บั๊กที่คุณเจอในขั้นตอนการทดสอบนั้นมีราคาถูกกว่าบั๊กที่ผู้ใช้ไปเจอในตอนใช้งานจริงมากนัก

มองว่าคำติชมคือการโจมตีส่วนบุคคล

การแชร์โปรเจกต์ทำให้ฉันรู้สึกประหม่า จะเกิดอะไรขึ้นถ้าคนไม่ชอบมัน? เมื่อเพื่อนร่วมงานแนะนำให้ตัดฟีเจอร์ที่ฉันได้ทุ่มเท...