Kaiju Hub AI

Каркаси

Wireframes welcome screen with Create Wireframe button

Ласкаво просимо

Область Wireframes дозволяє візуально розробляти та прототипувати макети інтерфейсу користувача. Створюйте каркаси, щоб спланувати структуру вашої програми перед кодуванням. Коли ви вперше відкриваєте Wireframes, ви побачите екран привітання з карткою Create Wireframe, щоб почати, або скористайтеся кнопкою + New Wireframe у верхньому правому куті.

Ключові характеристики

Ручне проектування

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

Покоління на основі ШІ

Опишіть, що ви хочете, і дозвольте штучному інтелекту автоматично створювати каркасну документацію та фрейми.

Голосовий ввід

Скористайтеся кнопкою вбудованого мікрофона або клацніть середньою кнопкою миші, щоб продиктувати свій каркасний опис голосом.

Каркас до коду

Коли ваш каркас буде готовий, надішліть його безпосередньо на створення коду — перехід від дизайну до робочого коду в одному безперебійному робочому процесі.

Створення каркасу

Create New Wireframe Project dialog showing title, platform selection, and Manual/AI-Powered tabs

Натисніть Створити каркас або + Новий каркас, щоб відкрити діалогове вікно створення. Ви введете назву, виберіть цільову платформу (мобільна, настільна чи веб-версія), напишіть опис каркасу та виберіть режим ручний або штучний інтелект.

Поля налаштування проекту

Назва

Дайте своєму каркасному проекту ім’я, щоб ви могли пізніше ідентифікувати його в списку каркасних елементів.

Платформа

Виберіть цільову платформу — мобільний, робочий стіл або веб — щоб адаптувати макет каркаса та обмеження.

опис

Опишіть, що ви хочете побудувати. Це використовується в режимі штучного інтелекту для створення документації та кадрів. Підтримує голосове введення за допомогою кнопки мікрофона.

Режим

Виберіть «Вручну», щоб відразу перейти до редактора полотна, або «На основі штучного інтелекту», щоб штучний інтелект створював для вас документацію та рамки.

Ручний режим

Коли ви вибираєте вкладку Manual і клацаєте Create, ви потрапите безпосередньо до редактора каркасного полотна, де ви можете негайно почати створювати свої екрани. Це найкращий варіант, якщо ви вже маєте чітке уявлення про свій макет і хочете отримати повний практичний контроль із самого початку.

Коли використовувати посібник

•

Ви маєте на увазі певний проект і хочете створити його самостійно.

•

Ви хочете швидко накидати приблизний макет, перш ніж його вдосконалювати.

•

Ви віддаєте перевагу повному контролю над кожним елементом із самого початку.

Режим на основі AI

AI-Powered wireframe creation with title, platform, description, Define Frames tab, model selector, and Generate button

Якщо вибрати вкладку AI-Powered, з’являться додаткові параметри. Ви можете написати або продиктувати свій опис, за бажанням визначити окремі фрейми, вибрати потрібну модель ШІ зі спадного списку вгорі, а потім натиснути Створити, щоб ШІ створив для вас каркасну документацію.

Як це працює

1

Введіть деталі

Введіть назву, виберіть платформу та напишіть опис свого проекту.

2

Визначити фрейми (необов’язково)

Перейдіть на вкладку «Визначити кадри», щоб указати окремі екрани або перегляди, які має створити ШІ.

3

Виберіть модель AI

Виберіть бажану модель ШІ зі спадного списку (наприклад, Claude Code, Opus 4.6).

4

Генерувати

Натисніть «Створити», щоб розпочати створення документації AI. Каркасний проект з’явиться у вашому списку під час створення документації.

5

Збірка кадрів

Після завершення документації ви можете почати генерувати кожен окремий кадр у редакторі каркасів.

Покращення за допомогою AI

Enhance with AI dialog showing AI Model selection, Enhancement Instructions field, and Enhance Description button

У режимі на основі штучного інтелекту натискання кнопки Покращити за допомогою штучного інтелекту відкриває діалогове вікно, у якому можна покращити опис за допомогою штучного інтелекту. Це бере все, що ви написали в полі опису, і покращує його на основі ваших інструкцій, роблячи його більш детальним, структурованим або повним перед створенням каркасу.

Параметри покращення

Модель ШІ

Виберіть модель штучного інтелекту для покращення опису (наприклад, Claude Code, Opus 4.6).

Інструкції щодо покращення

За бажанням надайте конкретні інструкції щодо того, як ШІ має покращити опис. Підтримує голосове введення.

Покращити опис

Натисніть, щоб запустити покращення. ШІ перепише та покращить ваш опис на основі ваших даних та інструкцій.

Формування документації

Wireframes list showing a project card with Generating Documentation status

Після натискання Створити в режимі на основі штучного інтелекту ваш каркасний проект з’явиться в списку каркасів зі статусом Створення документації.... AI створює структуровану документацію для вашого проекту на основі назви, платформи, опису та будь-яких визначених вами фреймів.

Що станеться далі

1

Формування документації

AI створює структурований документ, що визначає кожен екран, компонент і макет на основі вашого опису.

2

Генерація кадрів

Після завершення документації ви можете відкрити каркас і почати генерувати кожен окремий кадр у редакторі.

3

Удосконалення

Після створення кадрів ви можете вручну налаштувати, додати або видалити компоненти в редакторі полотна, щоб точно налаштувати дизайн.

Усі логотипи, торгові марки та назви брендів третіх осіб, що відображаються в Kaiju Hub AI, є власністю їхніх відповідних власників. Їх використання здійснюється виключно з метою ідентифікації та не означає схвалення, спонсорство або афіліацію.