Start learning with our library of video tutorials taught by experts. Get started
Viewers: in countries Watching now:
In Illustrator CS5 Web and Interactive Design, Mordy Golding shows how to create pixel-perfect graphics for use in web sites, video compositions, and mobile apps. This course covers a wide range of workflows, from creating online ad campaigns, web sites, icons, to taking art from Illustrator to Flash Professional. Sharing tips, tricks, and creative techniques along the way, Mordy provides insight and instruction for taking projects from initial concept straight through to production. Exercise files accompany the course.
So you already know that you can use Illustrator to design icons for iOS devices, but of course, there are many mobile devices that are out there in the world, and there are many different types of graphics that you might need to create for those devices. Well, Adobe has made a little bit easier to kind of understand what the requirements are for creating those graphics by using an application called Adobe Device Central. So let's see how we can take a look at taking advantage of Adobe Device Central to help us create the graphics that we need right here inside of Illustrator.
I'm going to start here inside of Illustrator and I want to create a document using the Mobile and Devices Document profile. Notice by the way that when you click on this button, it's not going to create an Illustrator file just yet. Rather, it's going to launch Device Central. Once we're inside of Device Central, we can let Illustrator know what device we want to design for, and it will fill in the blanks for us. So you notice that right now inside of Device Central, I'm in what we call the Create workspace. Notice I have the ability to create documents in the many different Adobe applications, for example, Captivate, Fireworks, Flash, Illustrator, Photoshop, and of course After Effects, but since we are using Illustrator here, I'm going to leave it set to Illustrator.
And I can also choose what type of content that is that I want to create. For example, maybe I want to create let's say a Wallpaper design, something just that takes up the whole background of the screen on a mobile device. Now, on the left side over here we have the different devices that I've already loaded into Device Central. These right now are the generic Flash Lite profiles or Flash Player profiles that Device Central comes with, but I can start to tell Device Central which devices I care about. I would do that by clicking on the Browse button.
One of the greatest things about this new version of Device Central now in CS5 is that Adobe has taken the ability to create these device profiles and made it public. So what we're seeing right now is actually something that's being loaded in the Internet live that shows me all these device profiles that have been created. But of course, not only can Adobe create these profiles; anybody can create these profiles. So we see things, for example, like the Apple iPad and we see things for the iPhone. But we want to have something very specific right now.
We only want to work with device profiles that maybe have been approved or certified by Adobe. So I come here on the lower left-hand corner of the screen, I'll see that there are certain filters here. If I click on Adobe Certified, I'll only get search results right now of device profiles that have been created by Adobe themselves. I have the ability to go to other things also, for example, only show me devices that will support to playback the video, or only that are available in certain marketplaces, for example, maybe devices that can deliver graphics through the iTunes store or through the Blackberry market, so on and so forth.
So there are many different ways that I can filter these devices. I can even go-ahead over here and search by certain makers. For example, I can search by Sony Ericsson and only find certain devices by Motorola, for example. But maybe for this example right here, I want to create a Wallpaper for BlackBerry Storm 2 device. Well, I see that listed right here. I can click on this and if I double- click on it, I'll actually see information about the BlackBerry Storm, what type of browser runs inside of it, what kind of processor it has, what it's capable of displaying, what type of graphics formats, so on and so forth.
But first I'm actually going to take the BlackBerry Storm profile and I want to add it to my local computer, meaning I want to kind of download it and use this. I'm going to take it right now and just drag it into this area called Test Devices. This now adds the profile to my list right here. Now as I was telling you before I can double-click on this profile and I can view things like general settings, what bitmaps it supports, what video capabilities it has, what kind of web browsing it has, and also other things that are basically from the community, meaning reading, so on and so forth.
I'm going to go back here to Generals, so I can just see this information here or perhaps more importantly go to where it says Bitnap and see that it supports GIF, JPG and PNG, which are the formats that I know that I can easily export out of Illustrator. So I'm going to go back to the Create workspace, and since I've loaded the BlackBerry Storm here and I click on it to select it, you can see that Device Central is getting all the settings ready for Illustrator to use to create a new document. Now, all I need to do is go to the Create button and I'll go back to Illustrator now with an artboard that's set up to the right dimensions for the BlackBerry Storm 2, and I know, because I looked at it before, that it can export my graphics using GIF, JPG or PNG, and I'm ready to go.
Find answers to the most frequently asked questions about Illustrator CS5 for Web and Interactive Design.
Here are the FAQs that matched your search "":
Sorry, there are no matches for your search ""—to search again, type in another word or phrase and click search.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.