Swift

Apple Design Resources

One of my favorite things about swiftui is how easy it is to pull in clean and beautiful iconography. I’m happy to go screw it up by crowding interfaces and building crap UI. Apple can’t make me a good designer. But they can arm me with plenty of tools to get there. One of the most impactful for me is the SF Symbols font, which can be downloaded at https://developer.apple.com/sf-symbols/. There are others to manipulate svg files and other formats, but the beauty of SF Symbols is that it’s simple to change size, color, placement, and even multiple colors concurrently (some fonts are multi-colored). For example, let’s say I want an arrow – I can just click Arrows.

Apple also makes a boatload of templates available for many of the most popular design tools like Sketch, Photoshop, XD, and probably the most approachable, their own Keynote. Those are at https://developer.apple.com/design/resources/. These have design elements that can be dragged around and dropped on a screen for rapid prototyping. It’s useful to see how the layers in those apps translate to layers of objects within swiftui to generate a given effect. For example, in the below, we drop a text field and picker in a form, create a section with a picker in it, then some if then statements to conditionally show other elements. I used to draw out screens for Pascal on graph paper and spend countless hours trying to get the compiler to rinder every pixel right where I wanted them to be. Now we just drop some elements into a view controller.