Thiết kế đầu tiên

1Bắt đầu từ Trang chủ

Trang chủ mở ra khi ứng dụng khởi động. Màn hình này liệt kê các tệp gần đây dưới dạng lưới hoặc danh sách, kèm các mục Tệp mới, Mở tệp, Mẫu, Hệ thống thiết kế và Mẫu cảnh.

Ô nhập ở phía trên bắt đầu một thiết kế từ một câu mô tả. Chọn thứ bạn đang làm (Trang đích, Ứng dụng di động, Ứng dụng web, Trang chiếu, Bảng điều khiển hoặc Thứ khác) và kích thước (Máy tính, Máy tính bảng, Di động hoặc Trang chiếu), rồi mô tả nó. Agent tích hợp sẽ vẽ lên một canvas mới.

Các thẻ nhập bên dưới mở một tệp Figma, một trang web, một ảnh chụp màn hình cần tái tạo hoặc một tệp pen.dev. Cmd+N tạo một tệp trống khi đang ở Trang chủ.

2Tạo một bảng vẽ

1. Nhấn F để chọn công cụ Khung và kéo trên canvas. Một khung cấp cao nhất là một bảng vẽ: một màn hình, một phần của trang hoặc một trang chiếu.
2. Nhấn R, O hoặc T để thêm hình chữ nhật, hình elip hoặc văn bản bên trong.
3. Chọn một lớp và chỉnh kích thước, màu tô, viền và hiệu ứng trong bảng bên phải.
4. Bật bố cục tự động cho bảng vẽ để xếp các phần tử con với khoảng cách và lề trong.

3Lưu lại

Cmd+S lưu một tệp .de. Đây là JSON thuần, nên so sánh thay đổi trong git dễ dàng và agent có thể đọc được. Theo mặc định, hình ảnh được đặt trong thư mục <name>.assets/ bên cạnh; agent cũng có thể lưu thành một tệp duy nhất với mọi hình ảnh được nhúng vào.

4Xem trước

Nhấn Cmd+P để mở Xem trước. Chọn Điện thoại, Máy tính hoặc Canvas ở phía trên. Các bảng vẽ được đánh dấu là màn hình hoạt động như các trang của một website, có thanh địa chỉ cùng nút quay lại và tiến tới.

5Hoặc bắt đầu từ một mẫu

Tệp, Tạo mới từ mẫu mở các mẫu cảnh có sẵn: thẻ, so sánh, trang chiếu, đồ hoạ thông tin, hướng dẫn và carousel. Lưu bất kỳ tài liệu nào thành mẫu của riêng bạn bằng Tệp, Lưu làm mẫu.

Trung tâm câu lệnh chứa các câu lệnh soạn sẵn cho màn hình khởi đầu, ứng dụng di động, trang web, bảng điều khiển, thành phần và chỉnh sửa. Lưu các câu lệnh bạn hay dùng trong mục Của tôi.