ฟอนต์แม่ไก่ (iannnnn-HEN)

ตามธรรมเนียม คือพอสร้างฟอนต์เสร็จตัวนึงแล้วเราจะเอามาเล่าที่นี่ด้วยความเห่อ อย่างน้อยก็เป็นการบันทึกไว้เผื่อลืมว่าตอนนั้นตัวเองคิดอะไร ทำไมถึงทำมันขึ้นมา เคยลองไม่บันทึก เพราะกะว่ายังไงก็จำได้ ปรากฏว่าพอกาลเวลามันพัดพาไป เราก็ลืมจนได้ เสียดายมาก

คราวนี้เป็นคิวของการทำฟอนต์แม่ไก่ ฟอนต์ล่าสุดในตระกูลฟอนต์ iannnnn ยุคใหม่ ถัดจากฟอนต์ เป็ด หมา ห่าน เสือ และนกฮูก ยังไม่นับที่ถอดลายมือของสะอาดและพลอย (ทั้งหมดสามารถดาวน์โหลดได้ฟรีจากเว็บฟอนต์ > iannnnn)

ฟอนต์แม่ไก่ ดาวน์โหลดฟรี ใช้ฟรี ใช้ทำมาหากินก็ได้ตามสบาย ที่ f0nt.com/release/iannnnn-hen/

ประวัติของฟอนต์แม่ไก่คร่าวๆ แบบเชิงบวก เชิงโฆษณา เชิงภาพลักษณ์ สามารถอ่านได้จากลิงก์ข้างบนนี้ เขียนให้มันสวยๆ สำหรับคนผ่านไปผ่านมา

เวอร์ชันเนิร์ด เขียนบันทึกระหว่างทางการทำฟอนต์ ที่แปะไว้ในฟอรั่มหลังบ้านของเว็บฟอนต์ โชว์ไปเลยว่าเราทำงานช้าแค่ไหน เจอปัญหาอะไร แปะไว้ที่นี่ : ฟอนต์แม่ไก่ (iannnnn-HEN)

และเวอร์ชันบ่นให้คนรู้จักฟัง จะอยู่ถัดจากนี้ไปครับ…

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

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

สิ่งนี้เกิดขึ้นหนักมากกับฟอนต์แม่ไก่ ซึ่งเอาจริงๆ นับย้อนไปถึงตอนเริ่มโปรเจกต์ iannnnnPNG เมื่อปี 2006 (ก็คือยี่สิบปีแล้ว…) เราอยากทำฟอนต์มินิมัล-ไม่มีหัวขึ้นมาสักชุด มาใช้ทดแทน หรืออย่างน้อยก็วางเคียงคู่ฟอนต์เจ้าตลาดในสมัยนั้นที่ยังไม่มีเวอร์ชันแจกฟรี แต่ก็พับไป บอกตามตรงว่าปากดี แต่ฝีมือไม่ถึง ออกแบบยังไงก็ไม่ลงตัว และไม่พยายามมากพอ มันเลยถูกปล่อยทิ้งร้าง แต่ชื่อมันสวย เลยอยากทำต่อในดีไซน์อื่น

ต่อมา พอถึงยุคสมัยของฟอนต์ iannnnn รุ่นใหม่ๆ ที่เปลี่ยนไส้ในจาก kerning + liga เป็นระบบ kerning + mark (อ่านไม่รู้เรื่องก็ช่างมันเถอะ) และปรับสเกลฟอนต์เพื่อให้รองรับกับยุคสมัยปัจจุบัน และสร้างด้วยโปรแกรมฟอนต์แล็บราคาแพงระยับ ผมยังขุดดีไซน์ที่ร่างไว้จากฟอนต์มินิมัล-ไม่มีหัว มาลองเติมหัวดู เออ เข้าท่านี่หว่า

คู่ขนานกับการได้เห็นฟอนต์ iannnnnGMO ที่ทำไว้เมื่อ 20 ปีก่อน (2005) แล้วดันเห็นว่ามันยังคงถูกใช้งานอย่างแพร่หลายในปัจจุบัน

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

ใจจริงอยากลบมันออกและป่าวประกาศว่าอย่าใช้ GMO ได้ไหม เห็นแล้วฉันอยากกรี๊ด แต่ก็ทำไม่ได้ เพราะกระสุนถูกปล่อยออกไปนานเกินจะควบคุมแล้ว

ความที่มีไอเดียฟอนต์นึงวนเวียนในหัวมากว่าสิบปี และความอยากรีโนเวตฟอนต์เดิม ทั้งสองสิ่งนี้เป็นแรงบันดาลใจให้เคาะโปรเจกต์ฟอนต์แม่ไก่ขึ้นมาเมื่อปี 2021 …ใช่ 4 ปีแน่ะ

ที่ชื่อฟอนต์แม่ไก่ก็เพราะ ฟอนต์นี้เริ่มจากการที่เรามี ก.ไก่ แบบที่ชอบอยู่ในหัวเป็นตัวแรก เลยอยากพัฒนาต่อให้ออกมาเป็นฟอนต์ เลยตั้งชื่อ(ตอนนั้น)ว่า iannnnn-CHICKEN

ที่ตลกก็คือพอพัฒนาดีไซน์ไปเรื่อยๆ เรากลับนั่งปรับ ก.ไก่ อีกหลายครั้ง (คือเวลาออกแบบฟอนต์ เราจะแก้ไปแก้มา ทั้งในกระดาษและในคอมพ์) จนสุดท้ายก็กลายเป็น ก.ไก่ แบบที่เห็นในปัจจุบัน

คือสำหรับเรา (ที่เป็นสายมวยวัดนะครับ ไม่ใช่สายหลักที่เขาร่ำเรียนกันเป็นระบบและฉลาดกว่านี้มาก) การพัฒนาฟอนต์ 1 ตัว มันดูแค่ตัวเดียวโดดๆ ไม่ได้ เวลาทำไปเรื่อยๆ แล้วหันกลับมาเช็ก

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

เนื่องจากมันเป็นโปรเจกต์ส่วนตัวที่ทำสนุกๆ การเปลี่ยนแนวกลางคัน เลยไม่รู้สึกว่าเป็นการขาดทุนอะไร เหมือนเห็นว่าวิ่งไปเลนใหม่น่าจะสนุกกว่าย้ำอยู่เลนเดิม ก็เปลี่ยน มักง่ายจังวะ

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

จนสลับไปทำฟอนต์อื่นๆ หลายตัว แล้ววนกลับมาสู่โปรเจกต์ที่ต้องการแรงใจในการผลักดันให้จบให้จงได้

2021 เริ่มออกแบบ
2022 รื้อแบบ
2023 รื้อใหม่ทั้งหมด
2024 พับโครงการยาว ไปทำฟอนต์อื่นๆ แทน
2025 เดือนเมษายน… คราวนี้ ตั้งใจไว้แล้วว่ากูจะจบงานให้ได้!

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

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

พอ DNA มันมา ทีนี้ก็ยาวเลย งานออกแบบไปทำไป แก้ไป ที่จริงก็ใช้เวลาหลังเสร็จงานมานั่งปั่นฟอนต์ก่อนนอนทุกคืนที่ว่าง โดยที่ได้รับอนุญาตจากเมียแล้ว

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

ฟอนต์นี้เราตั้งใจจะทำ “ดีไซน์หลัก” ให้เสร็จใน 1 เดือน ซึ่งก็ทำได้จริง เสร็จดีไซน์หลักในดราฟต์แรกก่อนขึ้นเดือนพฤษภาฯ

แต่นั่นคือครึ่งเดียว งานออกแบบฟอนต์สนุกๆ มันคือครึ่งเดียว

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

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

ในภาพจะมีดาวสีแดงๆ เหนือ ก.ไก่ …นั่นแหละการวางตำแหน่งวรรณยุกต์ต่างๆ

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

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

นั่งทับมือไว้ ได้บ้างไม่ได้บ้าง จองคิวไว้ในบอร์ดแล้ว แต่น้องๆ พี่ๆ ที่ไฟแรงกว่า ก็ลงคิวปล่อยฟอนต์กันรัวๆ จนยาวขนาดที่ปล่อยฟอนต์ใหม่วันละ 7 ตัว ก็ยังทลายคิวไม่สำเร็จ

สุดท้าย ฟอนต์แม่ไก่ก็เสร็จ 100% แต่ปล่อยไม่ทันเดือนพฤษภาคมอย่างที่ประกาศและประจานไว้

3 มิถุนายน เราไปเที่ยวกับครอบครัว ไปนอนบ้านสวนของเพื่อน(วุฒิ)ที่แปดริ้ว ในห้องคือทุกคนหลับกันหมดแล้ว ไม่มีโต๊ะ ไม่มีเก้าอี้ แต่รู้สึกว่าอยากจบงานนี้แล้ว ไม่งั้นคงนอนไม่หลับ

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

ได้แม่ไก่และตระกูลน้องไข่มาเป็นที่สำเร็จ

ก็เอามาประกอบและทำเป็นอาร์ตเวิร์ก (ภาพบนสุด และภาพอื่นๆ ในหน้าโหลดฟอนต์แม่ไก่) จึงสบายใจ และหลับได้

แล้ววันนี้ก็ปล่อยฟอนต์นี้ เป็นอันจบงานอดิเรกที่ดูจะเป็นภาระเหลือเกิน แต่มันสนุกง่ะ เลิกไม่ได้

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

และคำถามสุดท้ายก็คือ หลังจากฟอนต์แม่ไก่แล้ว พ่อจะทำฟอนต์เป็นสัตว์อะไรต่อ

เราบอกว่าฟอนต์แมวพ่อขอต๊ะไว้ก่อน อยากทำให้เป็นฟอนต์ที่รักสุดๆ ไม่แพ้ฟอนต์หมา แต่ตอนนี้ยังนึกไม่ออก (มาถึงวันที่พิมพ์นี่ก็พอจะนึกออกแล้วว่าอาจจะเป็นลูกผสมของ iannnnnPNG กับแม่ไก่ก็ได้ ทดไว้เท่านี้พอ)

ลูกเลยเสนอว่า หนูขอชื่อฟอนต์หมู

ได้ ฟอนต์หมู เจอกัน ตัวถัดไปนี้เลย!

––––––––––––––––––––––––––––––––

Post-credits scene : สุดท้ายนี้ ขอฝากฟอนต์แม่ไก่ในอ้อมอกอ้อมใจทุกคนที่ผ่านมาอ่านด้วยนะครับ (น่าจะประมาณ 3 คน) และฝากฟอนต์ exclusive เป็นแม่ไก่นุ่มพิเศษ 3 น้ำหนักเท่ากัน แต่มุมมน ก็จะนุ่มน่ารักขึ้นไปอีก ซึ่งเซ็ตพิเศษนี้ไม่ได้แจกฟรี ถ้าชอบก็สามารถ donate เท่าไหร่ก็ได้ เดี๋ยวผมจะส่งแม่ไก่นุ่มให้เป็นการสมน้ำหน้าคุณครับ

ทำเว็บ Soundboard ตลกคาเฟ่

เย็นนี้ห้าโมงจะมีงานเลี้ยงรุ่นของเพื่อนๆ ที่คณะ ปีนี้จัดในธีมตลกคาเฟ่ นึกขึ้นได้ว่าน่าทำ soundboard ง่ายๆ ขึ้นมาไว้ให้กดบนเวที

เลยเปิดของเดิมที่เคยทำเว็บแอปคอร์ดเพลง (ดีใจที่ทำมาแล้วได้ใช้เองทุกวัน) ขึ้นมา แล้วบอก Deepseek ให้ตัดทุกฟังก์ชันที่ฟุ้มเฟือยออกให้หมด แคชก็ไม่ต้องแคช ระบบสุ่ม ระบบค้นหาก็ไม่ต้องมี เหลือแค่กดปุ่มแล้วเล่นเสียงแบบไม่ต้องเปลี่ยนหน้า ส่วนไฟล์เสียงก็เอาที่เคยรวบรวมมาใส่ลงไปในโฟลเดอร์ sound แล้วเว็บมันจะดึงรายชื่อนั้นมาแสดงเลยตรงๆ

แล้วก็นั่งจูนอีกนิดๆ หน่อยๆ ใช้เวลาแป๊บเดียวเสร็จเลย (ไม่ได้ optimize code นะ ไม่ได้ต้องเซฟเน็ตอะไร)

โดยรวมพอใจกับ Deepseek มาก เดี๋ยวนี้น้องเร็ว คงพ้นช่วงคนแตกตื่นแรกๆ ที่ต้องรอคิวโหดๆ แล้ว

ก็ไม่มีไร หน้าเว็บทั้งในมือถือและบนคอมพ์ก็จะเป็นปุ่มๆ ให้กดเล่นได้เท่านั้นแหละ เชิญจ้ะ

ทำเว็บแปลงค่าเงินเยนเป็นบาทแบบง่ายๆ

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

  • โจทย์คือ ออกแบบให้ใช้ง่ายที่สุดในมือถือ ไม่เน้นสวย
  • และเล็ก เราเลย optimize โค้ดเหลือขนาดจิ๋ว แค่ 1KB นิดๆ เอง
  • เออ ถ้าจะให้ง่ายขึ้นอีก มันกดทำ shortcut ได้นะ เวลาเข้าเว็บก็เหมือนเปิดแอปเลย

เชิญจ้ะ

คราวนี้ใช้ Gemini ช่วยเขียนโค้ด เพราะเราลืมวิธีไปหมดแล้ว บรีฟด้วยภาษาไทยแบบลูกค้าเรื่องมาก ใช้เวลาทำแป๊บเดียว ลวกๆ เลย นานแค่ตอนพยายามปรับ UX ให้มันง่ายที่สุดขนาดที่เอาไปให้เมียใช้แล้วไม่บ่น

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

อัปเดต 1 : คุณ Pikaboyz Pikaz เสนอว่าให้ดึง API ค่าเงินเยนปัจจุบันมาใช้ เออดีเหมือนกัน เลยปรับมาใช้ตามนี้ครับ (ทำเองไม่เป็นหรอก ให้น้องเจมช่วยเขียน) ตอนนี้ไฟล์ใหญ่ขึ้นเป็น 1.71KB

อัปเดต 2 : สรุปว่าถ้ากด enter แล้วจะเป็นการเคลียร์ input เลย แล้วเพิ่ม input history ข้างล่าง เผื่อเปรียบเทียบราคาของหลายๆ ชิ้นไง ขนาดไฟล์ใหญ่ขึ้นจึ๋งนึง ช่างมัน ยังไม่เกิน 3KB ไม่น่าเปลืองเน็ตมั้ง…

ลองใช้ AI เขียนเว็บค้นคอร์ดเพลง

ผมหัดเล่นอูคูเลเล่ เกาๆ ง้องแง้งที่บ้านมา 2-3 ปีแล้วครับ เล่นได้แต่คอร์ดง่ายๆ และรู้จักแค่เพลงไทย โดยเฉพาะเพลงรุ่นน้าๆ ลุงๆ เล่นไปทำไมก็ไม่รู้ ลูกเมียก็ไม่ได้อินด้วย ใช้เวลาหลังกินข้าว หยิบอู๊คกระป๋อง (มันทำจากกระป๋องคุกกี้กล่องแดง) มานั่งดีดๆ เปิดเพลงจากเว็บต่างๆ แล้วทยอยเซฟภาพคอร์ดที่เล่นแล้วรอดไว้ในเครื่อง บางทีอันไหนดีดยากก็เขียนๆ แก้ๆ เป็นคอร์ดที่เราเล่นเป็นเท่านั้น

แต่หลังๆ เพลงมันเริ่มเยอะ ก็ย้ายไฟล์ทั้งหมดไปบน Google Drive พอนับดูได้ 500 กว่าไฟล์แล้วก็พบว่า พอไฟล์เยอะ การเปิดแท็บเล็ตหรือมือถือแล้วไถหาเพลงที่ต้องการที่เซฟไว้ มันยาก

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

แล้วเมื่อวานก็ได้ลองเล่น DeepSeek ที่เป็น AI ตัวใหม่จากแดนมังกร หลังจากกลั่นแกล้งน้องไปพอสมควรแล้ว ก็นึกได้ว่า เอ๊ะ ถ้าจะบอกน้องให้ลองทำเว็บที่ตอบโจทย์นี้จะได้แค่ไหนกันนะ

บ่ายวันนี้ก่อนไปรับลูกกลับจากโรงเรียน เลยลองพิมพ์บรีฟไปคร่าวๆ เหมือนเป็นลูกค้าที่สั่งคนทำเว็บ

ต้องการโค้ด HTML+ inline JavaScript เพื่อสร้างเว็บ 1 page HTML ง่ายๆ 1 หน้า โดยมีฟีเจอร์ดังนี้
– หน้าเว็บโล่งๆ
– ด้านบนเป็นช่อง text input
– ถัดมา เป็นรายชื่อไฟล์รูปภาพทั้งหมดใน sub folder ชื่อ song ขึ้นมาแสดงเรียงกันตามตัวอักษร แสดงเฉพาะชื่อไฟล์ ไม่ต้องแสดงนามสกุล เมื่อคลิกแล้วจะลิงก์เปิดไฟล์นั้นขึ้นมา
– ช่อง text input ด้านบน เมื่อพิมพ์ตัวอักษรลงไป ให้เหมือนเป็นการ filter search แสดงเฉพาะชื่อไฟล์ที่มี text ที่พิมพ์ลงไปเท่านั้น, update on every input changed
– หากช่อง input ว่าง ให้แสดงชื่อไฟล์ทั้งหมดเหมือนเดิม
– ใต้ช่อง input ให้มีลิงก์ 1 อันเขียนว่า clear, เมื่อกดแล้วจะเคลียร์ text input ด้านบน
– ทั้งหมดนี้ให้เขียนออกมาในไฟล์เดียว

เนี่ย เบื้องต้นต้องการแค่นี้แหละ แล้วน้องก็พ่นออกมายาวเหยียด และน่าหนุกมาก! จนเราที่เกษียณจากการทำเว็บมาเป็นสิบปีแล้วถึงกับตาลุกวาว แต่ต้องออกไปรับลูก งั้นมโนไปก่อนละกันว่ามันจะดีไหม

หลังจากเสร็จทุกธุระในวันนี้แล้วก็เลยมานั่งกดๆ พิมพ์ๆ โต้ตอบกับน้องอีกพักใหญ่ พบว่าน้อง DeepSeek ตอบโจทย์ความต้องการของเราดีมาก ใส่ใจรายละเอียดและชี้ทางแก้ปัญหาต่างๆ

แต่น้องก็ค้าง…

น่าจะเกี่ยวกับที่ขึ้นประกาศวันนี้ว่าโดน attack ครั้งใหญ่จนล่ม (ไม่รู้จะเกี่ยวกับที่เหล่าชาวโลกร่วมใจกันบูลลี่น้องหรือเปล่า) เราก็เลยเอาโค้ดไปคุยต่อกับเพื่อนสนิทอย่าง Gemini

ซึ่งอีนี่ก็พูดมากเหลือเกิน ไม่รู้สินะ เราใช้แบบคร่าวๆ เป็นรุ่น 2.0 (แต่ฟรี) ก็พบว่าความคล่องตัวยังสู้น้องหลามจีนไม่ได้ แต่แกพูดมากจนเราต้องบอกว่าเอาแต่พอดีๆ นะ ซึ่งการที่น้องไม่ล่มนี่ก็ช่วยให้คืบหน้าไปได้ด้วยดี

ด้วยความที่เราก็ไม่ได้เชี่ยวชาญ (เราเขียนโค้ดเองไม่เป็นเลย) ก็เลยนั่งปรับๆ แก้ๆ ไปเรื่อยๆ ถามๆ ตอบๆ ปรับจูนกันจนดึกดื่น คือดีไซน์น้องนี่สั่งให้สวยได้นะ แต่มันจะสวยแบบแปลกๆ นิดนึง ส่วนงาน UX/UI จึงค่อนข้างเป็นงานทำมือ แต่ทำเสร็จก็ส่งให้น้อง optimize ได้อีกต่อ

จนในที่สุดก็ได้เว็บนี้มา 5555555 สนุกง่ะ ขอแนะนำำำำำ

เว็บไซต์นี้เป็นเว็บทดลอง โดยใช้ AI คือ DeepSeek และ Gemini ทำขึ้นมาใช้เองส่วนตัว เอาไว้รวบรวมคอร์ดเพลงไว้ฝึกซ้อมอูคูเลเล่ มีฟีเจอร์หลัก ๆ ดังนี้

(ทีแรกจะบรรยายฟีเจอร์เอง แต่นี่ง่วงแล้ว นึกได้ว่าน้องก็อยู่กับเรามาทั้งคืน เลยขอโยนให้ จมน แนะนำแทน)

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

เออ มีทิปนิดนึงคือ

  • เว็บจะแสดง 50 เพลงแบบสุ่ม ยกเว้นถ้าเราพิมพ์ “all” หรือ “*” หรือไม่ก็ไปกดลิงก์ด้านล่างก็ได้ มันจะโชว์ทั้งหมดเรียงตามตัวอักษร
  • เพลงไหนเคยเล่นแล้ว ปุ่มมันจะมืดๆ ไป 1 วัน ยกเว้นจะกดรีเซ็ต (เป็นการล้างแคช) – ระยะเวลา 1 วันนี่ลองใส่ไว้ก่อน เดี๋ยวใช้ไปเรื่อยๆ อาจจะปรับเป็น 7 วันหรืออะไรก็แล้วแต่
  • ถ้าพิมพ์เพลงที่ไม่มี มันจะไม่เจอใช่มะ ให้ลองกดหาในกูเกิล มันจะเอาคำที่เราพิมพ์นั่นแหละ ไปค้นในเว็บค้นหาคอร์ดเว็บอื่นๆ
  • ถ้าเปิดในมือถือหรือแท็บเล็ต จะมีตัวเลือกให้ลองติดตั้งเป็นแอป (progressive webapp) ได้เลย ดังนั้นนี่ก็เหมือนเป็นแอปแอปนึงละ กด add to home / install ได้เลย จะได้จิ้มง่ายๆ

พอมาถึงตอนนี้ก็พบว่า ถึงจะเขียนโค้ดไม่เป็น แต่การสั่งๆๆ บรีฟๆๆ ใส่เอไอ แล้วให้น้องบ้วนออกมาเป็นของที่เราอยากได้มานานนี่ มันสนุกจัง!

ฝันว่ากอดแม่

สัปดาห์ที่ผ่านมาเป็นช่วงเคลียร์งานงานหนึ่งที่จำเป็นต้องใช้เวลาทั้งวันทั้งคืนในการทำ แล้วดันมีอยู่คือหนึ่งที่ฝันถึงแม่

ตื่นมาจำได้แม่น ประทับใจมาก อยากวาดเล่าเรื่องฝันนี้มาก แต่ด้วยภาระท่วมตัวที่ยังปั่นงานไม่เสร็จสักที เลยวาดทิ้งไว้ก่อนตอนพักกินก๋วยเตี๋ยว ผ่านมาสามสี่วันพองานเสร็จเลยวาดต่อจนจบ โดยที่ทั้งภาพและเริ่องราวในฝันยังคงจำได้ชัดเจน

พอวาดจบแล้วก็มานึกได้ว่า เออ ใครมันจะไปเข้าใจกูวะ…