Меня тут на стрим позвали к @uxlive, планируем лампово посидеть, обсудить инструменты, немного о дизайне и в целом о прототипировании.. Но куда эта затея нас утянет - вопрос хороший. Ссылочку кину в коменты, как настроим всё

P.S. И сегодня кстати 5.5 релизнулась. Видимо на стриме и посмотрим новый функционал, если не сильно душным окажется.

Не дошли мы вчера до обзора функций нового обновления, поэтому вкратце опишу что там как.

1. Поддержка формул в Playback.
Есть официальный урок, который научит вас делать видеоплеер..
Но мне кажется киллерфичей добавления этого функционала должна была стать возможность делать сайты-лендосы "как у эпл", а именно завязать проигрывание видео файла на скролл сайта, но пока, это работает не оч плавно.

2. Fill для изображений и шейпов.
Сейчас это сделано, чтобы решить проблему при импорте дизайнов из Figma, Sketch или Adobe XD и искажением изображений, у которых стоит Fit или Stretch. Я надеюсь, что в будущем можно будет через формулу подсовывать другие ресурсы в эти "контейнеры" для изображения.

3. Изменение UX создания слоев.
Щелкните и перетащите, чтобы создать слой. Многие дизайнеры привыкли к такому поведению: создание слоя-фигуры путем щелчка и перетаскивания. Теперь ProtoPie работает также.

4. Горячие клавиши.
Появилось окно показывающее все горячие клавиши ⌃ + ⇧ + / (macOS) или Ctrl + ⇧ + / (Windows).
Свои назначать и менять пока нельзя, но я думаю к этому всё и идет. К сожалению совсем нет хоткеев для создания триггеров, зато добавили хоткей для выбора цвета с помощью пипетки, не переходя на панель свойств. Выберите слой и используйте хоткей: i (macOS и Windows) или ⌃ + C (macOS).

5. Поддержка формул для переменных
Очень удобное нововведение, которое позволяет сразу в переменную вписать, например координату мыши $mouseX. Раньше приходилось делать триггер старт, в нем присваивать переменной значение мыши и еще и бесконечный репит делать.. Астрологи объявили неделю формул в переменных - количество триггеров сократилось вдвое.

6. Новые функции формул parent(layerName:LAYER).property и initial(source:TEXT)
Наконец-то дают обратиться к другим слоям и их свойствам. Описания добавлены в документацию
Из документации не очень понятно для чего нужны эти функции, но они крутые) я попозже постараюсь придумать наглядные примеры применения этих функций.

7. Небольшие улучшения интерфейса
Улучшили рендеринг слоев и интерактивных панелей (и поправили некоторые баги с мерцаниями)
Убраны лаги в колорпикере (я что-то не замечал их)
Длина аудио, видео и файлов Lottie, отображаемых на панели свойств
Немного переработали облачный режим, опять перепрятав все кнопки в новые места

О нет. Я теперь в тиктоке.
Прототип этот кстати переделал и запилил даже пару уровней. Вдохновлено корейским сериалом Squid Game.
Игра пока ещё в разработке. Вот вам эксклюзив альфа версия. https://cloud.protopie.io/p/94e8bb1209

P.S. тестируя такие большие прототипы (много медиа, и одновременных расчетов) на андроид телефонах, понял, что если на телефоне свободного места меньше 2 Гб - прототип неистово тормозит. Возможно это наблюдение кому-то будет полезно.

Кароч ща попробую запустить тестовый стримчик тут, в телеграме, посмотрим на новую версию Протопая.

Интересные статейки, как проводить юзабилити тестирования с протопаем, однако всегда есть нюансы:
ProtoPie with UserTesting
ProtoPie with Lookback
ProtoPie with UserZoom Go

Достал из проекта реализацию выделения нескольких объектов. Самих объектов может быть сколько угодно - копии компонента. Так же можно им менять позицию.
Помню, что долго мучался с прямоугольником самого выделения, а именно чтобы он рисовался в любом направлении. Протопай не умеет делать отрицательный размер объектов. Пробовал вращать прямоугольник, однако это всё еще сильнее путало. В итоге сделал 4 прямоугольника - для каждой четверти и синхронизировал их.

https://cloud.protopie.io/p/4b84d92e4b

Наконец-то появились нормальные способы проводить тестирование на пользователях и собирать данные.
Ребята из UseBerry запилили альфаверсию интеграции с Protopie!
Подробнее тут: https://www.useberry.com/integrations/protopie/

Довольно популярная тема - завязать проигрывание видео на скролл.
И извечный вопрос - "Как сделать как на сайте у эпол?"

Если делать напрямую - то такой интерактив выглядит не плавным и лагучим. Я вот тестил, когда дали возможность писать формулу и управлять временем проигрывания - https://cloud.protopie.io/p/205816fa4e

Надо потестить вариант с видосом в 120фпс и формулой которая чётко переводит миллисекунды в кадры, но мне пока лениво.

Кстати наш подписчик Патрик запилил свой вариант реализации: https://youtu.be/-zl2oqktOCU работает плавнее чем напрямую, но всё еще не идеально.

Ну и ладно там протопай. Тут многие знакомые разрабы - убили не один десяток часов в прошлом году, чтобы сделать скролл плавненьким. И тут мне внезапно говорят что в редимаге уже 3 года есть элемент "Shots" который справляется с такой задачей на изи, пока весь мир страдает..

Может быть вы знаете еще какие решения и реализации этой темы? В протопае и не только.

Решил вернутся к созданию платформера, где нужно орать, чтобы играть =) Оказалось, что через ProtoPie - разные девайсы, совершенно по разному определяют шум в одном и том же помещении в одно и то же время. Поэтому сейчас работаю над кейсом калибровки девайса под окружение.

Команда ProtoPie поздравляет всех с католическим рождеством
https://cloud.protopie.io/p/bb642d6dc4

Привет пекарям! Команда ProtoPie сделали отдельный плеер для Wear OS, который доступен в Google Play

Тут кстати парочка моих прошлогодних прототипов попала в дайджест 15 самых вдохновляющих прототипов 2022 года
https://www.protopie.io/blog/fifteen-inspirational-prototypes-2022
Надо бы их доделать, чтобы полноценными играми были =)

Прочитал тут новость, что таймс купила игру, которая завирусилась в твиттере - Wordle. Посмотрел что за игра. Решил попробовать сделать ее в протопае..
Чуть позже подумал - а ведь никто не умеет использовать в протопае что-то хотя бы похожее на базы данных. Поэтому я решил записывать свои мысли параллельно созданию игры и позже превращу это в гайд-статью. Наверное должно быть интересно.

А щас, кому не лень - потестируйте?
https://cloud.protopie.io/p/894ef709bf

Правила такие:
Загадывается рандомное слово из 5ти букв, вам надо его угадать за 6 попыток.
При использовании попытки цвет фона у буквы может измениться:
🟢 стал зеленым - значит буква в слове на верном месте,
🟡 стал желтым - значит в слове буква такая есть, но место не верное,
⚪️ если фон остался белый - значит этой буквы нет в слове.

P.S. Щас база из 2600 слов, если каких-то нет - пишите, я добавлю)

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

• Новые фичи:
1. Главная фича приложения - это новый тип перехода между экранами для действия Jump - Smart Jump - это аналог Smart Animate у Figma. Т.е. если на 2х сценах есть слои с одинаковыми именами - между ними настраиваются автоматические действия анимации. Если эту фичу разовьют и можно будет настраивать отдельно каждый слой для транзишена - это будет хорошим бустом скорости при прототипировании. Сейчас все действия происходят одновременно и иногда криво..
2. Новая версия плагина для экспорта с Figma позволяет переносить настроенные взаимодействия с фигмы сразу в протопай. В целом удобно, создаются сразу тригеры (пока только из On click делает Tap, остальные не переносит) ну и параметры смарт-анимейта переносятся.
3. Добавлен визуальный редактор для настройки анимаций. В целом удобная и наглядная штука, потому что многие не особо понимали разницы между Easy Out Cubic и Easy Out Circe.

ProtoPie 6.1 релизнулся. Можете уже попробовать Smart jump. Ну или почитать об обновлении в статье: https://www.protopie.io/blog/animated-transitions-with-smart-jumps

Пока я предавался эскапизму на официальном ютуб канале Protopie Эксперт Джефф разобрал по полочкам мой прототип Cuberto's Liquid Transition.

И сделал целых 3 ролика:
Part 1. Masking & Drag Control
Part 2. Parallax Effect
Part 3. Infinite Transition
Если сложно воспринимать язык, вроде можно посмотреть через яндекс браузер с автоматическим переводом видео.
Или может мне стоит сделать перезалив видоса со своими коментариями? Вобще я начинал писать статью, по различным ликвид-анимациям.. но что-то мне кажется она выйдет не скоро..

Поздравляем победителей конкурса "Pie Day: Prototype Challenge!"
1ое место - @robert_sabio
Prototype 👉 https://cloud.protopie.io/p/897a2b6fa4

2ое место - @camidesign
Prototype 👉https://cloud.protopie.io/p/8ea471fd22