Редагування та ітерація дизайнів Flowstep через чат або полотно

Дизайни Flowstep повністю редаговані після створення. Ви не прив’язані до того, що спочатку створив AI — ви можете коригувати деталі безпосередньо в редакторі, використовувати чат для опису змін природною мовою або попросити Flowstep створити варіації та нові екрани. Використовуйте той метод, який найкраще підходить для зміни, яку ви хочете внести.

​

Два способи редагування

​

Редагування лише частини екрана

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

• Перемкніться в режим Direct selection за допомогою Shift+V (або випадаючого меню на кнопці панелі інструментів Select) для вибору найглибшого елемента під вашим клацанням. Натисніть V для звичайного вибору або утримуйте Cmd (Mac) / Ctrl (Windows) для використання прямого вибору тимчасово. Escape виходить із прямого вибору.
• Виберіть під-елементи в кількох екранах за допомогою Cmd+Shift — один запит може редагувати до 6 екранів на повідомлення.

Коли вибраний елемент зображення (поза режимом дротяної каркасу), в панелі властивостей з’являється панель Image: переглядайте зображення, замініть його, перетягнувши новий файл зображення на попередній перегляд або клацнувши Pick image, або збережіть його за допомогою Download image.

​

Копіювання та вставлення елементів

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

• Копіюйте за допомогою Cmd+C (Mac) / Ctrl+C (Windows), вирізайте за допомогою Cmd+X / Ctrl+X, а вставляйте за допомогою Cmd+V / Ctrl+V.
• Дублюйте виділення на місці за допомогою Cmd+D / Ctrl+D.
• Вставлені елементи розміщуються трохи зміщено від оригіналів, щоб не перекривати їх.

Ці комбінації клавіш діють на вибрані елементи; під час редагування тексту вони працюють як звичайне копіювання та вставлення тексту.

​

Називання екранів на полотні

Кожен екран відображає свою назву на мітці над ним на полотні. Екран, якому ще не присвоєно назву, має мітку Screen.

• Двічі клацніть мітку, щоб перейменувати екран, а потім натисніть Enter, щоб зберегти, — клацання поза полем також зберігає зміни. Назви можуть містити до 100 символів.
• Клацніть мітку один раз, щоб вибрати екран, а потім перетягніть його, щоб перемістити на полотні.

​

Налаштування непрозорості, режиму накладання та кутів

Виберіть елемент, щоб точно налаштувати його вигляд на панелі властивостей:

• Opacity (непрозорість) — встановіть, наскільки прозорим є елемент, від 0 до 100%. На тій самій панелі є режим накладання (Normal, Multiply, Screen, Overlay та інші), який визначає, як елемент змішується з тим, що знаходиться позаду нього.
• Corners (кути) — заокругліть кути елемента. Встановіть одне значення Corner radius для всіх чотирьох або увімкніть Per corner, щоб задати окремий радіус для верхнього лівого, верхнього правого, нижнього правого та нижнього лівого кутів. Кожне значення може бути Token з вашої теми або Custom величиною.

​

Масштабування до пікселя

Масштабуйте полотно до 25 600%, щоб ретельно перевірити відступи та вирівнювання. Понад 200% з’являються лінії сітки, вирівняні по пікселях, які стають помітнішими чим далі ви збільшуєте масштаб, тож ви можете точно вирівняти елементи.

​

Відновлення попередньої версії

Кожне створення AI в історії чату зберігає свій оригінальний результат. Якщо екран був відредагований або видалений з моменту його створення, його повідомлення чату показує кнопку Restore — Restore original для повернення редагування або Restore / Restore all для повернення видалених екранів. Використовуйте це, щоб повернутися до відомого хорошого стану після того, як редагування піде в невірному напрямку. Наведіть курсор на будь-яке повідомлення в панелі чату, щоб побачити, коли воно було надіслано. Недавні повідомлення показують час; старіші показують, як давно вони були надіслані (наприклад, “1 day ago”), з повною датою та часом у спливаючій підказці.

​

Дії з одного клацання

Крім прямих редагувань, ви можете попросити Flowstep дослідити альтернативи:

• Try again from scratch — попросіть Flowstep створити свіжу версію поточного екрана з іншим макетом або стильовим напрямком.
• Show the next screen — попросіть Flowstep створити те, що логічно йде далі у потоці користувача.
• Make it pretty — коригуйте відстань, вирівнювання та кольори в дизайні. Макет залишається незмінним.

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

​

Ітерація для уточнення

Дизайн рідко ідеально розробляється при першій спробі. Використовуйте редагування на основі чату для кожного раунду зворотного зв’язку — опишіть, що працює, а що ні, і Flowstep коригуватиме звідти. Немає обмеження на те, скільки разів ви можете ітерувати екран.