Lickability

People who make apps people love.

Website: https://lickability.com
Blog: https://blog.lickability.com

Last Notes

2025-06-11 17:33:36 UTC

We have some love to give SF Symbols 7:
Apple’s new Draw animation system is great, and the included tools for making your own are killer! You can fill in the blanks for symbols that didn’t get animations, or animate custom ones relevant to your projects. #WWDC25
https://files.mastodon.social/media_attachments/files/114/665/928/428/344/638/original/77eb7d82a2c0bc36.mp4

2024-12-12 19:32:08 UTC

- reply

So that’s exactly what we did! When rendering the timeline, we take the symbol, blur it, set any pixel with a non-zero alpha value to be fully opaque, then use that as a mask. It renders super quickly since we’re using a `Canvas` view, and most importantly, it works great with weird-shaped symbols.
https://files.mastodon.social/media_attachments/files/113/641/514/924/046/662/original/58928ab2a187cfa0.mp4

2024-12-12 19:31:30 UTC

- reply

Since SwiftUI doesn’t let us add strokes to symbols, we had to figure out how to do it from scratch. We remembered this technique from a few years ago when meta-balls were all the rage where SDFs were simulated by blurring shapes and then turning any non-transparent pixel opaque https://youtu.be/hfKGLJejAEw

2024-12-12 19:30:49 UTC

- reply

What we really wanted was basically the "Offset Path" effect in Adobe Illustrator. Or in Photoshop/Pixelmator world, adding a stroke.
https://files.mastodon.social/media_attachments/files/113/641/509/492/373/216/original/9b0f773f38395e72.mp4

2024-12-12 19:30:10 UTC

- reply

There are three options here: no mask, a square or circle mask where we just plop a shape behind the symbol and mask out the line. Which, while fine for square-ish or circular symbols, breaks down here with irregular shaped symbols. And we'd have to keep track of which mask to use for which symbols.
https://files.mastodon.social/media_attachments/files/113/641/508/268/576/280/original/0f2232a437cbbaf0.png

2024-12-12 19:29:47 UTC

- reply

The event timeline has a hidden detail that you might’ve missed. Each event has an icon associated with it, and the icon sits on top of the timeline…line. We knew that having the line run into the icon would make it difficult to see, so we had to figure out how to add some kind of negative space
https://files.mastodon.social/media_attachments/files/113/641/506/670/753/112/original/f0ee703b51476dfe.jpeg

2024-12-12 19:29:18 UTC

- reply

We went all out with the details here. At the top, a slowly-rotating 3D user figure is textured by a glossy, marbled version of your app icon. It's really cool. It uses SceneKit under the hood, so it's blazing fast and sips energy.
https://files.mastodon.social/media_attachments/files/113/641/501/272/775/718/original/5457d0e14847ac03.mp4

2024-12-12 19:27:31 UTC

Our first major update to the @npub1l0f…2xjn app just dropped! We got a ton of requests to see more customer info. Now when you tap a transaction, you'll see the customer (with a timeline) first. There's a button to jump straight to the transaction, too. Check it out: https://apple.co/4guqAfm
https://files.mastodon.social/media_attachments/files/113/641/497/383/326/724/original/8a5abc36278a60ff.jpg

2024-09-05 18:30:33 UTC

Remember the Playstation 3?
Our resident Playstation expert @npub1gxh…7wym recreated its famous “waves” background with a Metal shader on iOS!
https://files.mastodon.social/media_attachments/files/113/086/365/910/475/745/original/3aa721faceb114f1.mp4