# Made in Compose - Apple watch ultra water level animation

DevFeed: [Made in Compose - Apple watch ultra water level animation](<https://devfeed.tech/articles/made-in-compose-apple-watch-ultra-water-level-animation-25791.md>)

Original publisher: [Read original article](<https://www.sinasamaki.com/made-in-compose-apple-watch-ultra-water-level-animation/>)

Author: sinasamaki

Published: 2022-10-06T21:28:43Z

Content type: tutorial

Language: en

Sources: [sinasamaki](<https://devfeed.tech/sources/sinasamaki.md>)

Topics: [Jetpack Compose](<https://devfeed.tech/topics/jetpack-compose.md>), [Compose](<https://devfeed.tech/topics/compose.md>), [Canvas](<https://devfeed.tech/topics/canvas.md>), [ui](<https://devfeed.tech/topics/ui.md>), [Code](<https://devfeed.tech/topics/code.md>)

Tags: [animation](<https://devfeed.tech/tags/animation.md>), [apple](<https://devfeed.tech/tags/apple.md>), [apple-watch](<https://devfeed.tech/tags/apple-watch.md>), [article](<https://devfeed.tech/tags/article.md>), [canvas](<https://devfeed.tech/tags/canvas.md>), [code](<https://devfeed.tech/tags/code.md>), [compose](<https://devfeed.tech/tags/compose.md>), [jetpack-compose](<https://devfeed.tech/tags/jetpack-compose.md>), [ui](<https://devfeed.tech/tags/ui.md>)

## AI overview

This tutorial explains how the author recreated the Apple Watch Ultra diving app's water-level animation in Jetpack Compose. It covers choosing a canvas, drawing text through view interop, constructing animated cubic paths, and using blend modes to change the visible text colors.

## Source excerpt

Welcome to the first post in my Made in Compose series where I attempt recreating UI and animations, in Jetpack Compose and share my process. In this first post, I will be recreating the water level animation in the new Apple Watch Ultra diving app. This was one of the