Vectra
Vẽ vector, path, chữ, boolean và pathfinder, cùng mười một không gian làm việc thiết kế cho brand, logo, icon, pattern, đóng gói, infographic và UX.
Tóm gọn trong một câu#
Những hình dạng và văn bản sắc nét, có thể phóng to vô hạn: module dành cho logo, icon, mock-up giao diện và bất cứ thứ gì cần giữ nét sắc ở mọi kích thước.
Bố cục#
| Menu bar | File · Edit · Object · Type · Select · View · Plugins |
| Tab tài liệu | một bộ artboard cho mỗi tab |
| Toolbar | undo/redo, nhân đôi, chế độ xem code SVG, các phép toán boolean, khoá, mẫu fill và stroke kèm độ dày nét, và các nút align/distribute |
| Thanh guide | Grid kèm khoảng cách của nó · Snap · Rulers · một lưới logo · Safe area · Smart guides |
| Thanh bên trái | select, direct-select, type, line, rectangle, pen, shape, rotate, scissors, brush, add-anchor, artboard, hand |
| Bên phải | Properties · Layers · Text · Illust |
| Thanh trạng thái | artboard, kích thước của nó, số lượng đối tượng, số lượng đang chọn, vị trí trong lịch sử, công cụ đang hoạt động, zoom |
Bạn làm gì ở đây#
Vẽ#
Pen đặt các anchor và handle; direct select chỉnh sửa chúng sau đó.
Shape, line và text là những công cụ riêng của chúng. Các gợi ý nằm trên
toolbar và đáng đọc một lần: Shift giữ đúng tỉ lệ, Alt vẽ từ tâm, phím mũi
tên nhích từng chút.
Định vị chính xác#
Mục Transform nhận các con số chính xác (X, Y, chiều rộng, chiều cao, góc xoay) cùng với Flip H, Flip V, và một nút đặt lại về 0°. Các nút align và distribute trên toolbar hoạt động trên vùng đang chọn, và guide Smart bắt dính vào các đối tượng khác thay vì vào lưới.
Fill và stroke#
Cả hai đều bật tắt độc lập với nhau: một shape có thể là fill không stroke, stroke không fill, hoặc không có cả hai. Màu có thể chỉnh sửa dưới dạng hex. Trong mục Appearance: độ mờ, chế độ hoà trộn, và khả năng hiển thị.
Kết hợp shape#
Pathfinder và các phép toán boolean trên toolbar: union, subtract, intersect, exclude. Một nhóm boolean vẫn chỉnh sửa được, Release boolean group nằm trong command palette khi bạn cần lấy lại các phần riêng lẻ.
Type#
Tab Text giữ các điều khiển typography; menu Type giữ các thao tác: chuyển văn bản thành outline, và những việc tương tự.
Effects#
Mục Effects áp dụng không phá huỷ, nên hình học bên dưới vẫn là hình học bạn đã vẽ.
Đọc mã SVG#
Nút code trên toolbar hiển thị tài liệu dưới dạng SVG. Hữu ích để kiểm tra những gì thực sự sẽ được xuất ra, và để dán một path vào từ nơi khác.
Panel bên phải: bốn tab, rồi đến mười một không gian làm việc#
Tab chính, bốn tab bạn dùng liên tục:
| Properties | transform, fill, stroke, appearance, effects, align, pathfinder |
| Layers | mọi đối tượng, có thể sắp xếp lại, ẩn được, khoá được |
| Text | các điều khiển typography |
| Illust | phía minh hoạ: cọ, kèm một thư viện cọ mà các cọ trong đó chỉnh sửa được theo từng loại |
Bên dưới chúng, một accordion mang tên Workspaces giấu đi mười một panel theo kịch bản sử dụng cho đến khi bạn cần đến chúng. Đây là phần của Vectra không phải là một công cụ vẽ mà là một trợ lý thiết kế, và rất dễ bỏ sót vì nó đóng lại theo mặc định:
| Không gian làm việc | Dùng để |
|---|---|
| Brand | một bộ nhận diện thương hiệu: danh sách sản phẩm cần bàn giao (logo chính, logo đảo ngược và đơn sắc, icon/symbol, PDF hướng dẫn thương hiệu), với các mục bạn bật hoặc tắt |
| Logo | các kiểu logo, mockup và preset xuất: các biến thể một logo phải có khi bàn giao |
| Icon | bộ icon: kích thước, keyline, và các preset theo nền tảng ứng dụng |
| Pattern | pattern lặp lại: kiểu tile (dây thừng, xích, đứt nét và các kiểu khác), nhóm hoa văn giấy dán tường và preset motif |
| Pack | đóng gói: hộp sản phẩm và các template die-line khác |
| Infog | infographic: các kiểu sơ đồ, hình dạng flowchart (dữ liệu là hình bình hành, database là hình trụ…) và các kiểu biểu đồ |
| UX | thiết kế màn hình: khung thiết bị và preset breakpoint |
| DA | chỉ đạo nghệ thuật: metadata dự án, style tile, và xuất design token |
| Auto Layout | auto-layout kiểu Figma trên frame hoặc nhóm đang chọn |
| Components | symbol tái sử dụng được: định nghĩa một lần, đặt nhiều lần |
| Export | một bộ chọn định dạng điều khiển các tuỳ chọn riêng theo từng định dạng |
Accordion tự mở khi một tab không gian làm việc đã đang hoạt động, và phần đầu cho biết đó là tab nào. Nếu một panel bạn dùng hôm qua có vẻ biến mất, nó đang nằm sau Workspaces.
Xuất#
Vectra xuất theo tám cách, và panel nói rõ mỗi cách dùng để làm gì thay vì để bạn tự đoán:
| Định dạng | |
|---|---|
| PNG | raster có nền trong suốt, cho web và UI |
| JPG | raster nén, không có nền trong suốt |
| WebP | web hiện đại, dung lượng nhỏ, có nền trong suốt |
| AVIF | nén tốt nhất, hỗ trợ rộng |
| SVG | vector: phóng to được và vẫn chỉnh sửa được |
| tài liệu phổ dụng, cho in ấn và web | |
| EPS | in ấn chuyên nghiệp, tương thích Adobe |
| JSON | tài liệu dưới dạng dữ liệu |
Những gì bạn xuất cũng là một lựa chọn: selection, artboard, all artboard, hoặc slices: Slice Tool cắt canvas thành các vùng có tên và xuất chúng cùng nhau, đây là cách một mock-up UI ra đi dưới dạng một bộ asset thay vì một hình ảnh duy nhất.
Sản xuất in ấn#
Phần của Vectra biến nó thành một công cụ prepress chứ không chỉ một công cụ vẽ. Print Production thêm vào các dấu mà một nhà in mong đợi:
| Crop marks | nơi cần cắt |
| Registration marks | điểm mốc căn chỉnh cho máy in |
| Colour bars | dải hiệu chỉnh CMYK |
| Bleed (mm) | phần tác phẩm kéo dài qua đường cắt, để một milimét lệch không lộ ra thành một viền trắng |
| Overprint preview | những gì thực sự xảy ra ở nơi các lớp mực chồng lên nhau |
| Scale bar | dành cho một bản vẽ in theo tỉ lệ |
⚠️ CMYK ở đây là mô phỏng. Panel tự nói rõ điều đó: các giá trị chỉ là một bản xem trước, và màu in chính xác cần một quy trình quản lý màu đã hiệu chỉnh. Hãy coi chỉ số CMYK như một hướng dẫn, không phải một bản proof, và lưu ý rằng xuất CMYK không có nền trong suốt, đó là một tính chất của mô hình màu, không phải một giới hạn của Vectra.
File nó đọc và ghi#
| Định dạng gốc | .vectra |
| Nhập | .svg |
| Xuất | .svg · .pdf · .eps · .png · .jpg · .webp · .avif · .json |
Gửi việc sang các module khác#
Tạo ra vector art và Vectra objects: cùng một bản vẽ dưới hai hình thức. Chấp nhận vector art và hình ảnh.
| Điểm đến | Những gì đến nơi |
|---|---|
| Inkwell, Composer | vector art, vẫn chỉnh sửa được |
| Animator | Vectra objects, có thể tạo animation cho từng đối tượng một |
| Engine | một cây HUD, không phải một hình ảnh |
Ý cuối cùng đó chính là điểm mấu chốt của Vectra đối với một trò chơi. Một mock-up màn hình gửi tới Engine đến nơi dưới dạng một cấu trúc mà Engine có thể dàn bố cục và viết script cho nó, nút bấm thực sự là nút bấm, thay vì một hình ảnh đã làm phẳng mà bạn phải dựng lại từ đầu.
Làm việc cùng người khác#
Vectra đồng bộ từng thao tác một: đối tượng được thêm, xoá, cập nhật và thay thế toàn bộ; layer và thứ tự của chúng; kích thước artboard; và layer đang hoạt động.
Giới hạn và những trục trặc thường gặp#
- Một panel bạn không tìm thấy có lẽ đang nằm dưới Workspaces. Chỉ có bốn tab được hiển thị; mười một tab còn lại nằm sau accordion đã đóng.
- Một shape không fill không stroke vẫn vô hình nhưng vẫn tồn tại. Số lượng đối tượng trên thanh trạng thái là dấu hiệu để nhận ra.
- Smart guides bắt dính vào đối tượng, lưới bắt dính vào lưới. Nếu thứ gì đó không chịu nằm đúng chỗ bạn muốn, hãy kiểm tra xem cái nào trong hai đang bật.