These are the versions that would go for Android.
 
 

Exporting your UI for App design using Illustrator CC | Bring Your Own Laptop

 

So let’s work out what sizes we need to make these first, and then we’ll go and build them in Illustrator. We need to work out what sizes to use, and that can be a little bit tough because that changes over time, there’s so many device sizes, but I’ve got some basics for you to use, that’s what most people use, and if you want to be more informed about what’s coming out, what devices are there, there’s a really cool site called mydevice.

It just gives you interesting stuff about what sizes– now, ignore these physical heights and widths, use these CSS widths. This is what we use as designers, this is pixels wide, and we can see that the new iPhone 7 is pixels wide, so that gives you a good gauge of, “Okay, maybe my mobile needs to be about that, or at least include it because it’s one of the more popular phones. It covers iPhone 6, and you can see, all the earlier ones as well, don’t get above I often just pick my mobile size to be to include all of those but you will be excluding a couple, the big giant phablet one; I think there’s some ones down here, Nexus 6, it’s slightly bigger, it’s a big phone.

It covers most of them. Blackberry Passports are massive. So that’s for mobile, you can see down here, for tablet’s, just underneath. You can start looking at these ones, I kind of ignore the iPad Pro because it’s as big as a desktop. If you’ve ever gone into an Apple store and seen the iPad Pro, they’re massive, so we don’t design for those for tablets, I leave those to use the desktop size, but I do cover this one, that’s the size I use for tablet, Now there’s no reason why you can’t specifically pick other sizes.

If you’re working with a developer or a web designer after this project, ask them. Say, “Hey, I’m designing this site, what sizes do you need? Desktop’s a bit of a different one. It’s about what you want to design for, and I’ll give you what I do, so let’s go and do ‘File’, ‘New’, and we’ll start with the desktop as our first design.

You can see, if we go to ‘Web’, we’ve got a lot of different sizes here, there’s ‘Web’, ‘Minimum’, ‘Large’, ‘Common’. You can pick any of these, it doesn’t really matter. What I like to start with is ” wide, mainly because it’s divisible by our grids that we’re going to learn about a little bit later on.

It’s still a common size. The height is going to change a lot when we’re working, so we’re going to leave it at whatever height it defaults to, and we’re going to change it afterwards because it depends on the content.

Orientation’s going to be ‘Landscape’. We’re not going to add any ‘Bleed’ or anything. We’re going to make sure it’s ‘RGB’. Let’s click ‘Create’. So this is page 1, I’m going to zoom out a little bit, holding ‘Command -‘, zooms out. Now I’m going to move around holding the ‘Spacebar’ key, clicking and dragging. We hold down the ‘Spacebar’ key and you keep on clicking and dragging, or you can use these little sliders around. So, I’ve got this first one, and they’re called Artboard instead of pages.

What I need to do now is create another Artboard for my tablet size, so what I’m going to do, there’s a couple of ways, the easiest way is up here, there’s one called the ‘Artboard Tool’, click on him, and that kind of allows me to change the size of this if I want to, but what I’m going to do is, I’m going to click this little option here which says ‘New Artboard’, and you can see my cursor becomes loaded with a duplicate of this guy.

I’m just going to click it anywhere. I’m going to say, “You live there. Now, how big should a tablet be? I’m going to deal with– we’re going to do the width and height, not the X and Y co-ordinates, we’re on the width and height. It’s very easy. Let’s say I want to export these two guys together, maybe separately, so I’m going to ungroup them. You go in, the Kiwi. Actually, we’ll just use the Kiwi at the moment. What they’re going to need is– Let’s get rid of all of these.

You’re probably developing for both, or maybe just for iOS, or just for Android, but let’s say we’re doing it for an Apple product, and we’re working with the Apple developer, and he needs iOS graphics, click on ‘iOS’, and what they do is, they need to scale it 1, 2, and 3, so this size, double size, and three times the size to work with all the different sizes that they have got in terms of their screens.

They’re very strict on the naming convention, so we’re going to leave the suffix in there, then we’re going to click ‘Export’. Here he is there. So we’ve got the three versions that they’re going to need, there’s the standard PNG, which is the ‘1’ size, then there’s– There’s a PNG here at ‘1’ scale, then, at times 2, ‘2x’, then, at times 3, ‘3x’.

And those are the kinds of files that they’re going to need, so every graphic that you make you’re going to need four versions. They’re probably going to use these three, but give them the SVG as well. And if you’re going to do the same stuff for Android, it’s very similar, get rid of these guys, click on ‘Android’, they just have a different naming convention, and they have lots of different sizes for their apps. You can see, there’s even a smaller, low dpi, medium dpi, high dpi, extra-large high, goes right up to xxx high dpi.

So there’s up to four scales; some of the LG phones have some huge, big retina screens.

 

Solved: How to resize the user interface of Ai? – Adobe Support Community – .

 

Your computer must meet the minimum technical specifications outlined below to run and use Photoshop. Applicable for. October release version The Photoshop hardware requirements for Processor and Graphics card and have increased for version Ensure your system still meets the minimum requirements listed below.

If you experience any issues, see Known issues in Photoshop. System requirements for earlier releases. Photoshop system requirements earlier releases. To find out if your computer supports Metal, see Mac computers that support Metal. Internet connection, Adobe ID, and acceptance of license agreement required to activate and use this product. This product may integrate with or allow access to certain Adobe or third-party hosted online services. Applications and Services may not be available in all countries or languages and may be subject to change or discontinuation without notice.

Additional fees or membership charges may apply. Your computer may need to meet additional system requirements to work efficiently with Adobe Camera Raw. See Adobe Camera Raw System requirements for details. Buy Adobe Photoshop or start a Free Trial. Legal Notices Online Privacy Policy. Buy now. User Guide Cancel. Make it. Minimum and recommended system requirements for Photoshop.

Language versions available for Photoshop. Windows and macOS. Photoshop is available in the following languages:. System requirements for Adobe Camera Raw. More like this System requirements Adobe Camera Raw System requirements Photoshop on mobile Photoshop system requirements Earlier releases Older versions of Photoshop System requirements and supported languages.

Sign in to your account. Sign in. Quick links View all your plans Manage your plans. Photoshop will not install on a volume that uses a case-sensitive file system.

 
 

What screen sizes to use for desktop, tablet & mobile web design – Free | Bring Your Own Laptop.

 
 
I am very new to all adobe software, and am currently trying to resize the interface of Ai CS6 as it is currently very small (see below image – I have a 13″. Illustrator is The Industry-standard For Vector Authoring and Editing. Start a Free Trial. In this Adobe Illustrator CC UI & Web Course tutorial I’ll show you how to export your UI website design components for App usage.