What makes SwiftUI so attractive to learners and designers?

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

‌SwiftUI design is very, very different to what we had before in UIKit. What would you say makes SwiftUI so appealing to learners and designers?

Meng To: So I've been teaching a lot of tools over the past six years. And one of the key things that I'm looking for when teaching is to teach in the least amount of steps possible, and that's kind of what learners are looking for is they don't want to switch between too many apps, too many windows, too many steps.

SwiftUI really brings that. You only have your code and then you have your preview on the right side. And this is super important because you want to see the results in real time. So whatever you change and you want to look at the least amount of code possible, it's very short, it's very expressive and it's very easy to explain, especially from a UI perspective, hence why you have the “UI” in “SwiftUI”.

Paul Hudson: So because it is concise, you can say, "Hey, this one modifier gets you the result you want," I guess so folks can make progress more quickly and see the results of their work.

“A lot of designers, they know a little bit of CSS, they know a little bit of HTML, they know a little bit of a prototyping tools. So when they look at the tool like SwiftUI, which is to me, feels like CSS reinvented in 2020.”

But it seems also that SwiftUI is particularly popular with designers who, they weren't coders beforehand. They weren't designers doing Illustrator or Photoshop or something else. And they're coming to SwiftUI thinking, “actually, I can do this.” So why do you think it's particularly appealing to designers?

Meng To: The thing about designers is that they're looking for something that is very closely related to a layout system. A lot of designers, they know a little bit of CSS, they know a little bit of HTML, they know a little bit of a prototyping tools. So when they look at the tool like SwiftUI, which is to me, feels like CSS reinvented in 2020, you're talking about stacks, you're talking about grid, you're talking about animations, states.

“Using real code and to be able to collaborate better with engineers I think that's the ultimate tool that a designer can hope for, which really, really helps their work.”

So all of these things are very commonly related to the prototyping tools that they have been using the CSS techniques and it feels very modern. And again, the preview is just beautiful. So for designers, especially those who have used Framer, for example the classic version of Framer, or how to change from the beginning state to the end state in prototyping tools, or even now because of how design tools have become so sophisticated, such as Figma, such as Sketch, Framer.

You can do so many things nowadays. It's only this year that we started seeing this emergence of sophistication in term of prototyping, you can now prototype states, micro-interactions, inside design tool, although is definitely not as powerful as SwiftUI. So to be able to do that in something that is as simple as a prototyping tool, but also using real code and to be able to collaborate better with engineers I think that's the ultimate tool that a designer can hope for, which really, really helps their work.

Paul Hudson: Often we see apps like Gmail or Google Maps that have Google's material design, because that's Google's design across all platforms no matter what you use. Whereas other developers say, “I want my apps to look and feel more like iOS.” What's your take on that?

Meng To: I would strongly advise to go with the platform first. I think it's important to focus on quality, to focus on the experience before spreading thin on multiple platforms. A lot of designers, they make the mistake to create a design that try to fit all or for developers to create a code that fits all. But at sort of like at the mid road, the designer will soon figure out that well, “yes, it looks nice, but at the same time, there's always a trade off.”

“It's much better to do one thing the best first. And then if you see that there's a lot of people interested in your product, then you can say, okay, maybe it's time to expand. Maybe it's time to go to Android. Maybe it's time to go to web as well, so that's how I would do it.”

Instead of that, you should be focusing on a platform and reduce the amount of steps, focus on quality, focus on experience, really sponge the knowledge of the iOS guidelines. Because if you have three guidelines to look for, it's very different from having one guideline. If you have to satisfy three platforms it's very different from having to certify one platform.

It's much better to do one thing the best first. And then if you see that there's a lot of people interested in your product, then you can say, okay, maybe it's time to expand. Maybe it's time to go to Android. Maybe it's time to go to web as well, so that's how I would do it.

“SwiftUI is much closer to React, which is why I believe there's such a popularity with SwiftUI right now, especially amongst people who are looking to learn iOS.”

Paul Hudson: Yeah, certainly. I remember one of the very early things Apple said about iPad is everyone knows how to use iPad because they've used iPhone and iPad follows exactly the same guidelines as iPhone. So if you can use an iPhone, hey, you can use an iPad. Because it's just, natural by that point.

Of course you can say it'll save us some time, save us some money, whatever it is to take one guideline applied everywhere, but then you'll just annoy almost everyone. Android users won't like it. iPhone users won't like it. iPad users won't like it. We all feel grumpy. So at least take the time to specialize and make it really, really right.

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