Інструкція з інсталяції аплікації

Знайомство з панелямі інструментів

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

• права верхня панель — панель для роботи з малюнком;
• права нижня панель — навігаційна панель, кнопка видалення, кнопка паузи;
• лівий верхній кут — налаштування;
• лівий нижній кут — панель гейміфікації (вмикається в налаштуваннях за потреби);
• нижня панель інструментів — інструменти для малювання.

Верхня та нижня панелі з інструментами мають додаткові кнопки, приховані за трьома крапками.

Якщо ви малюєте на планшеті, послідовно виконуйте дії за інструкцією використвуючі пальці або стілус. Якщо ви малюєте на ноутбуці у браузері Google Chrome, усі дії виконуйте мишею. Просунуті дії та колесом миші з утриманням клавіш Alt чи Ctrl.

Етап 1. Керування кадрами

1. Створіть кадр для малювання.

На нижній панелі інструментів натисніть кнопку додати кадр.

На екрані з’явиться перший кадр для малювання.

2. Додайте ще два кадри для малювання.

Ще двічі натисніть кнопку.

На екрані з’являться ще два кадри для малювання.

3. Оберемо кадр для малювання.

Обрати кадр можна двома способами:

• перший спосіб — натисніть на кадр на екрані пальцем;
• другий спосіб — у нижньому лівому куті екрана планшета знайдіть кружечки з цифрами. Номер відповідає номеру рамки. Натисніть на кружечок з номером.

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

4. Видалення кадру

• оберіть кадр одним із двох вищеописаних способів;
• натисніть кнопку видалити вибраний кадр. Кнопка знаходиться біля кнопки додати кадр.

5. Видалення всіх кадрів — повне очищення робочого простору

• у нижньому лівому куті екрана знайдіть кнопку із зображенням урни для сміття;
• натисніть кнопку.

Усі кадри разом із малюнками будуть стерті, і ви отримаєте чистий робочий простір.

6. Збільшимо розмір кадру для малювання.

Є два способи збільшити кадр:

• перший спосіб працює, якщо кадр уже у фокусі (має помаранчевий контур). Щоб застосувати цей спосіб, ще раз натисніть на кружечок із цифрою для обраного кадру;
• другий спосіб — з використанням прихованих кнопок кадру у фокусі. Один раз швидко натисніть на середину кадру. У правому нижньому куті самого кадру з’явиться зображення прямокутника. Швидко двічі поспіль натисніть на прямокутник.

Кадр для малювання збільшиться на екрані.

7. Змінити порядок кадрів в історії

На нижній панелі інструментів знайдіть кнопку для зміни порядку та активуйте її.

• доки іструмент є активним ви можете вільно переміщати кадри.
• натисніть на кнопку переміщення;
• торкніться кадру під номером 2 пальцем та перетягніть його на кінець історії;
• натисніть кнопку для зміни порядку ще раз застосовуючі новий порядок.
• історія автоматично вистороїться у стрічку у новому порядку.
• програйте історію знову.

Так ви бачите, як змінилася послідовність кадрів в історії.

8. Додати додатковий кадр в середину історії

• визначте, після якого кадру ви хочете додати новий кадр;
• візьміть кадр у фокус, легко торкнувшись кадру пальцем;
• на нижній панелі інструментів натисніть кнопку додати кадр.

Так ви бачите, як новий кадр створив нову послідовність кадрів в історії.

9. Клонування кадру

Візьміть кадр у фокус.

• на верхній панелі інструментів натисніть кнопку клонувати вибраний кадр.

Дублікат поточного кадру з’явиться поруч із оригіналом кадру.

10. Змінити орієнтацію кадрів на екрані.

Якщо ви малюєте на планшеті:

1. Щоб наблизити або віддалити зображення, розведіть або зведіть два пальці.
2. Щоб повернути полотно, торкніться екрана трьома пальцями й обережно поверніть руку.
3. Щоб розташувати кадри в один ряд або повернути початковий порядок, є три способи:
   • натисніть кнопку вирівняти історію у стрічку;
   • проведіть пальцем знизу догори або згори донизу (Swipe);
   • поверніть планшет на 90 градусів.

Якщо ви малюєте на ноутбуці у браузері Google Chrome:

1. Щоб наблизити або віддалити зображення (Zoom), прокрутіть колесо миші вперед або назад.
2. Щоб пересунути один кадр (Move), наведіть курсор миші на кадр, потім натисніть праву кнопку миші та перетягніть.
3. Щоб розташувати кадри в один ряд або повернути початковий порядок, натисніть кнопку вирівняти історію у стрічку.

11. Приховані функції кадру

Двічі торкніться всередині кадру (Double tap).

• у нижньому правому куті ви побачите кнопку збільшення кадру — підігнати під екран.

Двічі торкніться верхнього лівого кута кадру, який містить зображення.

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

Якщо кнопки навігації зникли і ви хочете, щоб вони показувалися, або, навпаки, хочете сховати панель навігації:

• поставте одночасно чотири пальці на екран планшета.

Далі — наступний крок: будемо вчитися малювати історію.

Етап 2. Малювання

1. Починаємо малювати.

Намалюймо цифру «1» у першому кадрі:

• на нижній панелі інструментів знайдіть кнопку із зображенням олівця;
• натисніть на кнопку олівець;
• в обраному кадрі пальцем намалюйте цифру «1».

Пам’ятайте: швидкість руху впливає на товщину лінії — чим швидше рухаєте, тим товстіша лінія.

2. Використання витирачки

На нижній панелі інструментів знайдіть кнопку із зображенням витирачки.

• натисніть на кнопку та оберіть інструмент витирачка;
• зітріть цифру «1».

3. Змінюємо розмір лінії для малювання.

• на нижній панелі інструментів знайдіть слайдер;
• перемістіть слайдер вправо чи вліво та оберіть розмір лінії для малювання. Пересуваючи слайдер, ви змінюєте товщину штриха.

Товщина лінії зміниться.

4. Змінюємо колір лінії

На нижній панелі інструментів праворуч знайдіть кружечок із кольором.

• натисніть на кружечок пальцем;
• оберіть колір, який вам подобається.

5. Продовжимо малювати

Знову намалюймо цифру «1» у першому кадрі:

• на нижній панелі інструментів знайдіть кнопку із зображенням олівця;
• натисніть на кнопку олівець;
• в обраному кадрі пальцем намалюйте цифру «1».

6. Перемкнутися на наступний кадр для малювання.

Знайдіть панель навігації (кружечки з цифрами у нижньому лівому куті екрана планшета).

Панель навігації

1. Кожен кадр — це кнопка з номером. Номер відповідає номеру кадру.
2. Одне торкання переносить обраний кадр у центр.
3. Друге торкання збільшує кадр для малювання та детального перегляду.

Що робити, щоб перейти на другий кадр:

• натисніть на кружечок з номером 2.

Другий кадр для малювання переміститься в центр екрана.

7. Додамо зображення на другий та третій кадр.

• на нижній панелі екрана натисніть кнопку олівець;
• намалюймо цифру «2»;
• на навігаційній панелі перейдімо на третій кадр, натиснувши на цифру 3;
• на нижній панелі екрана знову оберіть олівець та намалюйте цифру «3».

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

Етап 3. Програвання історіі

1. Програти історію вперед.

Важливо:
Якщо кадр в фокусі, то історія почне програватися з кадру у фокусі (рамка з помаранчевим контуром).
Щоб історія програвалася з першого кадру, необхідно перемістити фокус на перший кадр. Для цього на навігаторі кадрів натисніть на кружечок із цифрою 1.

Якщо жодного кадру у фокусі немає, то історія почне програватися спочатку.

Як програти:
На нижній панелі інструментів натисніть кнопку програти.

Додаткові кнопки керування програванням історії:

• призупинити програвання — натисніть кнопку пауза;
• змінити швидкість програвання — натисніть кнопку-список 1× та оберіть швидкість програвання: 4× (найшвидше), 2×, 1×, 0,5×, 0,25× (найповільніше);
• закінчити програвання — натисніть кнопку стоп . Натискання на кнопку закінчує програвання історії. Якщо знову натиснути кнопку програти , історія почне програватися спочатку.

2. Програти історію у зворотному порядку.

Кнопка програвання у зворотному порядку прихована за трьома крапками на нижній панелі інструментів.

• натисніть три крапки праворуч від кнопки стоп , і кнопка програвання у зворотному порядку з’явиться перед кнопкою програти;
• натисніть кнопку програти у зворотному порядку;
• натисніть кнопку програти.

3. Перемотати історію на наступний кадр.

На нижній панелі інструментів знайдіть кнопку перемотати програвання вперед.

• натисніть кнопку один раз;
• натисніть кнопку вдруге;
• натисніть кнопку втретє;

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

4. Вирівняти історію у стрічку.

Щоб вирівняти історію після програвання знову у стрічку:

• знайдіть на верхній панелі інструментів кнопку вирівняти історію у стрічку;
• натисніть кнопку.

Історія автоматично повернеться у початкове положення — стрічку по центру екрана.

Додатковий спосіб:
Проведіть пальцем зверху вниз з правого боку екрана (Swipe down).

Етап 4. Гейміфікатори

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

1. Додаємо текстовий наратив

До кожного кадру можна додати текстовий наратив.

• оберіть один із кадрів;
• на верхній панелі знайдіть кнопку діалогової хмаринки;
• натисніть іконку.

Кадр автоматично переміститься на середину екрана.
Праворуч біля кадру з’явиться віконце репліки з курсором — місце для наративу.
Ви можете ввести текст.
Редактор наративу має кнопки видалити текст 🗑️ , відмінити ✗ , застосувати зміни ✓ .

• у редакторі наративу введіть текст, наприклад: «Це цифра 1»;
• натисніть кнопку застосувати зміни ✓

Кадр має діалогову хмаринку з текстом.

• оберіть інший кадр;
• у редакторі наративу другого кадру введіть текст, наприклад: «Це цифра 2»;
• натисніть кнопку застосувати зміни ✓

Другий кадр має діалогову хмаринку з текстом.

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

• натисніть програти історію.

2. Додаємо термометр

Візьміть кадр у фокус.

• на верхній панелі інструментів натисніть термометр.

З лівого краю екрана під верхньою панеллю інструментів з’явиться термометр зі шкалою від 1 до 10.

Як змінити положення на шкалі термометра для поточного кадру:

• пересуньте слайдер шкали та змініть її положення.

Шкалу можна закрити двома способами:

• перший — натисніть на хрестик на шкалі;
• другий — на верхній панелі знову натисніть на кнопку термометра.

Прибрати термометр з кадру:

• візьміть кадр у фокус, щоб кадр мав помаранчевий контур;
• натисніть на кнопку термометра на верхній панелі.

3. Задаємо фон кадру

Візьміть кадр у фокус.

• на нижній панелі інструментів відкрийте палітру кольорів та оберіть колір, який вам подобається;
• на верхній панелі інструментів натисніть кнопку тон — кадр буде пофарбований в обраний колір.

Фон кадру пофарбований в обраний вами колір.

4. Показати на екрані тільки один кадр

Візьміть у фокус кадр, який хочете залишити на екрані.

• на верхній панелі інструментів натисніть кнопку показати лише вибраний кадр;

З екрана зникають усі кадри, окрім обраного. Кнопка змінила стан та іконку на

• натисніть на кнопку , щоб повернути всі кадри на екран.

На екрані знову присутні всі кадри.

5. Режим перекривання одного кадру іншим

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

• на верхній панелі інструментів натисніть кнопку режим перекривання;
• на нижній панелі інструментів натисніть кнопку посунути кадр;
• обережно поставте палець на обраний кадр та пересуньте його на кадр поруч (поверх іншого кадру).

Над кадром з’явиться піктограма кнопки.
Поточний кадр із піктограмою перекриває інший кадр.
Зображення іншого кадру не можна побачити, поки поточний кадр його накриває.

6. Дихання — можливість зробити паузу.

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

7. Взаємодія з образами через гейміфікатори

Увімкніть панель гейміфікації:

• натисніть колесо шестерні у верхньому правому куті екрана;
• у вікні Налаштування перейдіть до TF-CBT;
• переведіть слайдер «Увімкнути елементи гейміфікації» у положення праворуч.

У правому нижньому куті з’явиться іконка панелі гейміфікаторів у вигляді джойстика.

• натисніть на іконку панелі гейміфікаторів та подивіться на гейміфікатори;

8. Взаємодія з образом через розбивання.

Збільште розмір одного з кадрів.

• візьміть кадр у фокус, щоб кадр мав помаранчевий контур;
• натисніть на кнопку із зображенням молотка;

Кадр переміститься в простір для розбивання.

• торкніться кадру пальцем у будь-якому місці;

Кадр почне розбиватися, як скло.

• відновіть кадр, натиснувши кнопку відновити , що знаходиться у лівому нижньому куті екрана в просторі для розбивання кадру;
• змініть положення слайдера, що знаходиться з лівого боку екрана в просторі для розбивання кадру;
• торкніться кадру пальцем у будь-якому місці;

Кадр розбився швидше, ніж минулого разу.

• поверніться до робочого простору з історією, натиснувши кнопку повернутися.

9. Робота з вогнем.

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

• натисніть на кнопку з зображенням вогню;

Відкриється робочий простір гейміфікатора вогню.

• проведіть пальцем по малюнку;

Зображення почне ніби горіти.

• натисніть кнопку відновити зображення;
• використайте інструмент захист , щоб обвести частину зображення, яку хочете вберегти від полум’я;
• проведіть пальцем по малюнку;

Зображення почне горіти тільки там, де немає захисту.

• натисніть кнопку відновити зображення;
• натисніть інструмент паливо;
• проведіть пальцем по зображенню, щоб додати дрова, і зображення краще займалося полум’ям;
• проведіть пальцем по малюнку;

З паливом зображення горить скоріше.

• натисніть кнопку відновити зображення;
• з лівого верхнього боку змініть положення слайдерів вище, вгору;
• проведіть пальцем по зображенню;

Вогники зображення більші у діаметрі. Зображення горить скоріше.

• натисніть кнопку відновити зображення;
• проведіть пальцем по зображенню;
• поки горить полум’я, натисніть кнопку вогнегасника;

Полум’я загасло після того, як ви натиснули вогнегасник.

10. Колоризація і складання образу

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

• натисніть на кнопку із зображенням колоризації і складання образу;

Відкриється робочий простір кольорових фільтрів і складання образу.
Ви бачите панель інструментів з кнопками:

11. Інструмент відтінки сірого

• натисніть кнопку відтінки сірого;
• повільно змініть положення слайдера до кінця вліво, а потім до кінця вправо;
• зверніть увагу, як змінюються кольори зображення;

Слайдер до кінця вліво — зображення сіре.
Слайдер до кінця вправо — зображення кольорове.

12. Інструмент ефект розмиття

• натисніть кнопку ефект розмиття;
• повільно змініть положення слайдера до кінця вліво, а потім до кінця вправо;
• зверніть увагу, як змінюється чіткість зображення;

Слайдер до кінця вліво — зображення чітке.
Слайдер до кінця вправо — зображення розмите.

13. Інструмент інверсії кольору

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

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

14. Інструмент кольорового фільтра

• повільно натисніть кнопку кольорового фільтра кілька разів поспіль;
• зверніть увагу, як змінюються кольори зображення;

Після кожного натискання кнопки зображення змінює колір.

15. Інструмент складання зображення

• натисніть кнопку складання;

Посередині екрана з’явиться вертикальна пунктирна смужка.

• поставте палець на праву сторону екрана та тримайте;

Малюнок складеться вліво.

• ще один раз натисніть кнопку складання;

Малюнок перевернеться. Пунктирна лінія стане горизонтальною.

• поставте палець на верхню чи нижню сторону екрана та тримайте;

Малюнок складеться догори.

Повторюйте дії стільки разів, скільки вам потрібно, чи поки зображення неможливо буде впізнати:

• натисніть кнопку складання;
• поставте палець на праву сторону екрана та тримайте;
• поставте палець на верхню чи нижню сторону екрана та тримайте;

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

16. Інструмент роскладання зображення

Передумови використання: Ви повинні бачити складений малюнок на екрані планшета.
Ви повинні знаходитися в робочому просторі для складання — розкладання малюнків.

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

Малюнок розкладений повністю.

Натисніть

Наразі ви познайомилися з основними можливостями додатка — можливостями першого рівня.

Етап 5. Збереження та відновлення історії

Збереження історії

• натисніть колесо шестерні у верхньому правому куті екрана;
• у вікні Налаштування зліва в меню перейдіть до Сховище;
• натисніть Зберегти історію у JSON-файл

На екрані на декілька секунд з’явиться повідомлення, що файл завантажено.

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

• натисніть колесо шестерні у верхньому правому куті екрана;
• у вікні Налаштування зліва в меню перейдіть до Сховище;
• натисніть Завантажити історію із JSON-файлу

Відкриється сховище на вашому планшеті.

• знайдіть свою історію у сховищі планшета;
• оберіть історію, торкнувшись її пальцем.

Історія автоматично завантажиться в додаток та з’явиться у робочому просторі для малювання.