Швидкий старт

The tool gallery - every tool as a card, grouped by category

Lolly перетворює ваші правила — кольори, шрифти, макети, логіку — на інструменти, якими будь-хто може скористатися, щоб створювати готові файли: зображення, PDF, картки для соцмереж, відео — просто заповнивши кілька полів. Тут нема чого вивчати й нічого завантажувати: усе працює на вашому пристрої, онлайн чи офлайн.

Це сторінка, яку варто прочитати найпершою. Дві речі роблять вас продуктивними: зробіть Lolly своєю і перенесіть те, що у вас уже є (ваші дизайн-файли й токени). Усе інше — за один клік.

Тільки почали знайомство з Lolly й просто хочете щось зробити? Відкрийте застосунок, оберіть будь-який інструмент із галереї, заповніть поля й натисніть Render. Повертайтеся сюди, коли захочете, щоб він виглядав у вашому бренді.

1. Зробіть її своєю — налаштуйте свою дизайн-систему

Ваш бренд у Lolly — це невеликий документ дизайн-токенів — кольори, шрифти й кілька правил — щодо якого рендериться кожен інструмент. Налаштуйте його один раз, і все, що ви створюєте, буде на бренді за побудовою, а не за результатами перевірки. Є три шляхи; оберіть той, що відповідає тому, де ваш бренд уже живе.

Почати з нуля (конструктор дизайн-системи)

Під час першого запуску ви потрапляєте на екран Start (#/start) — це Brand Studio. Дайте йому назву та основний колір, і Lolly виводить із нього повну доступну палітру — світлі/темні поверхні, текст, акценти — застосовуючи ту саму колірну математику, яку рушій використовує всюди. Оберіть шрифт — і менш ніж за хвилину у вас є робочий бренд. Далі п'ять вкладок студії (Logos, Colours, Type, Tokens, Catalogue) дають змогу довести його до бажаного стану — уточнюйте будь-що згодом, щойно повернетеся. До цього завжди можна повернутися з дашборду (за умови, що ви не користуєтеся версією Lolly з заблокованим брендом).

Імпортувати бренд, який у вас уже є

Якщо ваш бренд уже зафіксовано у вигляді дизайн-токенів — з Penpot, Tokens Studio (Figma) чи будь-якого звичайного файлу DTCG — перенесіть його цілком, а не набирайте наново. Два шляхи:

У застосунку: конструктор дизайн-системи: Brand Studio (#/start) приймає файл токенів, експорт із Penpot або пакунок LollyBrand напряму — перетягніть його, і палітра засяє.
З командного рядка, щоб підняти багаторазовий бренд-пакунок:

# a monolithic tokens.json, a one-file-per-set directory, or a Penpot project archive
npm run ingest:brand -- ./my-tokens.json --name acme --label "Acme" --activate

ingest:brand приймає всі три контейнери, в яких Penpot / Tokens Studio експортують той самий документ — єдиний tokens.json, каталог ($metadata.json + файли на кожен набір) або архів project.penpot. З прапорцем --activate він реєструє бренд як профіль, перемикається на нього й перебудовує каталог. Про те, як бренд-пакунки й профілі поєднуються між собою, читайте в розділі Configuration.

Налаштувати в застосунку

Щойно бренд стане активним, продовжуйте формувати його в Brand Studio (#/start) — змініть колір чи роль, і кожен попередній перегляд у застосунку оновиться просто під час набору. (Вкладка Design system на дашборді за адресою #/d показує бренд лише для читання; редагувати його можна саме в Studio.) Той самий бренд коротко подано на картці Profile → Your brand. Шрифти справжні: оберіть із Google Fonts, і Lolly збереже файл на вашому пристрої як бренд-ресурс, тож ваша типографіка мандрує офлайн, і під час рендеру нічого не завантажується.

Коли все вас влаштовує, експортуйте бренд як пакунок LollyBrand — єдиний файл, який колега може імпортувати, щоб отримати точнісінько ту саму палітру, шрифти й правила. Саме так бренд переходить між людьми й машинами без сервера посередині.

Бренд-токени мандрують в обидва боки. Оскільки бренд Lolly є токенами DTCG — форматом, який Penpot читає й пише нативно, а Tokens Studio приносить у Figma — палітра, з якою ви проєктуєте, і палітра, яку Lolly забезпечує, це один документ, а не два списки, які ви вручну тримаєте синхронними. Див. Design Tokens.

2. Перенесіть те, що у вас уже є

Ви починаєте не з чистого аркуша. Lolly відкриває дизайн-роботи й відкриті формати, якими ви вже володієте.

Дизайн-файли з відкритим кодом

Готові роботи у Figma, Penpot, Illustrator, InDesign чи будь-якому SVG-застосунку не мусять лишатися замкненими в програмі, у якій ви їх намалювали. Відкрийте Layout Studio, натисніть Import a design — і файл відкриється як живий макет, а не пласке зображення. Кожен шар стає редагованим блоком: текст залишається таким, який можна перенабрати, фігури залишаються фігурами, зображення потрапляють до вашої бібліотеки, а складна векторна графіка зберігається достеменно. Він одразу приходить приведеним до шрифтів і колірних правил вашого бренду.

Що у вас є	Як це перенести
Кадр Figma	Нативний `.fig` (File → Save local copy) або експорт у SVG
Дизайн Penpot	Його експорт `.penpot` або будь-який SVG
Файл Illustrator	Нативний `.ai` (сумісний із PDF) або `.pdf` — відкривається напряму
Макет InDesign	`.idml` (File → Export → InDesign Markup)
Будь-що інше	Будь-який SVG — універсальні двері всередину

Увесь імпорт відбувається на вашому пристрої — файл розбирається у вашому браузері, і нічого не завантажується. Повні деталі й точний перелік того, що переноситься, — у розділі Import a design.

Від разового макета до шаблону

Ось у чому вигода: імпортований макет — це звичайна сесія Layout Studio, тож щойно ви його збережете, він живе за URL. Будь-хто з Lolly може відкрити цей URL, змінити слова, замінити зображення й відрендерити власну версію — без дизайн-застосунку, а заблоковані частини лишаються заблокованими. Разовий дизайн стає багаторазовим інструментом. У цьому вся ідея, досягнута без жодного рядка конфігурації.

Відкриті дані й відкриті інструменти

Набір інструментів спільноти має відкритий код і не залежить від бренду — QR-коди, карти вулиць, фільтри, утиліти приватності — і рендериться щодо вашого бренду тієї миті, коли ви його активуєте.

The Utilities view - the on-device workhorses like Strip Hidden Data, Compress PDF and Convert Image, all in one place

Годуйте інструменти й власними відкритими даними: вставте або перетягніть таблицю CSV чи JSON, і повторювані поля інструмента заповняться з неї — один готовий ресурс на рядок.

3. Зробіть щось, а потім поділіться цим чи автоматизуйте

З активним брендом і матеріалом напоготові кожен інструмент видає готовий файл:

Рендеріть будь-який інструмент у SVG, PDF, PNG, JPG, WebP, відео тощо — у справжніх друкарських розмірах і фізичних одиницях, коли це потрібно. Див. Exporting & formats.
Поділіться посиланням. Стан кожного інструмента — це URL, тож готовий ресурс відтворюваний і адресований за параметрами — закомітьте посилання, регенеруйте на вимогу.
Робіть це масово. Керуйте шаблоном із таблиці в пакетній сітці: один готовий ресурс на рядок.
Автоматизуйте. Той самий рендер запускається з CLI і від AI-агента — URL і є API.

«URL і є API» — це буквально. Діаграму нижче ніхто не малював: її тип, її заголовок і вся її таблиця даних були набрані в адресному рядку, і те саме посилання рендерить ту саму діаграму на будь-якому пристрої.

An area chart of monthly signups, every value of which arrived as a query parameter rather than a click

Куди рухатися далі

Три шляхи, залежно від того, навіщо ви тут:

Lolly для творців — ви створюєте речі. Переваги й те, як отримати від застосунку максимум.
Lolly для розробників — ви створюєте інструменти, інтегруєте й розгортаєте. Технічна документація.
Lolly для операторів — ви відповідаєте за бренд, безпеку й розгортання в межах організації.