iOS Dev

This media is not supported in your browser

VIEW IN TELEGRAM

💥 Реализация анимации отклеивания для повторения эффекта в приложении Messages

Один из крутых и необычных эффектов в «Сообщения» — анимация отклеивания, которую можно увидеть при отправке стикера.

Если внимательно посмотреть, можно различить несколько отдельных анимаций, которые сливаются воедино:

1️⃣ Стикер деформируется и «приближается к камере», начиная с верхней и продвигаясь к нижней части стикера.

2️⃣ По поверхности стикера проходит блик, усиливая эффект деформации и заставляя нас поверить, что частично деформированный стикер отражает невидимый источник света.

3️⃣ При «сгибе» стикера можно увидеть рассеянное отражение того, что облегчает пользователю понимание происходящего.

🧐 Robb Böhnke решил поискать способы для повторения этой необычной анимации (не обязательно с точностью до пикселя).

📖 В этом посте он делится, как воссоздать эту анимацию в SceneKit и как интегрировать ее в обычное приложение на UIKit.

🛠 А вот здесь даже есть рабочий пример кода. Только обратите внимание, что на симуляторе не запустится, так как используются кастомные модификаторы шейдеров на Metal.

😃 iOS Dev

Please open Telegram to view this post

VIEW IN TELEGRAM

🔥29👍8💯3❤2🤩2⚡1👏1🎉1

www.tgoop.com/iosdev/834

3.53K viewsApr 13, 2023 at 06:00

💥 Реализация анимации отклеивания для повторения эффекта в приложении Messages

Один из крутых и необычных эффектов в «Сообщения» — анимация отклеивания, которую можно увидеть при отправке стикера.

Если внимательно посмотреть, можно различить несколько отдельных анимаций, которые сливаются воедино:

1️⃣ Стикер деформируется и «приближается к камере», начиная с верхней и продвигаясь к нижней части стикера.

2️⃣ По поверхности стикера проходит блик, усиливая эффект деформации и заставляя нас поверить, что частично деформированный стикер отражает невидимый источник света.

3️⃣ При «сгибе» стикера можно увидеть рассеянное отражение того, что облегчает пользователю понимание происходящего.

🧐 Robb Böhnke решил поискать способы для повторения этой необычной анимации (не обязательно с точностью до пикселя).

📖 В этом посте он делится, как воссоздать эту анимацию в SceneKit и как интегрировать ее в обычное приложение на UIKit.

🛠 А вот здесь даже есть рабочий пример кода. Только обратите внимание, что на симуляторе не запустится, так как используются кастомные модификаторы шейдеров на Metal.

😃 iOS Dev