Jetpack ComposeにおけるShared Element Transitionsの実例と導入方法またその仕組み

Shared Element Transitionsをご存知でしょうか？ Shared Element Transitionsは画面間の遷移において、特定のコンポーネントが滑らかに移動や変化することによって、美しい画面遷移を実現することができる画面遷移の一種です。これをJetpack Composeで導入しようとすると、LookaheadScopeなどを用いて頑張って実装するしかなかったのではないかと思います。実際Jetpack Composeに実装が移行したGoogle Play StoreなどのアプリもJetpack Compose対応以降Shared Element Transitionが無くなっており、実装の難易度が高い事が窺えます。そのような状況で、ついにJetpack ComposeでもCompose1.7.0-betaから実験的な機能として`SharedTransitionLayout`, `Modifier.sharedElement()`などが導入され、Shared Element Transitionを以前よりも手軽に導入することが可能になりました。早速私達のプロダクトでも導入し始めていますが、とても簡単に書くことができる一方、注意しなければならない点もありました。このセッションでは、Shared Element Transitionsをどのような場面で使うべきか、またJetpack ComposeにおけるShared Element Transitionsの使い方、導入方法、その仕組みなどの知識/知見を提供し、みなさんが簡単に導入できる手助けができればと思います。