Automating the Creation of iPad Content

Session 302 WWDC 2010

As the demand for content for iPad increases, so does the need for tools to create that content. Mac OS X offers well-integrated automation technologies and tools, including Automator, Services, and AppleScript, that are ideal for generating content. Geared towards professional and non-professionals alike, this session will include hands-on tutorials covering how to use the automation technologies of Mac OS X to create and distribute HTML-based content for iPad.

Francois Jouaux: Welcome to Automating the Creation of iPad Content, Tools for the New Desktop Publishing Revolution.

Wow. Good title like this.

Either they are a car salesman or there's something really interesting here.

Let's see.

And I forgot my teacup.

[ Silence ]

Hello. I am Francois Jouaux.

I am the Senior Manager of System Tools at Apple, and also Engineering Manager of Automation which means they make me code.

And what is this session about?

This session is about the relationship between automation and iPad content creation.

It's about the role automation will have to take in iPod content creation, and the tools and techniques that are available today to simplify your life.

Who is this session for?

There's a very wide spectrum of people that want to create content for the iPad.

These range from students, teachers that want to publish papers, that want to publish art, photos, illustrations to your boss.

People that are coding impaired.

People unlike you.

You have to relate to these people and help them distribute and manage the content that they have created on the desktop, and that they want to make available to all the people that have iPads.

This session is about developers because there is a market for such tools that will enable the creativity of all the consumers.

What you will learn.

You will learn how automation can help you.

You will learn about the automation technologies available today on Mac OS X.

And how to develop custom content creation tools using these technologies.

What are these technologies anyway?

AppleScript is your English-like scripting language that controls the Mac OS X operating system, its applications on also third party applications.

Automator.

Our award winning visual workflow development tool.

With its hundreds of actions allows you to create powerful recipes and services since Mac OS X Snow Leopard services put at your point-of-need contextual menus that allow you.

That gives you the power and the ability to harness these automation technologies.

And to talk to you about this into more detail, dealing you with some crazy demo, here is Sal who you all know.

[ Applause and cheers ]

Sal Soghoian: Sick, sick, sick.

Anybody who gets up at 9:00 in the morning to hear me talk is insane, so I'm in a roomful of crazy people.

I'm Sal Soghoian.

I am officially the Product Manager for Automation Technologies at Apple Computer for the last thirteen years.

And this has been.

Out of thirteen years of being at Apple, this has been one of the most exceptional years that I've seen at the company.

You know, with the release of the iPad and just all the changes that are going on, the dramatic movement forward and pushing the platform and integrating new and groundbreaking technologies, it's a lot of upheaval, a lot of disruption, a lot of creativity.

So people might have a question about well, how does this relate to Mac OS X now that we have iPads?

Well, if history is anything to judge about what's going to be coming up, we in the automation community are really excited about our prospects and about what we can do to make and assist concrete, the creation of content for the iPad moving forward.

And I'll start by giving you a brief little history about the concept behind desktop publishing.

Now back in like 1990 or the early '90s, or the end of whatever decade that was, there was an invention of a new technology called PostScript which defined the way things looked on a page.

And they integrated this technology into printers, laser printers, into Linotronics, and into the Macintosh.

And for the first time, using programs like Ready,Set,Go!

and PageMaker, designers and publishers were able to produce content that they could never do before in a really timely fashion.

Because up to this point they were taking photographs, stripping things in.

They had Hot Type, there were Ruby lists.

A lot of manual effort went in to produce a page.

And suddenly when that moved to the desktop computer, it enabled a lot of creativity and it enabled the faster processing and turnaround of media.

Around 1993, AppleScript was introduced.

And with scriptable programs like QuarkXPress and FileMaker Pro, all of a sudden we had the ability to produce content based upon data sources like databases.

So catalogs and different types of publications that were data intensive, yet needed precision like weather maps and stock figures for newspapers.

Those kind of materials could for the time be produced in a timely fashion and with accuracy.

Because what AppleScript and automation delivered was speed, accuracy, consistency and scalability.

So for the first time companies could scale what they were doing without having to add a lot of new people and deal with the aspect of dealing with humans and time off and all that kind of stuff.

So this was a groundbreaking point when automation and publishing combined for the first time electronically.

About the beginning of the last decade of the last millennium.

Ooh, I like that.

Last millennium.

The Internet really boomed and started becoming a commercial entity where people, the focus on it was no longer this, you know, creative education community.

And became wait a second, this thing is really big.

We need to communicate, we need to get our message out.

I need to tell you something.

I need to hear this.

And it really became a lot about communication.

So technologies were developed like CSS, Cascading Style Sheets.

RSS, XML, and other Internet technologies joined HTML.

And really allowed the Internet to start becoming a platform for development.

Again, automation played a role in that because with AppleScript and tools like Automator, suddenly media, being able to produce media in a timely fashion and get it out to the public through podcasts, audio and video podcasts, became possible.

So the concept that had started earlier in the mid '90s is now coming to fruition and growing more and more because the demand for content increased.

And here we are now at the beginning of this decade and they've turbocharged some of the technologies that they introduced for the Internet like cascading style sheets and HTML5.

And they enhanced their abilities to take it into the next decade.

Well, the same happened with automation.

With Snow Leopard we introduced something very dramatic.

It's called AppleScript Objective-C.

And for the first time AppleScript could talk directly to the Cocoa frameworks.

So anything that is possible to be called from a Cocoa app can now be called from AppleScript directly.

And this, combined with our revolutionary new Services architecture that puts these tools at the point-of-need contextually throughout the OS, this really set it up for the delivery of content to a whole new series of devices.

So as you can see throughout the whole electronic history, automation has played a role in delivering content.

And if this is true, I have a feeling that it's going to pertain and producing content for the devices moving forward just the same way.

Because this device is going to spur a whole new wave of desktop publishing revolution.

A whole new wave of content creation.

You're here because of that.

You're learning how to produce content.

You're learning how to create apps that absorb content or deal with content.

So let's take a look at this device.

By itself, it's just a really handsome well-designed tool.

It doesn't have impact until you put something on it.

And then you can become, it becomes a device that can inform.

It becomes a device that can find and locate things, and help you get through and navigate.

It also becomes a device that helps you remember.

These are a couple friends of mine I lost this last year.

That's Leroy Moore and George Melvin, so that's to you guys.

So you can remember.

You can have photographs and videos that help you see part of into your life.

And you can also use the device for education as well with iTunes U, and with third-party software like MathBoard from Pala Software.

So the device, it's really the content that makes this device important and makes it happen.

It's a great device, but without the content that you produce and others produce it's just a device.

So how do you get content onto the iPod, iPad, iPod, iPad.

Puh-puh-puh-puh-puh-puh.

So let's take a look at some of the ways.

First of all, you can make a native app, right?

You can write an app and the app can have, deliver its own content.

So you've seen things like, you know, USA Today has an app and it gets content and displays it from within its own app.

We know about that.

You can also have productivity applications like the iWork Suited Tools.

Or like Omni's programs where you can create and share files.

And that's one way to get content between different iPads.

There's also electronic books.

You can deliver those through commercial publishers and through the iBook Store.

Or you can use the open and free EPUB format and create your own, and distribute those as well.

But one of the most exciting things is, of course, podcasts keep.

You can now take podcasts and enhance them.

They're much more visually exciting, and you can convey the messages a lot easier now on an iPad because they're portable.

And one of the most exciting things that's now available is this whole discussion of HTML5.

You know that a lot of the classes that you've been seeing here are all about HTML5.

Well, we're going to look at how automation plays a role in HTML5 and how, how can auto.

How can you automate the creation of HTML content?

So we're going to look at a couple different scenarios.

We're going to look at contextual tools.

What kind of automation tools can you have that make it easier for you to process the materials that you are going to put together and send to an iPad?

How do you deal with media?

How do you deal with compression of audio and video?

How do you deal with manipulating images?

How do you deal with talking to databases and grabbing information?

So we're going to look at contextual tools, automated tools that allow you to do these kind of things.

Then we're going to look at a technique called Template Publishing.

This was first designed back in the '90s where they were automating the creation of catalogs.

But the principles remain the same.

It's just at different destinations.

Instead of going to print, we're now going to an HTML bundle.

But the principles about how you could take a template and populate it instantly through automation remain the same.

And we're going to a look at a couple of those examples.

And then finally we're going to look at an interactive Web example where automation not only creates the content, but publishes it across the Internet and then responds to the users when they interact with that content.

So those are three scenarios we're going to look at in this short period of time today.

And the technologies we're going to look at, we're going to examine that do this are of course Automator, AppleScript, AppleScript Objective-C and Services.

So let's talk about contextual tools.

This is a great quote.

This was a Tweet from John.

I heart Automator.

Thought to myself wish I had a droplet that could turn high-res H.264 into Apple TV-size H.264.

Took thirty seconds to make one.

John was talking about of course this technology, Automator.

We introduced Automator way back in Tiger.

But it's steadily progressed.

And what it does, it's a tool for visually creating automation recipes called workflows by joining together little nuggets of pre-done automation called actions.

Now these actions are installed in the operating system, and by default they have hundreds installed.

But you can download thousands of third-party ones or create them yourself.

Because they're just Xcode projects that are written in any of the languages supported by the operating system.

So if you write Objective-C or AppleScript, Shell, Ruby, PERL, Python, whatever code works on Mac OS X you can use to create your own Automator actions.

And we're going to look at that.

And they're based upon a simple principle that you've seen over and over and over again.

I'm by law required to do this slide, so here's the frameworks of the operating system.

The applications sit on top of the frameworks.

The user triggers the applications to talk to the system frameworks.

And then that does something good for the user.

We've seen this over and over.

You design an application, it might be an image manipulation application.

It talks to Core Image.

And then does something to the image that the user wants, right?

Basic concept.

We understand this.

But what you might not know is that Services can do the same thing as an application.

When you write one of those Automator actions, it talks to the frameworks the same way that an application does.

There's no framework that the application can get at that the service can't get at.

So in many ways they're like mini apps themselves.

But one other thing in addition is that they can control applications.

So a service can interact with an application and get the application to do something, as well as talk to the frameworks in the operating system.

They're really powerful.

So you can gain access to all the different abilities of the operating system through Automator.

That includes applications, it includes the command line, Core Video, Core Audio, Core Data, Core, Core, Core, Core, Core.

And even the media frameworks.

All of that's exposed to you when you write an Automator action.

Then once you've created these, you can expose them through Services.

Services is the architecture that provides point-of-need access to the power of the OS.

So up in the Services menu, in the Application menu you have the ability to access Services.

In the Finder, in the Action menu you can access Services contextually based upon what you have selected.

The same with the contextual menu in the Finder, or the contextual menu in other applications.

So if you have text selected, you only see the services that pertain to text.

Or pertain to the type of text that you're looking for.

So no longer do you have to open up an image in an application to rotate it or apply effects to it or do anything else to it.

Because all of that ability that's part of the operating system can now be exposed contextually at the point-of-need.

You can be in an application like Mail, look for a certain kind of data like an address, and tell Mail to make a new document with that and pre-address it.

No longer do you have to write a plug-in to Mail to do that, because the Services architecture gives you contextual access to whatever is selected in the application.

And then you can apply that power to it.

And you can do way beyond what a browser plug-in can do.

You can select data in one form, transform it into another form.

Take it to a different application and put it into that application as I just did here by selecting Table Data in Safari, turning it into a pie chart that I put into pages.

This goes way beyond being just a browser extension.

You have total access to the entire OS, and you're only limited by your creativity.

So tools for content preparation is talking about creating these kind of contextual tools and using these kind of contextual tools that manipulate the content, the raw content in preparation for getting it to the iPad.

Make sense?

Hmm-hmm-hmm?

Okay, good.

Now HTML Template Publishing.

Simple concept.

Basic concept.

It's been used for out, since the Egyptian used cuneiform they used template publishing.

It's a basic concept.

Once you understand it you can spend a lot of money on pre-done systems that do exactly the same thing that you can do yourself.

And it's about taking something that you're going to use over and over, and making it generic enough that you can replace certain things inside of that template to end with a finished product.

Not everything about content is hand done.

We don't do one-offs for every kind of thing that we do.

There's a lot of templates that we use in life that we're used to.

And as long as they're attractive and functional and they serve the users by having a decent interface, we're very happy as consumers to use templates.

And you can automate them.

They're great for automation.

So here's a scenario of why is that important?

Welcome to the classroom of the future.

You notice everybody sitting there with their iPad, right?

And so there's our teacher.

She's from like 1800.

And she's wondering well, how do I get content?

I want to create this little thing and deliver it to their iPads.

How do I do that?

And the students are saying the same thing.

They're going hey, how do we take my little report and my photos and my little video and deliver that as content to the iPad?

Do I write an app and then submit that to the store?

Or, you know, like exactly how do you do this?

And this is where template publishing can really come into play.

Because you can take the raw content, the stories, the videos, the audio clips, all of that kind of stuff, and using Services you can convert them into Web-Apps which are just HTML bundles that you can automatically upload to a server like your MobileMe account.

And then thwat!

It shows right up on the iPad as a full screen interactive type of thing.

So we're going to look at one of those scenarios of how that's done.

Especially with the single view apps.

So the first template that we created for you was this one of just a single page.

I have a report.

I have a flowing text document.

I want to display that on the iPad.

Oh, and I want to add an image or maybe an audio clip, okay?

That's about it.

I just want it to be quick and dirty, but to have it look nice, be accessible to anybody with a Web browser or with an iPad.

So this is an example we're going to look at.

Then we're also going to look at if you want more interactivity.

What if you want something that has different screens and different views?

And you can navigate it and it acts just like a regular functional app.

Can something as complex as this be automated?

Yes, because this is just basically a template and you populate it with certain materials and media files.

And it becomes a functional app, so that you have this beautiful interface.

And it begins with three different technologies.

The first is HTML5.

You can think of HTML5 as like when you're building a building and you have a metal steel frame it hangs onto.

It provides the foundation that this app is going to hang onto.

It has video and audio support through the video/audio tags.

It has Web font integration, scalable vector graphics, and canvas support too so you can have that interactive canvas thing in HTML.

I stole these from Darren.

Darren, if you're out there don't be mad at me.

And of course it reuses WebKit, that set of APIs that provides all the interactive transitions like you saw.

The fades, the twistings, the, you know, special effects, the dissolves.

All that kind of stuff is done with WebKit.

So the first technology that we use that we're going to automate is this HTML5.

The second one is cascading style sheets.

Now we're used to the idea that style sheets control type, on how type looks.

But style sheets also control positional.

So they can control where things are located on the document as well.

And apply effects to the objects that are in there.

And the third technology is the wiring and it's JavaScript.

And it's for when you click a button, that sends the signal down the wire to a JavaScript controller that triggers the CSS transforms that make something happen on the computer.

So that's the basic structure of what goes on with these type of bundles.

All of those files live in a folder.

You've got your JavaScript.

You've got your CSS, your HTML.

All the media in there.

Everything lives in this folder, and it becomes this little interactive website called the Web-App.

But for the user all they're going to do is just select Images or something, and bring up an interface.

You're going to wire up this interface so that when they choose a setting that setting, each one replaces some placeholder in the template.

So you're going to replace the letter space placeholder with the value of that control.

And we're going to use Cocoa bindings and all that kind of stuff to do that.

And then those values control how the media is finally displayed with the thing itself.

So the steps to develop your own content creation tools, very simple.

One, you design and build your HTML template.

You basically steal anything that you like.

You go out there, you look at it and go oh, I like the way he does this or and you basically take your HTML kind of designs and you insert at key points placeholders.

Then second, you create an interface that's going to gather the media and gather the settings from the user.

Now if you're creating a service the media is automatically passed into your service so you don't have to do anything special for that.

Third, then you're going to add the code inside of your little control for replacing the placeholders and scaling the media or doing whatever processing you need to do to it.

So let's take a look at the contextual tools and this thing of HTML plumbing.

Is this semi-interesting?

Audience: Yes!

Sal Soghoian: Okay.

[ Applause ]

So here's a video clip on my desktop.

I just wanted to see if I could actually take 30 seconds and make the tool that John Gruber talked about, okay?

So I want to convert this from like this big down to something that I could actually put on an iPad, all right?

So to make the tool I'm going to open Automator, launch on O.

Botosan! And here's your blank Automator window.

I'm going to create a new service and the service is going to handle, hmm, movie files in the Finder.

And then I'm going to look for something that does encoding.

Encode Media.

I'm going to add that action into there.

Yes, this does it.

And then I'm going to have it Show When Run, save my service as Movie Bullet Encode Media.

Like that, Save and Quit.

Okay, so now when I need to encode a movie file in the Finder I can just go down here and go Encode Media and then say okay, make this for the iPad.

Go. And you can see up at the top here there's a little spinning gear.

That means that the workflow is processing it.

And in a couple of seconds you should, depending upon the size of this, you should see something over here.

So I made a tool.

[ Applause ]

You know, how many times do you.

Okay, better move this to the Movies folder or something, right?

So how many times have you just wanted a quick tool, quick and easy tool for compressing video?

Why do I have to open up an application to do that?

I've got all of Core Video at my disposal.

All you do is open up Automator, set it to have an input that's a movie file, encode, show me this when it runs so I can make my settings.

And then you're done.

Voila! So there's this simple example of what John was talking about, of tying into the ability of getting that.

Now let's look at creating an HTML template bundle.

So I'm going to launch a service here that takes me to various places in the operating system.

And I have a niece, Alice, and that's her.

God bless her.

She's gorgeous.

Look at her.

Look at those eyes.

And she really likes Alice in Wonderland.

That's her favorite book.

So I'm going to create a little small Web-App that I can put up on my MobileMe account that she can get to and read Alice in Wonderland.

So I have this image here, so I'm going to do a couple things to the image to make it a little bit more, you know, cooler.

I'm going to first of all apply a little color sync profile to it.

And so I'm using a service here to make a.

Let's generate a little bit lightness.

Lightness increase?

Yes, that's good.

Okay, and do it.

Okay, it did it.

And then I'm going to apply like a quartz filter effect to it.

Let's do something like oh, maybe a glow.

Get a clean edge on that and go.

Okay. That's good.

And well, as long as I'm doing that let me put a title on it.

So I'm going to select the text here of the file, Alice Goes to Tea, and I'm going to create a banner image with the selected text.

And bring up this Automator action that basically will let me do this.

I'm going to make it like 128.

Make it blue or lavender.

Lavender will do.

And let's set the font for like Hobo.

Okay, that looks pretty good.

Put it on your desktop, open it up.

Yes, very good.

So open that and Select All C, V Paste.

Move it over here.

Okay. Good.

Save, Quit.

Okay. So now I have an image.

I have some text here.

Hmm, this is Chapter 7, The Mad Tea Party scene.

That's good reading.

So I'm going to use that.

And in addition I also have an audio file.

Voiceover: This is a LibriVox recording.

All LibriVox recordings are in the public domain.

Sal Soghoian: Okay.

Voiceover: For more information or to volunteer.

I don't quite understand you, she said as politely as she could.

Sal Soghoian: Okay.

So this is a public domain of that chapter.

So it's an AIF file, so I need to compress it to something I can actually put up there because it's about 180 megs.

So I'm going to go Encode to iTunes Format.

Do a spoken podcast format.

And just go Continue and let that go to work.

So it's working on compressing that right now.

So I'm going to take the, that audio file.

I'm going to take the image, and I'm going to take this text and convert it into using Template Publishing into a single page Web-App.

So I'm going to select all the text here.

And then I'm going to hold down the Contextual key and go hey, create single page Web-App with selected text.

Brings up my interface.

The title is Alice in Wonderland.

I have an O impediment.

Subhead is Alice Has Tea With Some Strange Friends.

She'll like that.

Author of course is Lewis Carroll.

And instead of a copyright, I'm using a creative commons license that I put in here.

And I'm going to have, use the image file as in there.

And I'm also going to add the audio file right with it as well.

And let's see, that's it right there.

Okay. And give you the description, Chapter 7 From the Book.

And some keywords party, fun.

And I'll leave the type.

Let's see, I'll set the type for the subhead to be 24.

The author, I'll make that 18.

And the story I'm going to put in to Bradley Hand font and make that 24.

And the background let's use, hmm, oh, Icy Lavender.

All right.

Go. So it creates a bundle for me on the desktop, and then opens up my page.

So now I have.

Can you see that?

I have a scrolling document that's sized to the iPad.

And with a creative commons license built in so that, you know, you can go and tell people that they can use it as well.

And in addition, it also has that audio.

Voiceover: Let's say, that's the same thing you know.

Sal Soghoian: Okay.

So that's what I want.

Now let's take this and I want to make sure that she can use that.

So here's the bundle that was created by this.

And if we look inside the bundle we can see that it's a small Web-App.

It only has one Index page.

The Index page contains everything.

It contains your basic controls for the iPad up here.

It contains your built-in style sheet.

And then it contains all the other HTML, so it's not a lot but it's the principle.

And it contains my Media files.

And it also contains the manifest that tells your iPad what to cache, so that once she loads it on her iPad she can view it later offline as well.

So I can take this folder.

I'm going to rename it Alice.

And now I want to publish this folder.

So I'm going to select this and choose Copy to My MobileMe Site's Folder and Generate An Email.

Okay. And let's watch it work.

[ Silence ]

You never know with MobileMe.

Did it actually do it?

It should have dismounted that.

Okay, it didn't want to do it because I already have it done because I thought something like this might happen.

Okay. So I'm going to go up here and pull up that.

So this is what it'll look like on the iPad, only nice.

Not like that.

So you can scroll.

Yeah!

[ Applause ]

You know. And then you have all the way down and you get this whole thing.

And then there's the creative commons license right there.

And in addition you have the audio, so I can touch the audio.

Try it again.

There it goes.

Voiceover: This is a Libri [inaudible] then.

And said without opening its eyes, of course.

Sal Soghoian: So I pretty quickly delivered what I wanted to do.

I wanted to create a simple template app that I can publish easily to have my niece be able to read and listen to this story as well.

[Background Voiceover] So that's an example.

The principle there, the principles that are involved with doing that remain the same whether it's large or whether it's a small project.

You're creating a basic Web app where you have placeholders.

And the automation takes the content, manipulates it the way it wants to, puts it in the appropriate location.

Takes the interface, takes the information out of the interface.

Replaces the placeholders with the information from the interface.

Publishes it and you're done.

For a lot of stuff you're going to do, especially in education, this is more than enough.

This is a really good example of quick and easy automation techniques.

Now what if you want to do something that's a little bit more involved with more detail?

So let's go back here and go back into this.

So what if I wanted to provide her with something that was a little bit more than just a simple Web page?

The Web page is nice because it can be viewed on the computer as well as an iPad.

But what if I wanted to create some type of storage vehicle for information that she could take with her?

Well, an eBook is a great way to do that.

But how do you create an eBook?

Uh, I don't know and I don't want to know.

That's the whole thing, is I don't want to know.

I don't really want to know how to write the HTML but I'm forced to because of my job.

But I just like using these tools of select this, select that, go, build, all right, done.

So let's take a look at making an eBook.

Ooohhh! This is getting interesting.

Attendee: Switch your [inaudible] source.

Sal Soghoian: Oh, switch the source.

Okay, yes.

Nope, wrong source.

I'm already done here.

Ah! Okay, so here I have chapters from the book.

These are Open Source, you know, chapters from the thing.

I got it. Okay.

And I want to create and publish an eBook to this computer over here to my iPad doing this.

So I'm going to select these three.

Here we go.

Francois, holding on, babe.

Create and Sync Electronic Book.

Okay. Title will be Alice in Wonderland.

Save as Alice Book on the desktop.

I'm going to first of all add the cover image.

Well, let's search my library for Alices.

What do I got?

I want the cover image.

This one will be vertical, okay.

Then I want to add some more media.

You know, I'm going to use that movie.

Use that movie that I created.

Where is it?

RabbitHole.m4v.

There it is.

Okay, Add.

And then I'm going to just add every Alice image I have.

All the remaining Alice images, and let them find their spot.

Select All except for this one, and add all of those guys.

And if I lived right, we're going to do it.

So it creates the publication.

It's opening up iTunes.

It should be adding it to iTunes and then doing a sync.

And then na-na-na-na-na-na.

Nope. Boy, this is living large.

[ Silence ]

Whoa! You see that?

Attendee: Yeah, we do!

[ Applause ]

Sal Soghoian: This is what happens when you live on the bleeding edge.

Ah! All right.

Whoa, down the Rabbit Hole.

Cool. Have video.

Okay, let's go to my chapters.

Oh, Pool of Tears.

Every chapter begins with an image, so I'll go back to there and I can turn pages.

Whoop, whoop, whoop, whoop.

Okay, very good.

And it even has illustrations, so all the other images that I put in are at the end of the book.

That's illustrations.

So now I created something that Alice can take with her.

I created an eBook.

Automated using Services and my Mac.

This is how you automate content to get it to these devices.

Here's another scenario.

Let's take a look at another one.

Okay. Whew!

That worked.

That was good.

You never know with demos.

You know how it is.

All right.

So let's look at creating something that's more interactive.

That whole interactive kind of thing with the screens moving back and forth and all the little transitions.

I have some images selected here on my desktop.

I'm going.

Attendee: [Inaudible].

Sal Soghoian: Switch.

Thank you.

I have images selected on the desktop here.

Of course they're contextual, so when I go to the Contextual menu I get the things only dealing with images.

While I also have this thing called Create iPad Photo Web-App and it brings this up.

First image file, whatever you want.

Background audio, what do I have for audio?

Something called Bubbles.

Yeah, that'll do.

And now my cover I want without a story.

My photo carousel, add the caption data out of the images.

For my text, let's use something fun.

Party 72, make it yellow.

The byline, make it Bradley Hand 18.

Captions, let's make that Bradley Hand too, 14.

That's fine.

Title will be Tropical Fish.

Let's add some letter space into the title as well.

And make it part of my animal project, my animal kingdom project that I've been working on.

Photographer is Herman Melville.

See him when you get that.

Copyright 2010, iStockphoto.com.

And a description, Pretty Pictures of Fish.

Whoo! Go. Again, a bundle's made on my desktop.

And I get something looking like this.

So I have a little button for.

[ Bubble sounds ]

So I can navigate this, right?

You see the caption data that was extracted from the image?

If you click the image it goes full screen.

I mercifully didn't loop the background noise.

See? And back and forth like that, right?

And back to the Home screen.

Now I have a version of that over here on the iPad but I have to turn that.

[ Silence ]

Okay. Pat, I need the audio.

Play the audio so you can hear it.

[Bubble sounds] All right.

It works, right?

[Bubble sounds] Look.

All right.

So now I can go and I can scroll the text there, touch here.

A template.

A photo carousel template.

It's just a little HTML thing, and then you have full screen style sheet.

Back down again and then back to Home.

Then I have a video page I added to this one, Fish Swim.

Of course it's all built in so HTML5 handles the going up and down, right?

I can stop that and go back to my Home screen.

So there's an example of just selecting files.

I could have selected them in iPhoto.

I could have selected them in Aperture or the desktop.

And generating this bundle, this HTML bundle automatically using automation.

So get the idea?

You basically take some templates.

You write a little bit of code that generates these things.

And you can produce this kind of content quickly.

It's not going to change the world content, but it's the content that you can use over and over.

It's attractive, it's interesting, and it's a great vehicle for delivering ideas.

All right.

So that's some examples of doing basic content creation.

The third thing we were going to talk about is Interactive Web.

Now this I'm really standing out on the edge with this because I'm, this is actually going to be live over the network and, you know.

You know how those kind of things go, right?

All right.

All of you turn off everything you got.

I don't care what everyone.

All right.

So here's a scenario.

[ Audience chuckling ]

Here's a scenario.

So I have a friend, it's Joe.

Joe is a photographer.

Joe has a bunch of images.

He's working on an ad campaign for a client.

He needs to know what images he's going to use in the ad out of the prospective images that he has.

You know, he's in Cupertino.

He's working away at night.

His client, jet setter Francesca, is over in Paris about to get on board the airline to fly back to the States.

So the question is, is how does Joe communicate the options to Francesca and get her pick and understand that all within this deadline?

How do you do this?

Well, you use something called Publish for Approval, so he's going to do this technique.

What he's going to do is he's going to open up Aperture.

He's going to select the images that he wants to have his client approve and view.

Then he's going to run an AppleScript application called Publish for Approval.

What this application does is it exports the images, creates a mini website, hosts it in his person, on his computer in the Web server folder.

Turns on the built-in Apache of Mac OS X.

And then opens up the Web page for him to review.

If he likes that, then he just goes up there, goes Mail a Link to This Page.

Creates an e-mail, sends the e-mail message to the client.

Then he goes back to Aperture, creates a Smart Album looking for a keyword called Approved, a metadata tag called Approved with a value of True.

That's all he does.

So he sets it up, goes have, go gets a donut or coffee.

Or he's eating late so it's probably mung beans or something.

Who knows.

So Francesca meanwhile, who's in Paris, she gets the e-mail, taps the link.

It opens up to that Web page being served on his machine.

She picks the images that she wants to approve for use in the ad campaign.

Clicks the Submit button.

The moment she clicks that button, instantly it transfers back to his computer and switches the metadata tag so that he can see live what images are the ones that the client wants to work with.

He didn't have to call her.

He didn't have to e-mail her low-res versions of all the images.

He didn't have to try to gen a website.

He didn't have to do any of that.

He just ran a simple application that would do that.

So in this scenario, the automation not only builds the website, turns it on on his computer and hosts it.

But it also acts as a CGI intermediary, so that when the client responds it triggers something in Aperture.

All right.

So the first thing I'm going to do is to just make sure my Web sharing is turned on and this should be interesting.

The Apple turned it on, but I'm going to be a little proactive here with this.

Go Aperture.

[ Silence ]

Okay. I don't want to import from the iPad.

So I have Tropical Fish here.

This is my collection of tropical fish.

Very good.

And then I'm going to run this program called Publish for Approval.

I am going to give the collection ID a unique identifier that will be used in the URL.

And then title for the Web page will be Tropical Fish.

A banner image.

[ Silence ]

Pictures, banner.

There's the banner image.

And I want the export size to be like 1024 published for me.

So it's preparing the project folder, the Web folder.

It's exporting all the images in there.

Writing all the HTML that it needs to do.

[ Silence ]

Processing the Web pages.

This is what it looks like.

Hey, pretty good.

Very good.

Okay, File.

Mail link to this page.

Boy, this is living large.

Pablo Picasso, Tropical Fish.

Send it.

[ Whoosh ]

It worked.

All right.

Let's go over here.

And then I go to Mail.

[ Silence ]

Hey! Tap the link.

Okay. And I prepare over here so that I switch back to this.

There's nobody there.

Okay, I have an empty, just to show you, I have an empty thing over here, right?

There's my Smart Album.

Go back over here.

Okay. So then I just tap this, Approved.

Tap that, Approved.

Submit. And then I go back over here and voila!

[ Applause ]

Thank you.

So there's an example of how automation.

This is stuff that's built into Mac OS X.

The automation technologies that are part of Mac OS X can be used in a variety of ways to produce content, to become interactive to really make your life a lot more interesting.

So in summary, you can use automation to build stuff.

It makes it easier to create content.

Now you can use it just as yourself as a consumer.

Or you can write these tools yourself to have other people do them.

And it's all, everything you're seeing is coming soon.

But actually everything you just saw you can have today.

There's a new website.

It's called padilicious.com.

I put it up just for you guys.

P-A-D-I-L-I-C-I-O-U-S.com, Padilicious.

So Padilicious, you're going to go there and you're going to download the examples I showed you.

You can install them, tear them apart, do whatever you like.

You'll find the single web page thing there.

You'll find the Tropical Fish kind of building thing there.

And soon we'll be putting up the eBook.

The eBook's not quite ready for prime time yet.

Give us a week and we'll have that up.

To learn how to do this kind of stuff and how to create these, or to just go download dozens and dozens of pre-done services like the ones I used today, you can go to macosxautomation.com.

That contains three websites, AppleScript, Automator and Services.

Lots of tutorials, videos.

All the backup stuff that you need is on those two sites.

Don't talk to John.

Leave him alone.

Related sessions.

Now there's just so.

If you have automation at your back, all of a sudden all of these sessions become pretty interesting because you can use them to create your own templates that you're going to pre-populate and tear apart and build.

Apple, Inc. AAPL
1 Infinite Loop Cupertino CA 95014 US