Learn how to add screens for different platforms and sizes such as Android and iOS, as well as tablet sizes like iPads.
- [Narrator] When you're designing a website,…you need to be able to show how your website…will look across different screens…from mobile to tablet and desktop.…And that's what I wanna do now.…And the easiest way to do that in XD…is by using the artboard tool right over here.…So selecting artboard and holding down the space bar…will allow me to just pan that content over.…And then I can click and drag out a new artboard…and say okay, well there's, there's a new mobile device.…But I really don't know the size,…well it says it over here, well ya know what…I wanna make one for say for instance…an iPhone, an Android device and a tablet.…
So I'll delete that, because what we have…right over here are the various presets for various devices.…So I can select iPhone 6, right?…And scroll down I can select Android mobile just like that.…And I can select iPad.…So I can add these additional layouts or artboards…and then start to customize them.…So I'll just type in home, each one will be called home…but now I need to grab that content from this page, okay?…
This course shows everything you need to know to design your first website with Adobe's new prototyping app. Learn how to lay out a design, import graphics, and add headers and body copy. See how to create complex screen designs with repeating lists and grids that are as easy to change as they are to create. Then find out how to add new pages and use screen elements from the iOS, Android, and Windows UI kits that are built right into Adobe XD. Once the design is done, author Paul Trani shows how to add interactions and transitions to demonstrate how the website will "work" from one screen to the next. Plus, learn how to share a fully interactive prototype with other designers and clients, and export artboards and other assets to use in site development.
- Creating and importing graphics
- Adding text and effects
- Creating new pages
- Using Repeat Grid for easy prototyping of lists and recurring elements
- Adding interactions to elements
- Prototyping an entire website
- Sharing and exporting prototypes