List games by Sprite Kit

Thursday, September 11, 2025

Bài 2 — Panels & Windows: Khung xương của mọi giao diện

 

Panels & Windows: Khung xương của mọi giao diện

Link: Unity Store

Trong thiết kế UI game, panel và cửa sổ đóng vai trò như “khung” bao quanh mọi tương tác. Bộ Mystic Realm GUI Asset mang đến nhiều loại panel khác nhau, phù hợp từ menu chính đến popup nhỏ gọn, tất cả đều đồng bộ về phong cách fantasy.


1. Setting Panel

  • Dùng để tinh chỉnh trải nghiệm cá nhân: âm lượng, đồ họa, gameplay.

  • Bao gồm: header (tiêu đề), body (các lựa chọn), footer (nút Close/Save).

  • Gọn gàng, dễ mở rộng thêm toggle, slider, checkbox.

👉 Thường dùng trong Menu Scene hoặc pause menu.


2. Shop Panel

  • Thiết kế dạng grid hiển thị item (sword, armor, potion...).

  • Góc trên hiển thị currency HUD (coin/gem).

  • Mỗi item card có ảnh, giá, nút Buy.

👉 Đi kèm popup xác nhận giao dịch, đảm bảo trải nghiệm quen thuộc cho người chơi.


3. Quest Panel

  • Hiển thị danh sách nhiệm vụ với icon, mô tả, progress bar.

  • Có nút Claim để nhận thưởng.

  • Hỗ trợ phân loại Daily / Weekly / Main quest.

👉 Kết hợp tuyệt vời với Notification Badge để báo hiệu quest mới.


4. Popup Windows

  • Confirm/Warning: “Bạn có chắc muốn mua?”, “Thoát game?”.

  • Reward Popup: hiển thị coin/gem/sao bay vào HUD.

  • Error Popup: báo lỗi nhẹ nhàng, dễ đọc.

👉 Popup thường nhỏ gọn, với Primary/Secondary button rõ ràng.


5. Modularity trong Panels

Điểm mạnh của Mystic Realm GUI là mỗi panel được thiết kế modular:

  • Header, body, footer tách biệt → dễ hoán đổi, tái sử dụng.

  • Có thể lồng panel này vào panel khác (ví dụ: Shop Panel mở trong Setting Scene).

  • Style đồng bộ → ghép lại vẫn thống nhất.


👉 Kết luận

Panels & Windows trong Mystic Realm GUI Asset mang lại bộ khung UI mạnh mẽ, từ menu cài đặt, shop, quest board, đến popup nhỏ. Chúng không chỉ đẹp mắt mà còn dễ dàng gắn vào logic code, giúp dev tiết kiệm rất nhiều thời gian.

Monday, September 8, 2025

Bài 1 — Buttons: Linh hồn của tương tác

 

Mystic Realm GUI Asset

Bài 1 — Buttons: Linh hồn của tương tác

Link Unity Asset Store: Unity Store

Trong bất kỳ game nào, nút bấm là cầu nối trực tiếp giữa người chơi và trải nghiệm. Bộ Mystic Realm GUI mang đến một hệ thống Button đầy đủ, thống nhất, và cực kỳ linh hoạt.

1. Primary Buttons

  • Dành cho hành động chính: Play, Start, Next.

  • Thiết kế nổi bật với khung viền fantasy, ánh sáng nhấn mạnh.

  • Thích hợp đặt ở màn hình menu, end game panel, popup quan trọng.

👉 Điểm nhấn: Người chơi dễ dàng nhận diện và nhấn ngay không cần suy nghĩ.


2. Secondary Buttons

  • Dùng cho hành động phụ: Back, Option, Close.

  • Nhẹ nhàng, ít gây phân tán sự chú ý.

  • Thường được đặt ở góc panel hoặc popup.

👉 Tạo cảm giác UI “có thứ bậc” rõ ràng.


3. Icon Buttons

  • Dạng hình tròn/vuông chứa biểu tượng: Shop, Quest, Mail, Setting, Inventory.

  • Có thể dùng badge đỏ (notification) để báo hiệu có thông tin mới.

👉 Ví dụ: icon Shop nhấp nháy khi có khuyến mãi.


4. State Variants

Mỗi button đi kèm đủ trạng thái:

  • Normal: bình thường.

  • Hover: sáng lên khi rê chuột.

  • Pressed: thụt nhẹ, đổi màu khi nhấn.

  • Disabled: mờ đi, không bấm được.

👉 Cho phép dễ dàng tạo animation nhỏ, làm UI thêm sống động.


5. Use Case trong Mystic Realm

  • Menu Scene: Play (Primary), Option/Quit (Secondary).

  • Shop: Buy (Primary), Close (Secondary).

  • HUD: Icon Buttons cho Quest, Inventory, Mail.

  • Popup: Confirm (Primary), Cancel (Secondary).


👉 Kết luận

Buttons trong Mystic Realm GUI không chỉ đẹp mắt mà còn có hệ thống logic rõ ràng, giúp game dev dễ sắp xếp UI theo mức độ ưu tiên. Đây là lý do tại sao nhiều indie dev thích dùng Mystic Realm GUI: chỉ cần kéo thả button là đã có ngay tương tác chuyên nghiệp.

Buttons đa dạng nhiều loại, 9-sliced đầy đủ