Lolly biến các quy tắc của bạn - màu sắc, kiểu chữ, bố cục, logic - thành những công cụ mà ai cũng dùng được để tạo ra tệp hoàn chỉnh: hình ảnh, PDF, thẻ mạng xã hội, video, chỉ bằng cách điền vài ô. Gần như không có gì phải học và không phải tải gì lên: việc tạo và xuất tệp chạy ngay trên thiết bị của bạn, dù có mạng hay không.
Đây là trang bạn nên đọc trước tiên. Hai việc giúp bạn bắt tay vào làm ngay: biến Lolly thành của bạn và mang vào những gì bạn đã có (các tệp thiết kế và token của bạn). Mọi thứ khác chỉ cách một liên kết.
Mới biết Lolly và chỉ muốn làm ra thứ gì đó? Tạo tệp đầu tiên của bạn sẽ dẫn bạn làm một mã QR, hoặc mở ứng dụng, chọn bất kỳ công cụ nào trong thư viện, điền vào các ô trống rồi bấm Export. Quay lại đây khi bạn muốn nó mang thương hiệu của bạn.
signed by Lollyvector SVG124 paths~29k nodes324 groups395 KBTự kiểm chứngTải tệp đã ký
signed by Lollyvector SVG124 paths~29k nodes324 groups396 KBTự kiểm chứngTải tệp đã kýTry it in the app
1. Biến nó thành của bạn - cấu hình Design System của bạn
Thương hiệu của bạn trong Lolly là một tài liệu design-tokens nhỏ gọn - màu sắc, phông chữ và vài quy tắc - mà mọi công cụ đều dựa vào đó để kết xuất. Thiết lập một lần và mọi thứ bạn tạo ra đều đúng thương hiệu ngay từ gốc, không phải nhờ khâu duyệt lại. Có ba đường vào; chọn đường phù hợp với nơi thương hiệu của bạn đang nằm.
Bắt đầu từ con số không (trình dựng design system)
Lần chạy đầu tiên đưa bạn tới gallery, với một hộp thoại chào mừng ngắn phủ lên trên, mời ba đường vào - Make it yours (Brand Studio tại #/start), Bring your design (thả một tệp Figma, Penpot, InDesign hay PDF vào và nó mở ra thành một bố cục chỉnh sửa được - lối nhanh nhất tới Mang vào những gì bạn đã có bên dưới) và Explore the community tools - cùng một hàng ngôn ngữ nếu tiếng Anh không phải tiếng của bạn. Chọn thẻ đầu tiên và bạn tới Brand Studio. Đặt tên và chọn một màu chính, rồi Lolly suy ra từ đó cả một bảng màu đầy đủ, dễ tiếp cận - nền sáng/tối, chữ, màu nhấn - bằng đúng phép toán màu mà engine dùng ở mọi nơi khác.
signed by Lollyvector SVG167 paths~11k nodes243 groups1 image191 KBTự kiểm chứngTải tệp đã ký
signed by Lollyvector SVG167 paths~11k nodes243 groups1 image191 KBTự kiểm chứngTải tệp đã ký Chọn một phông chữ là bạn đã có một thương hiệu dùng được trong chưa đầy một phút. Từ đó, sáu phòng của studio - Overview, Colours, Type, Logos, Tokens, Files - cho bạn đi xa tới đâu tuỳ ý, theo thứ tự nào cũng được, tinh chỉnh lại bất cứ phần nào mỗi lần quay lại. Thẻ Design system trên dashboard (#/d) hiển thị kết quả ở chế độ chỉ đọc và trỏ ngược về #/start, nơi việc chỉnh sửa diễn ra (một hệ thống thiết kế bị khoá vẫn ở chế độ chỉ đọc, còn hệ thống cục bộ của riêng bạn vẫn có thể chỉnh sửa được).
Nhập một thương hiệu bạn đã có
Nếu thương hiệu của bạn đã được ghi lại dưới dạng design token - từ Penpot, Tokens Studio (Figma) hay bất kỳ tệp DTCG thuần nào - hãy mang trọn nó vào thay vì gõ lại. Có hai đường:
- Trong ứng dụng: trình dựng design system: Brand Studio (
#/start) nhận nó qua Add from… ở cuối thanh phòng - một tệp token, một bản xuất Penpot, một SVG hay một góiLollyBrand. Thả vào và bảng màu sáng lên. - Từ dòng lệnh, để dựng một gói thương hiệu dùng lại được:
# a monolithic tokens.json, a one-file-per-set directory, or a Penpot project archive
pnpm run ingest:brand ./my-tokens.json --name acme --label "Acme" --activateingest:brand nhận cả ba dạng chứa mà Penpot / Tokens Studio dùng để xuất cùng một tài liệu - một tệp tokens.json duy nhất, một thư mục ($metadata.json + các tệp theo từng bộ) hay một kho lưu trữ project.penpot. Với --activate, nó đăng ký thương hiệu thành một profile, chuyển sang profile đó và dựng lại catalog. Xem Cấu hình để biết gói thương hiệu và profile khớp với nhau ra sao.
Tinh chỉnh ngay trong ứng dụng
Khi một thương hiệu đã kích hoạt, bạn tiếp tục nhào nặn nó trong Brand Studio (#/start) - đổi một màu hay một vai trò và mọi bản xem trước khắp ứng dụng cập nhật ngay khi bạn gõ. (Thẻ Design system trên dashboard tại #/d chỉ hiển thị thương hiệu ở chế độ đọc; Studio mới là nơi bạn chỉnh sửa.)
signed by Lollyvector SVG100 paths~11k nodes151 groups1 image227 KBTự kiểm chứngTải tệp đã ký
signed by Lollyvector SVG79 paths~11k nodes146 groups1 image211 KBTự kiểm chứngTải tệp đã ký Cùng thương hiệu đó được tóm tắt trên thẻ Profile → Your brand. Phông chữ ở đây là phông thật: chọn từ Google Fonts và Lolly lưu tệp trên thiết bị của bạn dưới dạng tài nguyên thương hiệu, nên kiểu chữ của bạn đi theo cả khi ngoại tuyến và không có gì phải tải về lúc kết xuất.
Khi đã ưng ý, xuất thương hiệu thành một gói LollyBrand - một tệp duy nhất mà đồng nghiệp có thể nhập vào để có đúng bảng màu, phông chữ và quy tắc đó. Đó là cách một thương hiệu đi từ người này sang người khác, từ máy này sang máy khác mà không cần máy chủ nào ở giữa.
Token thương hiệu đi được cả hai chiều. Vì thương hiệu của Lolly chính là token DTCG - định dạng mà Penpot đọc và ghi nguyên bản, còn Tokens Studio mang vào Figma - nên bảng màu bạn dùng để thiết kế và bảng màu Lolly bắt tuân thủ là một tài liệu duy nhất, không phải hai danh sách bạn tự tay giữ cho khớp. Xem Design Tokens.
2. Mang vào những gì bạn đã có
Bạn không bắt đầu từ trang giấy trắng. Lolly mở được các bản thiết kế và những định dạng mở mà bạn đã có.
Tệp thiết kế nguồn mở
Việc đã làm xong trong Figma, Penpot, Illustrator, InDesign hay bất kỳ ứng dụng SVG nào không nhất thiết phải nằm kẹt trong ứng dụng bạn đã vẽ nó. Mở Design, bấm Import a design, và tệp mở ra như một bố cục sống - không phải một tấm ảnh bẹp. Mỗi lớp trở thành một hộp chỉnh sửa được: chữ vẫn gõ lại được, hình vẫn là hình, ảnh vào thẳng thư viện của bạn và các hình vector phức tạp được giữ nguyên trung thực. Nó tới nơi đã được nắn theo bộ phông và quy tắc màu của thương hiệu bạn.
| Bạn đang có | Mang vào dưới dạng |
|---|---|
| Một frame Figma | .fig nguyên bản (File → Save local copy), hoặc một bản xuất SVG |
| Một thiết kế Penpot | Bản xuất .penpot của nó, hoặc bất kỳ SVG nào |
| Một tệp Illustrator | .ai nguyên bản (tương thích PDF) hoặc .pdf - mở trực tiếp |
| Một bố cục InDesign | .idml (File → Export → InDesign Markup) |
| Bất kỳ thứ gì khác | Bất kỳ SVG nào - cánh cửa vào chung cho tất cả |
Toàn bộ việc nhập diễn ra trên thiết bị của bạn - tệp được phân tích ngay trong trình duyệt và không có gì được tải lên. Chi tiết đầy đủ, và chính xác những gì được giữ lại, nằm ở Nhập một bản thiết kế.
Bạn có một bộ slide PowerPoint thay vì thế? Thả tệp .pptx vào bất kỳ bề mặt tải lên nào để đưa các slide của nó vào thành tài sản, viết một bộ slide mới từ Markdown trong Markdown Slides, hoặc chạy Rebrand để nhận lại đúng bộ slide đó với chủ đề mới, biểu đồ và hiệu ứng động còn nguyên.
Từ một bản làm một lần thành một mẫu
Phần thưởng là đây: một bố cục đã nhập chính là một phiên Design bình thường, nên khi bạn lưu nó lại, nó nằm tại một URL. Bất kỳ ai có Lolly đều mở được URL đó, đổi chữ, thay ảnh và kết xuất phiên bản của riêng họ - không cần ứng dụng thiết kế, còn những phần đã khoá thì vẫn khoá. Một thiết kế làm một lần trở thành một công cụ dùng lại được. Đó là toàn bộ ý tưởng, đạt được mà không phải viết một dòng cấu hình nào.
Dữ liệu mở và công cụ mở
Bộ công cụ cộng đồng là nguồn mở và không gắn với thương hiệu nào - mã QR, bản đồ đường phố, bộ lọc, tiện ích riêng tư - và nó kết xuất theo thương hiệu của bạn ngay khi bạn kích hoạt.
Bạn cũng có thể nạp dữ liệu mở của chính mình cho công cụ: dán hoặc thả một bảng CSV hay JSON vào và các trường lặp của công cụ tự điền theo, mỗi dòng ra một tài nguyên hoàn chỉnh.
3. Làm ra thứ gì đó, rồi chia sẻ hoặc tự động hoá kết quả
Với một thương hiệu đang kích hoạt và tư liệu trong tay, mọi công cụ đều cho ra một tệp hoàn chỉnh:
- Kết xuất bất kỳ công cụ nào ra SVG, PDF, PNG, JPG, WebP, video và nhiều định dạng khác - đúng khổ in thật và đơn vị vật lý khi bạn cần. Xem Xuất tệp & định dạng.
- Chia sẻ một liên kết. Mọi trạng thái công cụ đều là một URL, nên một tài nguyên hoàn chỉnh có thể tái tạo lại và địa chỉ hoá theo tham số - commit liên kết, tạo lại bất cứ lúc nào cần.
- Làm hàng loạt. Điều khiển một mẫu từ bảng tính trong lưới xử lý hàng loạt: mỗi dòng một tài nguyên hoàn chỉnh.
- Tự động hoá. Cùng một lần kết xuất đó chạy được từ CLI và từ một tác nhân AI - URL chính là API.
"URL chính là API" là nói theo nghĩa đen. Biểu đồ bên dưới không do ai vẽ cả: loại biểu đồ, tiêu đề và toàn bộ bảng dữ liệu của nó đều được gõ vào thanh địa chỉ, và cùng liên kết đó cho ra cùng biểu đồ trên mọi thiết bị.
signed by Lollyvector SVG14 paths~1.1k nodes3 groups19 KBTự kiểm chứngTải tệp đã ký
signed by Lollyvector SVG14 paths~1.1k nodes3 groups19 KBTự kiểm chứngTải tệp đã ký
Đi tiếp từ đâu
Ba lối đi, tuỳ vào việc bạn tới đây để làm:
- Lolly cho người sáng tạo - bạn làm ra sản phẩm. Các lợi thế, và cách khai thác ứng dụng tối đa.
- Lolly cho người phát triển - bạn viết công cụ, tích hợp và triển khai. Tài liệu kỹ thuật.
- Lolly cho người vận hành - bạn chịu trách nhiệm về thương hiệu, bảo mật và triển khai trong toàn tổ chức.