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

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

Happy hues

Happy Hues - Curated colors in context.
See color palette inspiration on a real example website. As you click on different palettes every color on this site updates to give you context of how that color could be used for your design or illustration projects.

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

Paletton

Paletton - The Color Scheme Designer
In love with colors, since 2002. A designer tool for creating color combinations that work together well. Formerly known as Color Scheme Designer. Use the color wheel to create great color palettes.

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

Flat ui colors 2

Flat UI Colors 2 - 14 Color Palettes, 280 colors 🎨
280 handpicked colors ready for COPY & PASTE

base text color, warning color, alert color, succes color และสีในบริบทอื่นๆ หากคิดไม่ออกผมก็จิ้มเลือกจากในนี้เลยครับ ชุดสีในนี้จะทำให้สีภายในเว็บโดยรวมออกมาดูเข้ากันอย่างมาก

สรุป

ในการพัฒนาแอปพลิเคชันช่วงแรกๆ เราควรเน้นที่ features การใช้งานเป็นหลักไปก่อน ว่ามันทำงานได้ตามที่เราต้องการไหม เรื่องสีให้เป็นรองไป ดังนั้นผมเลยไม่ค่อยอยากเสียเวลากับเรื่องสีมาก ซึ่งสุดท้ายแล้วถ้า features มันออกมาครบ แล้วก็ใช้สีพื้นๆ ไปก่อน สุดท้ายเราค่อยไปให้ designer เขาดูเรื่องสีแทนเราอีกที

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