UX/UI คืออะไร ต่างกันยังไง งาน UX/UI Designer ทำอะไรบ้าง
สรุปสั้น ๆ
- UX (User Experience) คือประสบการณ์ทั้งหมดที่ผู้ใช้มีต่อบริษัท บริการ และผลิตภัณฑ์ ส่วน UI (User Interface) คือหน้าจอ ปุ่ม สี และตัวอักษรที่ผู้ใช้เห็นและกด UI จึงเป็นส่วนหนึ่งของ UX ไม่ใช่สิ่งเดียวกัน
- UX/UI Designer ทำงานเป็นวงจร หาข้อมูลผู้ใช้ วาง User Flow ทำ Wireframe และ Prototype ทดสอบกับผู้ใช้ แล้วส่งงานให้ทีมพัฒนา ดูหน้าที่จริงได้จาก ตัวอย่าง Super Resume สาย UX/UI ซึ่งเปิดดูได้โดยไม่ต้องเข้าสู่ระบบ
- สิ่งที่ช่วยให้ได้งานคือพอร์ตที่เล่ากระบวนการคิด ไม่ใช่แค่ภาพสวย พร้อมแล้วเริ่ม หางาน UX/UI ในหมวดงานออกแบบ บน JOBTOPGUN
UX/UI คือ 2 ส่วนของการออกแบบสินค้าดิจิทัล เช่น แอปและเว็บไซต์ UX ดูว่าผู้ใช้ทำสิ่งที่ต้องการได้ง่ายและรู้สึกดีแค่ไหนตลอดการใช้งาน ส่วน UI คือหน้าตาที่ผู้ใช้เห็นและกด
ในงานจริง หลายบริษัทรวม 2 หน้าที่นี้เป็นตำแหน่งเดียวชื่อ UX/UI Designer (บางคนพิมพ์ติดกันว่า UXUI)
UX คืออะไร
UX ย่อมาจาก User Experience หมายถึงประสบการณ์ทั้งหมดที่ผู้ใช้มีต่อบริษัท บริการ และผลิตภัณฑ์ ตามนิยามของ Don Norman และ Jakob Nielsen แห่ง Nielsen Norman Group UX ไม่ได้จบแค่หน้าจอ แต่เริ่มตั้งแต่ค้นหา สมัคร ใช้งาน ไปจนถึงตอนติดต่อขอความช่วยเหลือ
ลองนึกถึงการสั่งอาหารผ่านแอป UX คือทุกขั้นตั้งแต่หาร้าน เลือกเมนู จ่ายเงิน จนรู้ว่าอาหารอยู่ตรงไหน ถ้าคุณสั่งเสร็จเร็วและไม่สับสน แปลว่า UX ดี
การออกแบบ UX (UX Design) คือกระบวนการสร้างสินค้าให้ผู้ใช้ได้ประสบการณ์ที่ตรงกับสิ่งที่ต้องการ งานหลักคือหา Pain Point หรือจุดที่ผู้ใช้ติดขัด แล้วออกแบบทางแก้
UI คืออะไร
UI ย่อมาจาก User Interface คือส่วนที่ผู้ใช้เห็นและโต้ตอบด้วย เช่น ปุ่ม เมนู สี ตัวอักษร ไอคอน และการจัดวางบนหน้าจอ การออกแบบ UI เน้นหน้าตาและสไตล์ให้ใช้ง่ายและน่าใช้ และไม่ได้มีแค่หน้าจอ อินเทอร์เฟซแบบสั่งด้วยเสียงก็นับเป็น UI เช่นกัน
ในแอปสั่งอาหารเดิม ปุ่ม “สั่งเลย” ที่สีเด่น กดง่าย และราคาที่อ่านชัด คือผลงานของ UI
นักออกแบบ UI มักทำ Design System ไว้ด้วย คือชุดสี ตัวอักษร และปุ่มที่ใช้ซ้ำทั้งแอป ให้ทุกหน้าเป็นแบบเดียวกัน
UX กับ UI ต่างกันอย่างไร
UX ตอบว่าผู้ใช้ทำสิ่งที่ต้องการได้สำเร็จและง่ายไหม ส่วน UI ตอบว่าหน้าตาและการกดใช้งานเป็นอย่างไร UI เป็นส่วนหนึ่งของ UX และ Nielsen Norman Group เตือนว่า UX ทั้งหมดกับ UI เป็นคนละเรื่อง UI สำคัญมากก็จริง แต่หน้าจอสวยไม่ได้แปลว่าใช้งานง่าย
| หัวข้อ | UX (User Experience) | UI (User Interface) |
|---|---|---|
| คำถามที่ตอบ | ผู้ใช้ทำสิ่งที่ต้องการได้สำเร็จ ง่าย และรู้สึกดีไหม | หน้าจอดูเป็นอย่างไร กดตรงไหน อ่านง่ายไหม |
| งานที่ทำ | วิจัยผู้ใช้ วาง User Flow ทำ Wireframe ทดสอบกับผู้ใช้ | เลือกสี ตัวอักษร ปุ่ม ไอคอน จัด Layout ทำ Design System |
| ผลงานที่ส่ง | ผลวิจัย แผนผัง Flow, Wireframe, Prototype | หน้าจอแบบละเอียด (High-fidelity) และชุด Design System |
| ดูว่าดีจากอะไร | ผู้ใช้ทำงานเสร็จโดยไม่ติดขัด | หน้าตาสม่ำเสมอ อ่านง่าย กดง่าย |
UX/UI ไม่ได้แปลว่าออกแบบเว็บไซต์อย่างเดียว งานนี้รวมถึงแอปมือถือ ระบบในองค์กร และตู้กดบริการ
อีกเรื่องที่คนสับสนคือคิดว่า UX คือหน้าแรกของเว็บ ส่วน UI คือโครงสร้าง ความจริงกลับกัน โครงสร้างและลำดับการใช้งานเป็นงาน UX หน้าตาของทุกหน้าเป็นงาน UI
ในทีมเล็ก คนเดียวมักทำทั้ง 2 ฝั่ง ประกาศงานจึงใช้ชื่อรวมว่า UX/UI Designer
UX/UI Designer ทำอะไรบ้าง
UX/UI Designer เปลี่ยนปัญหาของผู้ใช้ให้เป็นหน้าจอที่ทีมพัฒนาสร้างได้ งานเป็นวงจร เริ่มจากเข้าใจโจทย์ หาข้อมูลผู้ใช้ วาง User Flow ทำ Wireframe ออกแบบ UI และ Prototype ทดสอบกับผู้ใช้ ส่งมอบงานให้ทีมพัฒนา แล้วนำผลมาปรับในรอบถัดไป
งานในแต่ละวัน
งานในแต่ละวันของ UX/UI Designer มีทั้งประชุมกับ Product Manager และ Developer ออกแบบหน้าจอ ดูผลทดสอบ และอธิบายเหตุผลของแบบให้ทีม
หลายทีมทำงานแบบ Agile ที่แบ่งงานเป็นรอบสั้น ๆ จึงต้องส่งงานทีละส่วนและรับฟีดแบ็กบ่อย
ตัวอย่าง Super Resume บน JOBTOPGUN เป็นโปรไฟล์สมมติของ UX/UI Manager ที่เริ่มจากตำแหน่ง UX/UI Designer เปิดดูได้โดยไม่ต้องเข้าสู่ระบบ ส่วน “ความรับผิดชอบ” ของตัวอย่างนี้เขียนว่า “ดูแลกระบวนการออกแบบทั้งหมด ตั้งแต่งานวิจัยผู้ใช้ การออกแบบ UX Flow ไปจนถึง UI ระดับ High-fidelity และการส่งมอบงานให้ทีมพัฒนา”
งานต่างกันไปตามองค์กร
ขอบเขตงานของ UX/UI Designer ต่างกันไปตามองค์กร ตำแหน่งชื่อเดียวกันอาจมีหน้าที่ไม่เท่ากัน ก่อนสมัครจึงควรอ่านหน้าที่ในประกาศงานให้ละเอียด ไม่ดูแค่ชื่อตำแหน่ง
ตำแหน่งงานสาย UX/UI และอาชีพที่ใช้ทักษะ UX/UI
นอกจาก UX/UI Designer ยังมีตำแหน่งเฉพาะทาง เช่น UX Researcher, UX Writer และ Product Designer มีตำแหน่งหัวหน้าอย่าง UX/UI Manager และมีอาชีพข้างเคียงที่ใช้ทักษะ UX/UI ทุกวัน ตารางนี้สรุปว่าแต่ละตำแหน่งทำอะไรและทำงานกับใคร
| ตำแหน่ง | ทำอะไรเป็นหลัก | ทำงานใกล้กับใคร |
|---|---|---|
| UX Designer | วาง User Flow ทำ Wireframe และ Prototype ทดสอบกับผู้ใช้ | Product Manager, UX Researcher |
| UI Designer | ออกแบบหน้าจอแบบละเอียด ดูแล Design System | UX Designer, Front-end Developer |
| UX/UI Designer | ทำทั้งฝั่ง UX และ UI ในคนเดียว | Product Manager, Developer |
| UX Researcher | สัมภาษณ์ผู้ใช้ จัดทดสอบ สรุปสิ่งที่พบให้ทีม | UX Designer, Product Manager |
| UX Writer | เขียนข้อความบนปุ่ม เมนู และข้อความแจ้งเตือน | UX/UI Designer |
| Product Designer | ออกแบบทั้งผลิตภัณฑ์ และร่วมตัดสินใจว่าจะทำฟีเจอร์ไหน | Product Manager, ทีมธุรกิจ |
| UX/UI Manager | ดูแลทีมออกแบบ วางมาตรฐานงาน และตรวจงานก่อนส่ง | หัวหน้าฝ่ายผลิตภัณฑ์, หัวหน้าทีมพัฒนา |
ตำแหน่งเหล่านี้อยู่ในหมวด งานออกแบบและสถาปัตยกรรม บน JOBTOPGUN
อาชีพที่ได้ประโยชน์จากทักษะ UX/UI
- Graphic Designer: ออกแบบโดยคิดถึงการใช้งานจริง ไม่ใช่แค่ความสวย ดูความต่างได้ใน งานกราฟิกดีไซน์คืออะไร
- Digital Marketer: ทำ Landing Page ที่คนอ่านแล้วกดต่อได้ง่าย
- Web/App Developer: เข้าใจเหตุผลของแบบที่ได้รับ ทำงานกับนักออกแบบได้ราบรื่นขึ้น อ่านต่อที่ Developer คืออะไร
- Product Manager: ใช้มุมมองผู้ใช้ตัดสินใจว่าจะทำหรือปรับฟีเจอร์ไหนก่อน
- Business Analyst: เก็บความต้องการของธุรกิจและเขียน Requirement ให้ตรงกับสิ่งที่ผู้ใช้ต้องทำจริง
ทักษะและเครื่องมือที่ UX/UI Designer ต้องใช้
ทักษะของ UX/UI Designer มี 2 ฝั่ง ฝั่งงานคือวิจัยผู้ใช้ วาง Flow ทำ Wireframe และ Prototype จัด Layout สีและตัวอักษร ฝั่งคนคือเข้าใจผู้ใช้ ฟังเก่ง และอธิบายเหตุผลของแบบให้ทีมยอมรับ ส่วนเครื่องมือเรียนตามทีหลังได้
Hard Skills
- วิจัยผู้ใช้: สัมภาษณ์ สังเกต และสรุปสิ่งที่พบ
- วาง User Flow และ Information Architecture (การจัดลำดับเนื้อหาและเมนู)
- ทำ Wireframe และ Prototype ที่กดลองใช้ได้
- จัด Layout สี ตัวอักษร และทำ Design System
- Usability Test หรือการทดสอบกับผู้ใช้จริง
Soft Skills
- เห็นอกเห็นใจผู้ใช้ มองปัญหาจากมุมของคนใช้งาน
- ฟังเก่ง จับได้ว่าผู้ใช้ติดขัดตรงไหน
- อธิบายเหตุผลของแบบ และรับฟีดแบ็กโดยไม่ยึดติดกับแบบแรก
เครื่องมือที่ใช้
Figma ใช้ออกแบบหน้าจอและทำ Prototype ร่วมกันในทีม ในตัวอย่าง Super Resume ของ UX/UI Manager มีทักษะ Figma, Adobe XD, InVision, Framer, Webflow และ Zeplin อ่านรายละเอียดโปรแกรมออกแบบแต่ละตัวได้ใน โปรแกรมที่ใช้ในงานกราฟิก
ใช้เครื่องมือไหนคล่องแล้ว ใส่ลงใน “ทักษะของฉัน” ของ Super Resume แล้วเลือก “ระดับความเชี่ยวชาญ” 5 ระดับ คือ เชี่ยวชาญ ชั้นสูง ขั้นกลาง ขั้นต้น และกำลังศึกษา เรซูเม่จะจัดกลุ่มทักษะตามระดับให้
เข้าสู่ระบบหรือสร้าง Super Resume ก่อน แล้วไปที่ Super Resume ของคุณ
ความรู้เรื่องโค้ดที่ควรมี
UX/UI Designer ไม่จำเป็นต้องเขียนโค้ดเป็น แต่รู้ HTML และ CSS พื้นฐานช่วยให้รู้ว่าแบบไหนสร้างได้จริง คำแนะนำว่าต้องเรียน React ก่อนเป็นเส้นทางของสาย Developer ไม่ใช่เงื่อนไขของงานออกแบบ
AI กับงาน UX/UI
AI ช่วยงาน UX/UI ส่วนที่ใช้เวลามากให้เร็วขึ้น เช่น ร่างไอเดียหน้าจอ ร่างข้อความบนปุ่ม หรือสรุปบันทึกสัมภาษณ์ผู้ใช้ แต่การตัดสินว่าแบบไหนแก้ปัญหาของผู้ใช้จริง การคุยกับผู้ใช้ การทดสอบ และการอธิบายเหตุผลกับทีม ยังต้องใช้คน
AI ไม่ได้แปลว่างาน UX/UI จะหายไป คนที่ใช้ AI เป็นมักร่างงานได้เร็วกว่า แล้วเหลือเวลาให้งานที่ต้องใช้วิจารณญาณ เริ่มลองได้จาก AI ช่วยทำงาน
Portfolio UX/UI ที่ดี และตัวอย่างการเล่างาน
พอร์ต UX/UI ที่ดีเล่ากระบวนการ ไม่ได้โชว์แค่ภาพหน้าจอ แต่ละโปรเจกต์บอกว่าโจทย์คืออะไร คุณหาข้อมูลผู้ใช้อย่างไร ลองแบบไหน ทดสอบแล้วเจออะไร และปรับอะไร ตอนสมัครงาน 3–4 โปรเจกต์ที่เล่าละเอียดบอกฝีมือได้มากกว่าภาพสวยหลายสิบชิ้น
โครงเรื่องของแต่ละโปรเจกต์ (Case Study)
- โจทย์: ปัญหาคืออะไร ใครเจอ
- ข้อมูลผู้ใช้: คุยกับใคร ได้ข้อสรุปอะไร
- ทางเลือก: ร่างไว้กี่แบบ ทำไมเลือกแบบนี้
- Prototype: หน้าจอสำคัญพร้อมคำอธิบาย
- ผลทดสอบ: ผู้ใช้ทำสำเร็จไหม ติดตรงไหน
- สิ่งที่ปรับ: แก้อะไรหลังทดสอบ
ตัวอย่างการเล่างาน (สมมติ): “แอปจองคิวคลินิกเดิมมีขั้นตอนจอง 6 หน้า ผมสัมภาษณ์ผู้ใช้ 5 คน พบว่าทุกคนงงตอนเลือกแพทย์ จึงรวมเหลือ 3 หน้า และทดสอบซ้ำจนทุกคนจองได้โดยไม่ต้องถาม”
ยังไม่มีงานจริงก็ทำพอร์ตได้
เลือกแอปที่คุณใช้ทุกวัน หาจุดที่ใช้ยาก แล้วออกแบบใหม่ตามโครงด้านบน หรือรับ งานฟรีแลนซ์ เล็ก ๆ ให้มีโจทย์จริง อ่านเพิ่มที่ Portfolio กับ Resume ต่างกันอย่างไร
เมื่อพอร์ตพร้อม เข้าสู่ระบบ Super Resume แล้วแนบไฟล์ใน “เอกสารแนบของฉัน” ด้วยปุ่ม “เพิ่มเอกสาร” (PDF, DOC, DOCX, PNG หรือ JPG ไม่เกิน 5MB ต่อไฟล์)
เพิ่มรูปผลงานได้สูงสุด 4 รูปพร้อมคำบรรยายในส่วน “เส้นทางอาชีพของฉัน” ซึ่งขึ้นในเรซูเม่ว่า “ภาพไฮไลท์การทำงาน”
HR พิจารณาข้อมูลใน Super Resume เป็นหลัก จึงควรเขียนผลงานลงในประสบการณ์ทำงานด้วย ไม่ใช่แนบไฟล์อย่างเดียว
เปลี่ยนสายมาทำ UX/UI เริ่มจากพื้นฐานที่มี
คุณเปลี่ยนมาทำ UX/UI ได้จากหลายพื้นฐาน ไม่มีปริญญาเดียวที่บังคับ ขั้นตอนที่ใช้ได้กับทุกคนคือเรียนพื้นฐาน UX และ Figma เริ่มจากโปรเจกต์ของตัวเอง 2–3 ชิ้น ทดสอบกับคนจริง เขียนเป็น Case Study แล้วเริ่มสมัครงานหรือฝึกงาน
แต่ละพื้นฐานได้เปรียบคนละเรื่อง และต้องเติมคนละส่วน
- Graphic Designer: เก่งสี ตัวอักษร และ Layout ต้องเพิ่มการวิจัยผู้ใช้
- Developer: รู้ว่าแบบไหนสร้างได้จริง ต้องเพิ่มหลักออกแบบ
- งานวิจัยหรืองานบริการลูกค้า: เข้าใจผู้ใช้ ต้องฝึกออกแบบหน้าจอ
เรียนคอร์สเดียวไม่ได้แปลว่าจะได้งาน ผู้สัมภาษณ์มักดูพอร์ตก่อนใบประกาศนียบัตร
อยากรู้ว่ามีจุดแข็งที่งานนี้ใช้ไหม ลองทำ Strengths Assessment ซึ่งให้เลือกจุดแข็งจาก 101 ข้อ แล้วจัด 5 อันดับแรก จุดแข็งที่เข้ากับงาน UX เช่น เห็นอกเห็นใจผู้อื่น เป็นผู้ฟังที่ดี และมีความคิดสร้างสรรค์
หน้าแนะนำเปิดดูได้เลย ส่วนการทำแบบประเมินต้องเข้าสู่ระบบ Super Resume
เงินเดือน UX/UI Designer และวิธีประเมิน
สำนักงานสถิติแห่งชาติและคณะกรรมการค่าจ้างยังไม่มีตัวเลขเงินเดือน UX/UI Designer ค่าจ้างเฉลี่ยในการสำรวจภาวะการทำงานของประชากรของสำนักงานสถิติแห่งชาติแยกตามอุตสาหกรรม ภาค และเขตการปกครอง ไม่ได้แยกตามอาชีพ วิธีที่ใช้ได้จริงคือดูช่วงเงินเดือนในประกาศงานที่ตรงกับระดับประสบการณ์และเมืองของคุณ
อัตราค่าจ้างตามมาตรฐานฝีมือของคณะกรรมการค่าจ้างไม่มีสาขาออกแบบ จึงใช้เทียบไม่ได้ เวลาเทียบประกาศ ให้เทียบตำแหน่งระดับเดียวกัน (Junior ถึง Lead และ Manager) เพราะเงินเดือนต่างกันตามระดับตำแหน่ง
ตัวเลขตามโพสต์ต่าง ๆ มักไม่บอกที่มา อย่าใช้เป็นฐานเรียกเงินเดือนอย่างเดียว เปิดประกาศจริงใน หางานออกแบบ เทียบหลาย ๆ ที่ แล้วอ่านวิธีคิด เรียกเงินเดือนเท่าไหร่ดี ก่อนไปสัมภาษณ์
Career Tip จาก JOBTOPGUN
เขียนทุกโปรเจกต์ในพอร์ตเป็นประโยคเดียวแบบ “ปัญหา → สิ่งที่ทำ → ผลที่วัดได้” แล้วใช้ประโยคเดียวกันในส่วน “ความรับผิดชอบ” และ “ความสำเร็จในการทำงาน” ของ Super Resume HR จะเห็นเรื่องเดียวกันทั้งในโปรไฟล์และพอร์ต
คำถามที่พบบ่อย
UX/UI ย่อมาจากอะไร
UX ย่อมาจาก User Experience หรือประสบการณ์ผู้ใช้ ส่วน UI ย่อมาจาก User Interface หรือส่วนที่ผู้ใช้เห็นและโต้ตอบด้วย
UX/UI Designer ต้องเขียนโค้ดเป็นไหม
ไม่จำเป็น แต่รู้ HTML และ CSS พื้นฐานช่วยให้ออกแบบสิ่งที่สร้างได้จริง และทำงานกับ Developer ได้ราบรื่นขึ้น
เรียนคณะอะไรถึงทำงาน UX/UI ได้
ไม่มีคณะเดียวที่บังคับ ผู้สัมภาษณ์มักดูพอร์ตที่เล่ากระบวนการคิดมากกว่าใบปริญญา
UX/UI ต่างจาก Graphic Designer อย่างไร
Graphic Designer สื่อสารด้วยภาพ เช่น โปสเตอร์และโลโก้ ส่วน UX/UI Designer ออกแบบสิ่งที่คนกดใช้งาน และทดสอบกับผู้ใช้ว่าใช้ได้จริง
พร้อมเริ่มงานสายนี้แล้ว ดูประกาศ งานออกแบบและสถาปัตยกรรม บน JOBTOPGUN แล้วพิมพ์ UX/UI ในช่องค้นหา
ก่อนสมัคร สร้าง Super Resume ใส่ทักษะ แนบไฟล์พอร์ต และเพิ่มรูปผลงานให้ HR เห็นฝีมือของคุณ
แหล่งอ้างอิง
- Don Norman และ Jakob Nielsen, The Definition of User Experience (UX), Nielsen Norman Group nngroup.com
- สำนักงานสถิติแห่งชาติ, การสำรวจภาวะการทำงานของประชากร ทั่วราชอาณาจักร ไตรมาสที่ 2 : เมษายน–มิถุนายน 2569 (รายงานฉบับเต็ม, ตารางค่าจ้างเฉลี่ยต่อเดือนของลูกจ้าง)
- ประกาศคณะกรรมการค่าจ้าง เรื่อง อัตราค่าจ้างตามมาตรฐานฝีมือ (ฉบับที่ 13, 14 และ 15) กระทรวงแรงงาน
