Learn how to lay out a screen design with graphics and text and import vector and raster images. See how easy it is to create complex screen designs, complete with repeated lists and grids that are as simple to change as they are to create. This goes for any mobile screen type: iOS or Android, tablet or smartphone. Once the design is done, author Paul Trani shows how to add interactions and transitions to see how the app will "work" from one screen to the next. The end result is a full-featured prototype that can be shared with designers, developers, and clients, and broken down and exported as assets for use in development.
- Creating your first Adobe XD project
- Working with graphics and text in Adobe XD
- Importing assets
- Building additional screens for different display sizes and platforms
- Creating UI elements
- Using Repeat Grid for easy prototyping of lists and recurring elements
- Adding interactions to elements
- Creating transitions between screens
- Publishing and sharing a prototype
- Exporting artboards and assets
Skill Level Beginner
- [Voiceover] Hello, and welcome to Design a Mobile App with Experience Design Preview, otherwise known as Adobe XD. My name is Paul Trani, and I'm excited to show you how to design a mobile app by creating directly in Adobe XD, importing assets, laying out screens, using the built-in UI kits, which are really helpful in building out a mobile app for IOS, could be for Android, really any mobile device and even tablets. You'll learn how to do all of that. I'll also show you how to link together the different screens, complete with interactions, transitions to give an idea of how the app will work, and then I'll show you how you can share it either as a video or, more than likely, as an easily shareable link.
Finally, you can even export out that content, either the entire artboards or screens, or the individual assets for use elsewhere. I'm excited. I hope you are too, so let's get started.