Author: เอกพล ตรีเนตรวรคุณ

UX Design Processes

สวัสดีครับ วันนี้เราจะมาว่ากันด้วยเรื่องของ การออกแบบสินค้าและบริการที่ตอบโจทย์และดีต่อผู้ใช้ การสร้างสินค้าและบริการจะต้องประกอบไปด้วยการออกแบบทางด้านประสบการณ์ของผู้ใช้ หรือ UX เพราะทุกสิ่งที่ถูกคิดค้นหรือสร้างขึ้นล้วนต้องผ่านการคิด วิเคราะห์ สร้างเพื่ออะไร ทำไปทำไม ตอบโจทย์อะไรกับผู้ใช้ ซึ่งการออกแบบมีด้วยกัน 6 ขั้นตอนหลักๆดังนี้ Step 1 : Understanding Environment (Discovery phase) เป็น phase แห่งการทำความเข้าใจ การทำความเข้าใจในที่นี้หมายถึง การที่เราเข้าใจผู้ใช้, เข้าใจ brand, เข้าใจในเงื่อนไขต่างๆ เพื่อที่จะเอามาเป็นแนวทางในการทำ research ให้ phase ถัดไป User การทำความเข้าใจผู้ใช้งานระบบ -> Pain Point discovery…

UX, everything related!

เรามักได้ยินคำว่า UI เป็นประจำเมื่อเราพัฒนาระบบแต่ รู้หรือไม่ว่านอกจาก UI แล้วมันมีอีกหนึ่งอย่างที่ควรรู้และสำคัญยิ่งกว่าแต่ถูกมองข้ามไปคือ UX (ย่อมาจาก User experience) หลายๆคนมักจะสับสนว่า UI และ UX มันคือสิ่งเดียวกัน จริงๆแล้วมันคือคนละอย่างกันเลย วันนี้เราจะมาเล่าให้ฟัง UI :: User Interface User Interface คือหน้าตาของระบบที่ผู้ใช้ได้เห็น ได้ตอบสนอง ไม่ใช่ระบบในทางคอมพิวเตอร์อย่างเดียวที่มี UI ถ้าเทียบกับขวดซอสมะเขือเทศ ขวดก็คือหนึ่งใน UI เช่นกันหรืออาหาร 1 จาน หน้าตาของอาหารก็ถือว่าเป็น UI ด้วย “UI เป็นสิ่งที่สามารถมองเห็นได้หรือจับต้องได้“ UX ::…

สร้างเงาให้กับวัตถุด้วย SmoothShadow

Layer of shadows คือจำนวนชั้นของเงา ปกติโดยทั่วไปเราจะใช้งานกันประมาณ 1-2 layer ซึ่งจำนวนของชั้นเงานี้จะสัมพันธ์กับตัวปรับแต่งด้านล่าง เช่นในรูปตั้งไว้ที่ 4 layers หรือเงา 4 ชั้น เราก็จะสามารถปรับกราฟการไล่เงาซึ่งจะแบ่งไว้ 4 ช่วงของแสงไล่ตั้งแต่ขาวไปดำ 4 ระดับ ถ้าปรับเป็น 7 layers ระบบก็จะซอยช่วงเทาเพิ่มมามากขึ้น ก็จะไล่จากขาวไปดำ 7 ระดับ Final transparency คือความเข้ม/ความโปร่งใสของเงา ค่ายิ่งน้อยเงาของเราจะยิ่งโปร่งแสง(จางขึ้น) ค่ายิ่งมากเงาของเราก็จะยิ่งทึบแสง(เข้มขึ้น) ส่วนของกราฟจะแสดงถึงการไล่แสงของเงา โดยเราจะสามารถดึงจุดวงกลมสีชมพูได้ เพื่อปรับความโค้งของกราฟ เงาก็จะมีการไล่แสงที่ต่างกันออกไป และส่วนของ Reverse alpha คือการกลับกันของเงา ไล่จากขาวไปดำ…

งานกราฟฟิกฟรี ถูกลิขสิทธิ์มีอยู่จริง

ปัจจุบันงานกราฟฟิกได้เข้ามามีบทบาทมากมายในด้านการโฆษณา การขาย การออกแบบและดีไซน์ผลงานต่างๆ รวมถึงการนำมาใช้พัฒนาระบบ หรือ แอพพลิเคชันต่างๆมากมายโดยมาจากการใช้ชุดอักขระ (Font) หรือรูปภาพ Vector ต่างๆมาเป็นส่วนประกอบ เราจะเห็นได้ว่าส่วนใหญ่แล้วเป็นงานลิขสิทธิ์ทั้งสิ้น การที่จะนำมาใช้งานได้ต้องมีการซื้อ License การใช้งานหรือการขออนุญาตจากเจ้าของผลงานก่อน จะทำยังไงหละถ้าเราอยากใช้งานแบบถูกลิขสิทธิ์แถมไม่ต้องจ่ายเงินสักบาท เว็ปไซต์ Creative Market https://creativemarket.com/ เป็นอีกหนึ่งเว็ปไซต์ที่รวบรวมงานศิลปะ, งานกราฟฟิก Vector, Font, Template สำหรับงานออกแบบ, Template สำหรับการสร้างเว็ปไซต์, รูปถ่าย หรือจะเป็น Brush หัวพู่กันในโปรแกรมต่างๆ มารวมไว้เป็น Market ของนักออกแบบหลายๆคนรวมอยู่ในเว็ปไซต์ เราสามารถเข้าไปกดซื้อ แล้วนำมาใช้งานได้เลย สะดวกรวดเร็ว เชื่อถือได้ แต่ แต่…

[Adobe XD Tips] How to สร้าง Prototype จาก UI ที่ออกแบบไว้แล้ว

สวัสดีเพื่อนๆชาว IT/Graphic ทุกท่าน วันนี้เราเคล็ดลับง่ายๆในการสร้าง Prototype ระบบด้วยการนำรูปภาพ User Interface(UI) ที่มีอยู่หรือออกแบบไว้แล้วด้วยเครื่องมือฟรีและดีนั้นคือ Adobe XD Prototype คืออะไร Prototype คือ การทำ Interactive User Interface หรือหน้าตาของระบบที่สามารถตอบสนองต่อผู้ใช้ โดยไม่ต้องเขียน code เลย เช่น การคลิกปุ่มใดปุ่มหนึ่งในหน้า UI ทำให้มีการเปลี่ยนหน้าหรือเปลี่ยนสถานะของ object ในหน้านั้นๆ การทำ Prototype นั้นจะทำให้ Developer สามารถทำงานได้ง่ายขึ้น รู้ Flow การทำงานของระบบ อีกทั้งยังสามารถทำเพื่อใช้ในการนำเสนอระบบงานกับลูกค้าได้โดยไม่ต้อง coding ถึงเวลาลงมือทำกัน…