LibX Website

Wednesday, 07 May 2025

ⓕ 𝕏 in

ภาพรวม

เว็บไซต์แนะนำแอปฯ LibX

บทบาท/หน้าที่

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

Landing page
รองรับการแสดงผลทุกหน้าจอ

ปัญหา/ความท้าทาย

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

แนวคิดการออกแบบ

การออกแบบเว็บไซต์จะเน้นทางด้าน UI/UX เพื่อให้ง่ายในการใช้งานและจะต้องรองรับการแสดงผลทุกหน้าจอ ได้เลือกภาษาโปรแกรมและเครื่องมือ ที่มีประสิทธิภาพในการทำงานและเหมาะสมกับทีมงานที่จะช่วยกันพัฒนาได้อย่างต่อเนื่อง

เทคโนโลยี/เครื่องมือ

Frontend: Vue.js (Quasar) เป็น Framework ที่เป็นที่นิยม ง่ายในการใช้งานและมีประสิทธิภาพ
Styling: Tailwind CSS ใช้ออกแบบ UI/Responsive ของเว็บแอปฯ
DevOps: Docker ใช้สำหรับการ Deploy ระบบในส่วนของ API และใช้ Kong API ในการทำ Reverse proxy Frontend

คุณสมบัติ

Landing page
รองรับการแสดงผลทุกหน้าจอ

ผลลัพธ์

หลังจากที่ได้ออกแบบเว็บไซต์เสร็จและเปิดใช้งาน ข้อมูลที่จัดทำไว้มีความเข้าใจภาพรวมของแอปฯ LibX การเข้าใช้งานเป็นไปอย่างถูกต้อง รวดเร็วและสามารถแสดงผลได้ทุกหน้าจอ