Some time ago I started buying some 🍎 shit. There was some time since I used an 🍎 device, so the iOS design guidelines were a bit new for me.
After using the the 🍎 ecosystem for a while (a couple of months) I started a romance with that sleek, simple and well done interface.
I started trying to use those guidelines (or something inspired in them) in personal projects and I noticed something was off. Something wasn't "smooth" or "lickable" (you get me? When something is so sexy and good looking you wanna lick the screen? I hope I didn't sound like a weirdo lol) enough. Then I learned the bitter and sweet truth about what was going on. It was them, the squircles.
Squircles are basically another way to draw rounded rectangles. Instead of a "harsh" curve, it's a little more pointy. It's very subtle, but it makes a big difference in how final products look.
Here’s another point of view:
It’s a nice little touch to make everything more enjoyable.
On swift (iOS native language) apps it’s really easy to achieve that effect, but what about other areas?
Design apps Only a small portion of the available design apps enables the user to use that kinda stuff. Figma and Sketch are the only ones I know that offer the feature. Adobe XD and Framer doesn’t have anything similar.
Web Development Unfortunately there’s no easy solution for that. The easiest way for us to mimic that function is using clip-path property from css mixed with some JS.
