Bản thiết kế giao diện công cụ so sánh JSON tối màu
Tạo bản thiết kế giao diện người dùng (UI) máy tính để bàn ở chế độ tối, chuyên nghiệp cho công cụ so sánh mã và API JSON.
Câu lệnh
Mục tiêu: Tạo bản thiết kế giao diện ứng dụng máy tính để bàn ở chế độ tối cho công cụ so sánh JSON có tên là Tilted Diffs, hiển thị phần so sánh phản hồi API với tiêu đề API Response — Checkout v2.
Khung hình: Ảnh chụp màn hình máy tính để bàn tỷ lệ 16:10, khoảng 1152×768, với cửa sổ ứng dụng phong cách macOS nổi trên nền gradient xanh đậm. Sử dụng đổ bóng tinh tế, các góc bo tròn, đường viền mỏng và thẩm mỹ công cụ dành cho lập trình viên chuyên nghiệp.
Bố cục: Ứng dụng có 4 vùng chính: 1 thanh bên trái, 1 thanh công cụ phía trên trải dài trên khu vực trình chỉnh sửa, 3 ngăn trình chỉnh sửa mã dọc. Ngăn trình chỉnh sửa đầu tiên được chọn và làm nổi bật bằng ánh sáng xanh dương. Ngăn ở giữa hiển thị các điểm nhấn so sánh (diff) nội dòng có màu sắc. Ngăn ngoài cùng bên phải hẹp và hiển thị một phần, giống như một tab tệp bổ sung hoặc cột so sánh thứ ba.
Thanh bên trái: Hiển thị các nút đèn giao thông macOS ở góc trên bên trái: 3 hình tròn màu đỏ, vàng, xanh lá cây. Bên dưới tên ứng dụng, bao gồm 1 trường tìm kiếm với văn bản giữ chỗ “Search diffs…” và gợi ý phím tắt. Bên dưới đó, hiển thị chính xác 8 mục danh sách so sánh đã lưu với các biểu tượng tài liệu nhỏ và dấu thời gian: 1) “API Response — Checkout v2” với “Today, 10:24 AM”, được làm nổi bật bằng màu xanh dương là mục đang chọn; 2) “User Profile — Public API” với “Yesterday, 4:18 PM”; 3) “Orders Endpoint — v1 vs v2” với “May 20, 2025, 9:14 AM”; 4) “Product Catalog — EU Region” với “May 19, 2025, 2:47 PM”; 5) “Auth Response — SSO” với “May 18, 2025, 11:03 AM”; 6) “Billing Summary — Q2” với “May 17, 2025, 3:22 PM”; 7) “Webhook Payload — Stripe” với “May 16, 2025, 10:11 AM”; 8) “Search Results — Relevance” với “May 15, 2025, 5:35 PM”. Ở dưới cùng, bao gồm chính xác 1 nút “+ New Diff” màu xanh dương nổi bật và 1 biểu tượng bánh răng nhỏ.
Thanh công cụ phía trên: Ở bên trái, hiển thị tiêu đề “API Response — Checkout v2” với biểu tượng bút chì chỉnh sửa nhỏ. Ở giữa là bảng điều khiển phân đoạn với chính xác 2 tab: “Editors” được chọn màu xanh dương và “Diff” không hoạt động. Ở bên phải, bao gồm chính xác 4 điều khiển phím tắt nhỏ gọn được dán nhãn “⌘T add column”, “⌘D toggle diff”, “⌘← / ⌘→ move focus” và một khoảng cách nhỏ giữa các nhóm.
Các ngăn trình chỉnh sửa: Sử dụng phông chữ mã đơn cách, số dòng, tô sáng cú pháp JSON, bảng màu xanh hải quân tối và các đường viền bo tròn mỏng. Tiêu đề ngăn bên trái là “source.json” với biểu tượng tài liệu và menu ba chấm. Tiêu đề ngăn giữa là “target.json” với biểu tượng tài liệu và menu ba chấm. Tiêu đề ngăn hẹp bên phải là “more.json” và chỉ nên hiển thị phần bên trái của mã, ngụ ý nội dung bị tràn. Mỗi ngăn trình chỉnh sửa đầy đủ có một thanh trạng thái bên dưới với “Ln 1, Col 1”, “Spaces: 2”, “UTF-8”, “LF” và “JSON”.
Nội dung mã: Hiển thị JSON cho phản hồi thanh toán đơn hàng. Sử dụng requestId “req_8f3a9b42”, orderId “ord_123456”, đơn vị tiền tệ USD, các mặt hàng gồm Wireless Headphones và Travel Case, cùng thông tin vận chuyển. Phiên bản nguồn bên trái nên bao gồm dấu thời gian “2025-05-21T10:24:31Z”, phiên bản “v1”, trạng thái “pending”, totalAmount 129.99, Wireless Headphones unitPrice 99.99 với discount null, Travel Case số lượng 1, unitPrice 30.00, discount null, phương thức vận chuyển “standard”, estimatedDays 5 và địa chỉ “123 Market St”. Phiên bản mục tiêu ở giữa nên hiển thị các dấu hiệu so sánh ở lề trái và các hàng được tô màu nổi bật: hàng màu đỏ đã xóa, hàng màu xanh lá cây đã thêm, hàng màu vàng đã thay đổi. Nó nên bao gồm dấu thời gian thay đổi từ “2025-05-20T15:11:09Z” thành “2025-05-21T10:24:31Z”, phiên bản thay đổi thành v2, trạng thái thay đổi từ pending thành confirmed, totalAmount thay đổi thành 139.99, Wireless Headphones unitPrice thay đổi thành 109.99 và discount được thêm là 10.00, Travel Case số lượng thay đổi thành 2, và phương thức vận chuyển thay đổi thành express với estimatedDays 2. Hiển thị khoảng 32 dòng được đánh số trong mỗi trình chỉnh sửa đầy đủ.
Phong cách hình ảnh: Giao diện công cụ lập trình viên SaaS cao cấp, kết xuất sắc nét giống vector, chủ đề tối, màu nhấn xanh coban, văn bản màu xám dịu, ảnh chụp màn hình giao diện người dùng chân thực nhưng sạch sẽ, không có người, không có hình mờ, không có thanh công cụ trình duyệt bên ngoài cửa sổ ứng dụng. Giữ cho tất cả văn bản dễ đọc và căn chỉnh theo lưới.
Cách dùng prompt này
- 1
Sao chép toàn bộ prompt ở trên.
- 2
Mở một nền tảng hỗ trợ GPT Image 2, chẳng hạn như YouMind, rồi dán prompt vào.
- 3
Đổi chủ thể, phong cách hoặc chi tiết cho hợp ý bạn, rồi tạo.
Đây là một prompt AI miễn phí từ thư viện prompt của YouMind. Khám phá hàng nghìn prompt hình ảnh khác, tất cả đều miễn phí để sao chép và chỉnh sửa.
Khám phá thêm prompt hình ảnhThêm từ GPT Image 2
Poster du lịch thành phố phong cách tối giản
@Taaruk
Hình nền trình phát nhạc anime màu bạc hà
@あまり🖋️AI &フリー素材配布
Poster đồng hồ thông minh phiên bản giới hạn Cyberpunk
@あまり🖋️AI &フリー素材配布
Ảnh ghép chân dung tối giản 5 khung hình
@Cherry 2.O
Minh họa thời trang cùng phụ kiện
@Zephyra Leigh
Chân dung thời trang lấy cảm hứng từ Cinematic Threads
@Aijaz
Tất cả danh mục Hình ảnh
01
Trường hợp sử dụng
Thêm tính năng prompt
Thư viện AI
AI tìm kiếm prompt
Để AI tìm kiếm trong hàng chục nghìn prompt. Lọc theo mô hình, khoảng thời gian, từ khóa và sắp xếp theo lượt tương tác như lượt xem, lưu, chia sẻ.
Công cụ thị giác
Ảnh thành prompt
Biến mọi bức ảnh thành prompt ảnh AI chi tiết. Công cụ chuyển ảnh thành prompt miễn phí phân tích bố cục, phong cách và ánh sáng để bạn tái hiện bất kỳ phong cách nào trong vài giây.
Tính năng prompt khác
Dành cho nhà sáng tạo. Miễn phí mãi mãi.
YouMind là copilote sáng tạo AI được các nhà sáng tạo trên toàn cầu tin dùng. Mỗi prompt đều được tuyển chọn để giúp bạn sáng tạo nhanh hơn và tốt hơn.