How to avoid going overboard with animations

Recorded May 31st 2020 – watch the full episode on YouTube.

Given how much easier animations are to add in SwiftUI compared to UIKit, how do you recommend making sure you don't go overboard with them from a design perspective?

Meng To: What I would say is just like in design, you have to have certain rules. So one of the rules, for example, animation should not be in a way. Animation should be transitional and animation should be less than, let's say one second. Most animation you're going to see on iOS is less than one second. And we're talking about clicking on a button, go to another screen or clicking on a card, expanding the card. All of those things should happen less than one second.

“Definitely look into trust transitioning as much as you can take. If you're not sure, take example from Apple. They'd give you the best examples they can, you can possibly get.”

And if you're new to animation, a lot of people make the mistakes to do a lot of flipping, rotation, 3D stuff. And there's no sort of smooth transition between the states. So definitely look into trust transitioning as much as you can take. If you're not sure, take example from Apple. They'd give you the best examples they can, you can possibly get.

If you look at swiping... When we got rid of the home button, for example, we had to use gestures. We had to use more animations and transitions. And so, Apple probably took many years to come up with sort of the swipe from the bottom and the home indicator. All of these things have to be really thought through to get the experience that we have on iPhone 10 and now fast forward a few years and you're like, “of course, this makes sense now. I don't need the home button anymore.”

“A lot of apps made by their team, they have amazing animations, so if you're not sure in term of design, in term of animation, interactions, just take example from Apple.”

But it was not obvious back then. So, definitely take examples from Apple. They're a great leader in design. A lot of apps made by their team have amazing animations, so if you're not sure in term of design, in term of animation, interactions, just take example from Apple.

Paul Hudson: I couldn't agree more. I mean, it's so important. Someone asked me a question recently. They're citing from one on my when I pages saying, “listen, when you have a navigation view with large titles and you push to a detail view, you should use the inline titles, the small titles on the secondary view, the detail view and tertiary view, and so forth,” and they were saying, “okay, cool, Paul, that's great. Where do you get that rule from?"

“If you're not sure if you don't want to traipse through all WWDC videos for Apple advice, just run their apps, use their apps and see how they behave because they're ultimately the owners of the platform.”

I just thinking, I remember hearing about it, where was it from? And it ended up being from a one line WWDC 2017 talk, from iOS 11, when they had those chunky title bars coming in first, they mentioned they recommend this behavior. But ultimately my reply came down to, “look at Settings: big chunky title, go in one screen and it collapses down to inline titles.”

So if you're not sure and you don't want to traipse through all WWDC videos for Apple advice, just run their apps and see how they behave because they're ultimately the owners of the platform – they're directing large parts of our UI. You can't really go wrong by mimicking what they do.

Meng To: Yes. It's just full of gems in term of the materials that they put out there. When I learned SwiftUI, and I'm sure it's the same for you, we have to look at their example code, right? We were looking at their tutorials, which is insanely well-made. They have their tests at the bottom of the page. You open the source files and of course at some point they break, because SwiftUI was in the beta stage, but to me, it was the way to learn and also the WWDC videos where they show a lot of the new techniques and the tricks that you can use. But eventually everyone just flocked to your resources because you have just the best thing to Google for, but definitely that's how I started.

Paul Hudson: I totally cheated, Meng. I stayed above WWDC. I was in the hotel above it. So I just walked downstairs to my laptop saying, “hey folks, this is what I think is right. Is that right?” And they'd go, “oh yeah, that's perfect.” I'd go ahead and publish it.

Because you know what it's like – if you're writing and trying things out, you're thinking, “is this the best way of doing it? Is there a better way of doing this?” Being able to ask the SwiftUI engineers, “is that the best way?" And they go, “yes, that's fine." Boom – it goes out.

Sponsor Hacking with Swift and reach the world's largest Swift community!