Swift Playgrounds Author Template for Xcode 13!

Swift Playgrounds Icon

Woohoo! https://developer.apple.com/download/all/?q=swift%20playgrounds

Apple’s updated the Swift Playgrounds Author Template for Xcode 13, which is huge news for people (like me) who author Swift Playground Books.

I’ve talked in the past about building playground books with the author template (the video is here). It’s a great tool for helping you build rich experiences for your students.

With this new download, you can build your playground book without having to keep Xcode 12 around. Now, the template is reliant on a certain version of Swift, so you may need to install a separate build of Swift (which you can get from here: https://www.swift.org/download/), and I’ll go into how to do that (and maybe *why*) at a later date.

In the meantime, I’ve got to go grab my copy to get cracking on a few new Swift Playground books!

Swift Playgrounds 4.0: Christmas Come Early!

Swift Playgrounds Icon

Well, it’s finally here: Swift Playgrounds 4.0!

You can now build entire apps on your iPad and ship them to the App Store. This is a huge update and there’s a ton of great content to go with the update that will teach you how to build apps (with SwiftUI, even!).

Go check it out and I’m sure I’ll have some walk-throughs for you soon!

Prototyping Swift Playground Books

Swift Playgrounds Icon

While you’re waiting, with bated breath, for Swift Playgrounds 4.0 to ship, you might be playing around with Swift Playgrounds, whether it’s on a Mac or on an iPad.

This app and Swift Playgrounds (and Swift Playground Books, which we can author, ourselves — see our two videos on authoring playgrounds with the author template and by copying another book) are amazing tools for teaching coding.

Prototyping

But we talk a lot about prototyping when we talk about building apps. The App Design Workbook and App Design Journal teach you how to use Keynote to prototype an app experience quickly so that you can prove out your ideas and flow before you pour out the blood, sweat, and tears on the actual app.

This saves us from a lot of work that might be for nothing if our core idea isn’t all its cracked up to be. Prototypes let us figure out if there’s something there and whether it’s worth investing the time to develop the idea out into an actual app.

Well, the same thing applies when you’re building Swift Playgrounds and especially Playground Books. These are like stories and games and instruction all bundled into one package, so of course there’s a lot of complexity there.

Keynote

I created a little Keynote theme that might help you storyboard out your Swift Playground Books, which you can download from here. Simply download that file an unzip it and double-click it, and it’ll install the template for you to use when you create new Keynote files.

It’ll give you a title screen first, and when you add new slides to the presentation you should choose the Playground Prototype slide type, and it’ll give you an area for prose in the upper left hand corner, an area below for code students might run on that particular page, and a dummy live view on the right hand side where you can sketch out what the code drives.

This way, just like an app, you can storyboard out your whole book experience and see how people will flow through the book. You can pinpoint what coding techniques you want to show off or teach or enable on a given page, as well as any instruction or story you might tell on each page.

Hopefully you find this useful, like I have!

EU Code Week 2021: Sneak Peek

October 21

October 21st is barreling towards us, as is our App Inclusivity Challenge!

We’ll have a lot of hands on with Keynote prototyping, as well as the next leap: to code!

As a part of our activity, I’ve thrown together a playground based on a prototype one of Lyndsey’s students did. The goal is to show you (or your students) how the user interface relates to code.

If you’re curious and want to get a sneak peek of some of what we’ll be working you through on Thursday, go ahead and download this playground to your iPad or Mac. It’s in the main Code Hub Playgrounds feed, which you can access here: https://www.thecodehub.ie/playgrounds/

If you already subscribe to the feed, this new playground will show up when you tap on More Playgrounds > See All. It should look a bit like this:

It’s called Europe Code Week 2021: App Inclusivity Playground, and there are plenty of instructions in the playground, itself. If you’re lost, though, you can always join us on Thursday. We’ll work through the App Inclusivity activity and how you might use it in your classroom.

See you then!

EU Code Week 2021 is Here!

It’s October again and that means EU Code Week is back!

And this year I’m working on a little project with a few brilliant folks on an EU Code Week Challenge called the Inclusive App Design challenge.

The challenge is all about considering people from many different backgrounds with many different types of abilities when you design your apps.

The Activity & the Audience

Keynote

This activity is perfect for teachers who might have an iPad 1-to-1 classroom or school, but you can adapt it, no matter the gear you have on hand.

It’s also perfect for you if you don’t have a background in coding. We spend a lot of the activity just thinking about what makes an app and how we might design it to accommodate all sorts of users.

Introduce -- Brainstorm -- Plan -- Prototype -- Share
Working through the process

Now, we will still touch on coding, of course, as it is EU Code Week, but hopefully we’ll do so in as non-threatening a way as possible. To do that, I’ll show you Swift Playgrounds and the really fun Answers playground.

Answers playground icon
Answers Playground

This is a playground where students write code to get answers from their fellow students and can use those answers in their code later.

You’ll see how you can design your code and app at all sorts of levels.

For those who want to build out their creative vision, you’ll learn about Keynote prototypes and the power you can wield, putting your idea in people’s hands.

You can read more about the activity and what’s involved here: https://apple.co/eucodeweek_UK

Try it with Us

October 21

If you want to see how you might use this activity in your class, feel free to join us!

We’ll be running a 90 minute session on Thursday, October 21st at 18:00 CEST. We’ll walk through how to approach the activity and what you can do in your own classroom.

Register here: https://ec.europa.eu/eusurvey/runner/Inclusive-App-Design-CodeWeek-Apple

I hope you’ll be able to come; I think we’ll have some great tips and tricks for you to use this in your own classroom!

New Toys! Animating Images

I had a great question from a teacher at a secondary school here in Ireland about animating images in a Swift Playground. The question was basically: How do I do it in a playground with Swift?

You can go to the source, of course, and check out the documentation, but I’ve added a new playground to our new Adventures feed to show off two ways (sort of) to display an animated image.

https://www.thecodehub.ie/playgrounds/

Our Adventures feed, for those of you just joining us, or who’ve forgotten, is aimed at slightly more advanced folks. It explores things like SwiftUI, UIKit in playgrounds, and more.

The PlaygroundBook: Animating Images

The new playground book is called Animating Images and shows you how to use some of the cool capabilities in UIImageView to display a series of images over a certain amount of time.

The first page is an implementation of animated images using UIImage and UIImageView. We pass an array of images to a static method on UIImage and set the duration over which they should be displayed. Play around with different numbers of images and duration to fine tune your animation. Make sure to read through the comments, which will show you other ways of using UIImageView.

The second page implements the same thing, but with SwiftUI. It cheats, a little bit. The Image view that you would use to display images in SwiftUI doesn’t animate UIImages that are animations. Try it out, instead of using our new AnimatedImage view, comment that line out and add this line:

        Image(uiImage: self.animatedImage)

You’ll see a very static image that only displays our first image from the array. Our AnimatedImage addition is simply a wrapper around UIKit’s UIImageView. We could have used Combine or some other clever way to update our view with images. But this approach simply takes advantage of a well-known component we can re-use without too much pain.

Try it out, play around with your own images, your own timing, and see what kind of animated image you can create!

You can subscribe to our Adventures feed (or the original feed) here https://www.thecodehub.ie/playgrounds/ from your iPad. Alternatively, if you use Playgrounds on a Mac, you can paste this URL into the subscription bar: https://www.thecodehub.ie/playgrounds/adventures/feed.json

More Advanced Apps: Segues and Navigation Controllers

We’re in the thick of a hackathon project and some students are plowing ahead with their prototypes and looking to turn them into full-blown apps.

In this new video I walk you through a pretty common scenario.

Many of our apps are going to have more than one screen. And what appears on subsequent screens is going to depend on what a person has tapped on or possibly something they’ve typed in or a way they’ve interacted with a previous screen.

So we need a way to pass data from one screen to the next. This topic is covered in Develop in Swift Fundamentals in Lesson 3.6, Segues and Navigation Controllers.

Our segue will be our go-between our original, or our source, view and our destination view. And there’s a little bit of sort of magic* involved.

Check out the video below for some steps through creating another View Controller that will be our destination view, the code that backs it, a connection to the new view, and how to wire up passing data between the two.

Best of luck building out your more complex app!

* Well, not quite “magic.” More like hooks into the very inner life of our iOS app like we’ve got a pair of X-ray specs and suddenly we can see all this cool underpinning of our apps going on that maybe we didn’t realize was there before.

App Development Workshop Follow Up

I hope you’re all enjoying the summer. It’s been sunny and warm in Ireland, thank goodness, so we’ve been spending our time outdoors as much as possible!

But we did get inside to do some coding when we recently ran a series of workshops to introduce new coders to the Develop in Swift series as part of an app development challenge.

If you’ve been reading Develop in Swift Explorations or Develop in Swift Fundamentals , I’ve recorded a video that takes some of the concepts and an approach to building an app and walks you through one way to do it.

I give you some pointers to lessons in Fundamentals or projects in Explorations that you might explore to learn more.

Check it out and we’ll be back soon with some more videos and coding tips!

DocC for Building Tutorials

One of my favorite things from WWDC21 this year was the DocC stuff. The funny thing is, I had NO IDEA it would be one of my favorites until Saturday, when I was catching up on some sessions.

There are the heavy hitters, of course, like the SwiftUI sessions, the announcement that you’ll be able to build and submit apps to the App Store from the next version of Swift Playgrounds. But this was a sneaky, wonderful surprise.

But go check out Building Interactive Tutorials with DocC. That’s an amazing session that I, as someone who tries to teach coding, found incredibly useful. You can build tutorials like the ones for SwiftUI and App Dev Training that Apple have shipped.

Build Your Own

That’s a good start, building rich tutorials that show up in the Xcode documentation window. Buuuuuuut, if you check out Host and automate your DocC documentation, you’ll see that you can put it up on your own site!

You need Xcode 13, the beta, to build documentation, but your students don’t. You can export the DocC archive, put it up on a website, and away you go!

Now, it was a bit more work than just “upload it to a website and you’re good to go.” I’ll go into the details of what you need to do, from a practical standpoint, in the future.

But for now, you can now browse the start of a series of tutorials all centered around the QuestionBot.

It’s a Swift package based around a QuestionBot type. The tutorial series takes you through building the QuestionBot as a command-line tool in replit.com, then using UIKit to build the project you see in Develop in Swift Explorations, then, finally, the SwiftUI implementation you may have seen (or will see) in our Teaching Develop in Swift Online class!

At the moment, there’s only the first tutorial, the others are coming soon. But I love the UI for the tutorials and how much easier it was to throw it together this way.

There’s also a really nice, comprehensive documentation page where you can check out the API for QuestionBot and still navigate to the tutorials to see how you might use that code in practice.

Like I said, I’ll detail how I built that tutorial in a future post, but in the meantime you can see the results. It’s rare we get to ship stuff they just announce at WWDC, and ‘m so psyched about writing some more tutorials and having them look excellent out of the gate!

WWDC Favorites?

I hope you’re all enjoying WWDC21 so far!

There’s so much to chew on, from SwiftUI improvements and additions, Xcode Cloud, RealityKit additions, Object Capture, Accessibility. AND BUILDING APPS IN SWIFT PLAYGROUNDS!

But I’d love to hear from you, what is the most exciting technology or thing they’re highlighting at WWDC this year?

Who knows, this might help us add things you care about to Teaching Develop in Swift Online in two weeks!