Quản lý đa phương tiện và bộ nhận diện HCM-UTE

Phân hệ Quản lý đa phương tiện (Media Library) là kho lưu trữ tập trung toàn bộ hình ảnh, biểu trưng, video và tài liệu của website đơn vị tại Trường Đại học Công nghệ Kỹ thuật TP.HCM (HCM-UTE).

---

Tác vụ 1: Tải hình ảnh hoặc tệp tài liệu mới lên thư việnCopy Anchor Link

Mục đíchCopy Anchor Link

Đưa hình ảnh hoạt động, tài liệu hội thảo hoặc ảnh chụp sự kiện của đơn vị lên kho lưu trữ để sử dụng cho các bài viết và trang web.

Các bước thực hiệnCopy Anchor Link

1. Tại menu trái, Thầy/Cô chọn Quản lý nội dung → chọn Đa phương tiện.
2. Bấm nút màu xanh + Tải lên ở góc trên bên phải thanh công cụ (hoặc kéo thả tệp trực tiếp từ máy tính vào màn hình trình duyệt).
3. Chọn một hoặc nhiều bức ảnh từ máy tính.
4. Bấm vào bức ảnh vừa tải lên, điền thêm ô Văn bản thay thế (Alt text) miêu tả ngắn về bức ảnh (ví dụ: Lễ bế giảng và trao bằng tốt nghiệp đợt 1 năm 2026).
5. Bấm Lưu thông tin.

Kết quảCopy Anchor Link

Hình ảnh được lưu an toàn trong kho và hiển thị ngay trên lưới thư viện, sẵn sàng để chèn vào bài viết chỉ với 1 cú nhấp chuột.

Lưu ý nếu cóCopy Anchor Link

• Hệ thống sẽ tự động tối ưu ảnh sang định dạng WebP hiện đại để website tải cực nhanh trên điện thoại mà vẫn giữ nguyên độ sắc nét.
• Thầy/Cô nên chọn ảnh rõ nét, dung lượng khuyến nghị mỗi ảnh dưới 5MB.

---

Tác vụ 2: Khai thác kho Logo & Biểu trưng trong tab Bộ nhận diện HCM-UTECopy Anchor Link

Mục đíchCopy Anchor Link

Sử dụng logo và họa tiết nhận diện chính thức của Trường với màu sắc và tỷ lệ chuẩn xác nhất, tránh tình trạng lấy ảnh mờ hoặc sai logo cũ từ trên mạng.

Các bước thực hiệnCopy Anchor Link

1. Tại màn hình Đa phương tiện, Thầy/Cô bấm chuyển sang tab Bộ nhận diện HCM-UTE ở góc trên bên phải.
2. Tìm kiếm và chọn tài sản số phù hợp:
   • Logo chuẩn màu: Dùng trên nền sáng (Xanh dương #0072BC kết hợp Đỏ #ED1C24).
   • Logo âm bản trắng: Dùng đặt trên các nền màu tối, nền xanh đậm hoặc ảnh chụp phong cảnh.
   • Logo dạng ngang: Dành riêng cho khu vực thanh Header đầu trang hoặc chân trang Footer.
   • Tệp biểu trưng Vector SVG / PNG trong suốt: Tự động hiển thị sắc nét tuyệt đối trên mọi độ phân giải màn hình.
3. Bấm vào tệp để xem trước kích thước, sau đó bấm nút Chèn vào nội dung hoặc Tải về máy tính.

Kết quảCopy Anchor Link

Logo và biểu trưng hiển thị chuẩn xác, trang trọng và đồng bộ hoàn toàn với nhận diện thương hiệu của toàn Trường.

Lưu ý nếu cóCopy Anchor Link

• Tuyệt đối không tự ý kéo dãn làm méo tỉ lệ khung hình của logo hoặc tự đổi tông màu biểu trưng của Trường.

---

Tác vụ 3: Thiết kế Poster, Banner chuẩn tỷ lệ và Vùng an toàn (Safe Zone)Copy Anchor Link

Mục đíchCopy Anchor Link

Bảo đảm toàn bộ tiêu đề chữ, khuôn mặt nhân vật và logo không bị cắt xén hay che khuất khi hiển thị trên các loại màn hình máy tính và điện thoại thông minh.

Hướng dẫn Thiết kế Poster & Vùng an toàn (Blueprint)

Thông số chuẩn HCMUTE

Quy chuẩn kích thước pixel, khoảng cách lề và vùng an toàn chữ.

Máy tính 2.4:1Máy tính 16:9Điện thoại 3:4

BẢN VẼ ĐO LƯỜNG (METRIC BLUEPRINT) — TỈ LỆ 2.4:1

Mặc định trang chủ HCMUTE

Thành phần đo (Metric)	Kích thước	Khoảng cách lề (Offset)	Quy chuẩn kỹ thuật
Canvas Poster tổng	2400 × 1000 px	Tràn viền (0 px)	Ảnh nền hoặc màu phủ kín 100% canvas
Khung nội dung chính	2100 × 620 px	Lề trên/dưới 190 px • Lề trái/phải 150 px	Vùng không bao giờ bị cắt xén trên máy tính
Vùng an toàn Chữ & Logo	1200 × 460 px	Cách trên/dưới 270 px • Cách trái/phải 600 px	Đặt toàn bộ Tiêu đề, Logo, Nút bấm (CTA) tại vùng này
Tỉ lệ khung hình	2.4 : 1 (24:10)	Landscape Widescreen	Chuẩn banner ngang toàn cảnh HCMUTE

Sao chép thông số kỹ thuật 2.4:1

---

🔒 Quy tắc bảo vệ dữ liệu cá nhân trong hình ảnh (Luật số 91/2025/QH15)Copy Anchor Link

Khi đăng tải hình ảnh chụp giao diện phần mềm, văn bản hành chính hoặc hoạt động sinh viên, Thầy/Cô cần lưu ý che mờ các thông tin sau:

1. Địa chỉ email cá nhân / công vụ: Che mờ phần tên người dùng (ví dụ: nguyen***@hcmute.edu.vn).
2. Số Căn cước công dân và tài khoản ngân hàng: Bắt buộc che mờ hoàn toàn.
3. Mã số sinh viên (MSSV) trên thẻ sinh viên: Che bớt các số cuối khi chụp ảnh minh họa gần thẻ.
4. Địa chỉ nhà riêng và số điện thoại cá nhân: Không đưa lên ảnh công khai.

---

⚠️ Các tình huống thường gặp và cách xử lýCopy Anchor Link

Tình huống 1: Tải ảnh chụp bằng điện thoại lên bị xoay ngang hoặc ngược đầu?Copy Anchor Link

• Cách xử lý: Hệ thống tự động nhận diện chiều xoay của ảnh. Nếu ảnh bị ngược, Thầy/Cô bấm vào ảnh trong thư viện, bấm biểu tượng Xoay ảnh và bấm Lưu để hệ thống tự xoay đúng chiều.

Tình huống 2: Ảnh đưa lên web bị mờ khi xem trên màn hình lớn?Copy Anchor Link

• Nguyên nhân: Do ảnh gốc có kích thước quá nhỏ (dưới 800 px chiều rộng).
• Cách xử lý: Thầy/Cô nên chọn ảnh gốc có chiều ngang từ 1920 px trở lên để ảnh hiển thị sắc nét trên cả màn hình máy tính bảng và màn hình máy tính để bàn.