Note that we are going to use webpack to bundle JavaScript files for usage in XD and the yarn package manager to install dependencies.
If I say to add text, you can copy and add text over here, et cetera.Complete code for this plugin can be found on GitHub.
There's gonna be some things in here that are repetitive, that you can kinda fill in the blanks for. So we're gonna go in and we're gonna create as much of this as we can. As well as the responsive part of things. And if you look in here, you're gonna see we have an app. And if you have it, you can follow along. I'm gonna flip over to XD and we'll take a look at what we're gonna create today. So, in the words of my seven year old son. So we are talking with Adobe XD, first part of the process here to get to our widget, our thing that we're creating. So a developer can look at what you created, and get all the specs from it, or at least the specs they need, even copying things like text, so they can use it to build the app or build the widget, or whatever it is you're designing outside of Adobe XD. And this actually, on my screen I happened to have a picture here or screenshot of what it looks like. We can also export design specs, or share design specs with other people. Now by sharing we can actually export production ready assets. It's meant for us to be able to design, Prototype to test, work it out, figure things out and then share. We can then take what we create, and we can share it with people. We try it out and see what it looks like, how it works. Whatever you wanna call them and then we test it out. And we wanna be able to show people how, if you tap on a certain thing, where do they go? What's the flow? How does it work? What screen do they go to next? We can actually Prototype that by making connections and links between our screens or our artboards. Maybe if we're making an app, for instance. It could be just about anything you can think of. With Adobe XD, we can of course design, and like I said, this could be an app. Just so you have an idea of what we're doing here. So what can we do with Adobe XD? I guess I wanna lay the groundwork now. And we're also gonna talk about design specs, and just what we can do there. We're also gonna apply effects, and work with my favorite feature called a Repeat Grid. Work with Assets and CC Libraries to actually work a little bit smarter, which is pretty cool. We're gonna talk about vector and raster, and just the difference stuff that we can add from, even from Photoshop and Illustrator. We're gonna start out and talk about what XD's used for. Now we're gonna cover, it's a jumpstart, a lot of different things here. You're probably gonna benefit, honestly, from Adobe XD.
So, you know, print designers, UI, UX, web designer. Adobe XD can be used for all kinds of things.
Who's this class for? It's for just about anybody that needs to know how to make an app, web, wireframe design. Part about this, because you'll find that once you dive into Adobe XD, it's pretty crazy easy, okay. This is gonna kind of be a deep introduction, as far as we can get with this, and we're gonna create an app design as we learn XD that also incorporates just a few, I guess you can say the web design. So, we're actually gonna take a look at, like I said, an introduction to Adobe XD. We'll get to that, but I'm getting ahead of myself here. I mean with Adobe XD, we can do all kinds of things. It's actually really pretty cool what I get to do. And I do just, I do a lot of different stuff.
I actually wrote the Adobe XD CC 2018 Classroom in a Book. I am actually a developer, speaker, trainer, author. The person that's gonna kind of be talking to you for the next bit. I just wanted to give you an idea of who I am.