This is my submission for the WWDC 2017 Scholarships
Click the screenshot below to open the video:
Download the zip file here. Then transfer the playgroundbook file to your iPad (using AirDrop, iMessage or iCloud Drive) to start playing around with it!
Have fun! And let me know on Twitter what you think :)
In September I’m starting a Computer Science studies at university. One of the requirements before enrollment in the program is to do some knowledge tests, one of them was a Calculus test and another one was about Computational Thinking. That topic really interested me, as it apparently is a skill we are born with and I did a little bit more research on it. This is where my inspiration for the playground came from. I wanted to let people experience consciously using this skill to solve a problem.
I came up with the problem with the marbles and I’ve wrapped a playground around it! I wanted to create a clean, interactive playground where you’d also learn a bit from. Of course, it’s hard to really go in depth within the three-minute time limitation…
I’ve decided to go with a playground book opposed to a Xcode playground or a normal playground in the Swift Playgrounds app. I love the way the Swift Playgrounds app is built and I think you can create some amazing playgrounds with them. For me, the playground books add the “WOW”-factor to a playground. The playground books are a lot more interactive and you can express your creativity better than in normal playgrounds. Also, I think it’s cool to have multiple pages with separate assessments which all have a different meaning to the complete story/book.
Regarding the technologies I’ve used in my playground. For the live view, I’ve mainly relied on SpriteKit. SpriteKit makes it easy to create this kind of interactive views including easy model creation and physics. For ease of creating a live view with the right dimensions/constraints, I decided to use a storyboard. Although it took a while to figure out how to include them in the playground. :P
I’ve also tried to utilize as many features of the playgrounds app (and the PlaygroundSupport library) as possible. That’s why a big part of the playground is using assessments. I think it’s cool to program something step-by-step (while simplifying the code, using for example micro-commands) and then use the code you’ve written earlier in the playground to solve a challenge. I’ve used the glossary to add definitions to some more technical words or some words where a little more explanation is useful. For the introduction, I’ve used a cutscene page with a little HTML.
Code-wise I really wanted to do a good job. I’ve tried my best to write clean, modular code and I think I’ve done a pretty great job. You’re very welcome to check it out! Personally, I’m more into the code than UI design. I simply love to write the code behind a program and give meaning to an otherwise useless UI. Luckily we need both designers and programmers in the development world!
Follow me on Twitter for more cool stuff and things! @matthijs2704