Dummy Services - Copy this React, Tailwind Component to your project
Objective: Thiết kế giao diện website giúp sinh viên truy cập dễ dàng vào các dịch vụ thủ tục hành chính, với khoảng 100 dịch vụ, mang tính trực quan và tối ưu trải nghiệm người dùng. Prompt: Trang chủ (Homepage): Hiển thị thanh tìm kiếm lớn ở trung tâm để sinh viên dễ dàng tìm kiếm dịch vụ cụ thể. Sử dụng các thẻ hoặc mục danh sách các dịch vụ phổ biến nhất ngay trên trang chủ để sinh viên dễ tiếp cận. Cung cấp danh sách các loại dịch vụ được phân loại theo chủ đề (ví dụ: Học vụ, Tài chính, Học bổng, Hỗ trợ sinh viên quốc tế, v.v.) với các biểu tượng và mô tả ngắn để sinh viên nhanh chóng xác định dịch vụ họ cần. Tích hợp các nút "Hỗ trợ trực tuyến" hoặc "Liên hệ" dễ thấy, có thể là chatbot hoặc số điện thoại/email liên hệ. Trang Dịch Vụ (Services Page): Mỗi dịch vụ có một thẻ riêng với tiêu đề, mô tả ngắn và nút “Chi tiết”. Cung cấp tính năng lọc (filter) và sắp xếp (sort) theo các loại dịch vụ hoặc thời gian xử lý. Hiển thị số lượt sinh viên đã sử dụng hoặc đánh giá cho từng dịch vụ để tạo độ tin cậy. Nút “Yêu cầu dịch vụ” (Request Service) dễ nhìn và có thể thêm vào giỏ (cart style) để đăng ký nhiều dịch vụ cùng lúc. Trang Chi Tiết Dịch Vụ (Service Details Page): Hiển thị đầy đủ thông tin dịch vụ, yêu cầu, thời gian xử lý, các bước thực hiện. Có nút “Bắt đầu quy trình” (Begin Process) hoặc “Liên hệ hỗ trợ” nếu sinh viên có thắc mắc. Thêm phần hướng dẫn điền hồ sơ hoặc quy trình minh họa bằng các biểu đồ hoặc video ngắn. Tính năng khác: Tích hợp thông báo (notification) qua email hoặc SMS khi dịch vụ đã được xử lý hoặc cập nhật. Phần “Lịch sử dịch vụ” (Service History) trong tài khoản người dùng để sinh viên xem lại các dịch vụ đã thực hiện. Giao diện responsive cho điện thoại và máy tính bảng để sinh viên dễ sử dụng trên mọi thiết bị. Tính thẩm mỹ và thiết kế UX/UI: Thiết kế sạch sẽ, sử dụng màu sắc thân thiện, dễ nhìn. Phông chữ rõ ràng, kích thước phù hợp. Các biểu tượng dịch vụ trực quan và thống nhất. Cung cấp điều hướng rõ ràng và chỉ dẫn dễ hiểu cho từng bước thực hiện dịch vụ.
