Learn how to mask a photo in Adobe XD using different shapes.
- View Offline
- [Voiceover] When you're dealing with images,…sometimes you actually want to put an image…inside of a shape.…So you essentially you want to mask it.…Well you can do that pretty easily.…I'm first going to import a photo in my Assets folder,…which is in the exercise file.…I'll just grab this Profile jpeg, importing it.…And whether you've dragged in a file,…or whatever the case may be,…wherever this jpeg is, if you have it selected,…and then you have another graphic on top of it,…say, for instance, this circle,…and really what I want to do is…I want to put that face inside of the circle.…
It's just a matter of selecting both of those objects,…just the Shift-Select, and then, right under Object,…you can hit Mask with Shape.…Just like that, we've masked it,…and not only is it masked, as we can see,…but we still have access to the those points,…those bezier points.…Even as I double-click, I can start to move this around…and make it a different shape.…It could be a logo, could be anything,…but I still have that shape serving as a mask,…
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