How do I create a mobile app using Adobe XD?

[Jorge Landa]

Hi!!

Once I've developed an app in XD, how can I put it on AppStore and Google Play?

Thanks in advance.

[defaultyf8hv7nx0ugc]

Adobe Xd folks. I get it, but if you were really doing your jobs, then why do I have to use 3rd party plugins to make bridge the GAPS between design and engineering? Unless my comment is no longer current, you need to understand that these paid 3rd party apps are not only lost revenue for you, but they suck for UX. A design module that never thought through the "OK, design is good,...What Now?"

[HARSHIKA_VERMA]

Hi defaultyf8hv7nx0ugc,

We are sorry for the frustration. We will make sure to pass on your feedback with our product team.

We're sorry for the inconvenience.

Thanks,

Harshika

[vincentp37110434]

Yes when I first saw Xd I thought WOW, finally an easy way to make simple little apps, but nope, its pretty much pointless unless you want a prototype. no idea why they cant make it do this as one of there own products (flash / Animate) you can convert swf to apk.

they even recently stop developing Muse which was a simple Web builder which again you could use to convert to apk, dreamweaver is starting to fall behind to, they seem to gettting away from a make software easy company to just a design company, whitch is a really shame.

[ohillsklaus]

Yotako is a platform that could help make your design an app. Use the online version and not the plugin as it will cost money. You can use it for free, as long as all your code is public on Github.

[Peter Villevoye]

This question and many similar ones seems to remain on the top list of this forum and others like Quora. The question is legitimate, but the answers are never satisfying, because most designers think turning their creation into an app or website (or even just a foundation) is simply a matter of some conversion, like using Google Translate or a Save As command, slap an icon onto it, and call it a day. Or a favicon and call it a website...

As Colin Holgate correctly answered already 3 years ago: that's not the right approach.

There are so many tools, languages, and frameworks to build an app or a website with (HTML and CSS are just the plain flour and icing on the cake), and there are so many other aspects to keep in mind while truly building the actual app or website – that's just impossible for a designer to dig into. It's team work, and as a designer, you still need to team up with a contractor and construction workers to get the job done.

And since they probably all want or need to work with different tools, different technologies, different processes, different professionals, a tool like Adobe XD can't cater for them all. That's also one of the reasons why the Adobe Muse team just couldn't continue, because everybody was pushing and pulling them to implement and connect to all kinds of new creative and technical trends. The code coming from Muse was getting very unstable and bloated of all this bagage !

For three decades, designers have had the very rare privilege of being almost entirely serviced by just one brand in their whirling media industry: Adobe. And whatever you could design with their tools, it could immediately be produced and used (a PDF, a photo or a video). Though web and app media merely seem an extension to that, they are a totally different ball game, depending on a jungle of tools, technologies, and lots of team members to get together.

IMHO, we're still decades away, or even moving further away from having one tool from one brand, that just pops out any app or a website you want. Adobe XD is not that tool, and Adobe won't be that brand. Because in contrast to that graphic design industry (with e.g. PostScript and PDF), Adobe doesn't have control over the reigning nor roaring technologies. App and web development is an open market place, with many open source parties and private players. That won't change anymore, no matter how much Adobe, Microsoft, Apple, Google, Facebook, or any others would like to rule over it...

My 2 cents.

[Carlos0D4C]

I mean if it is possible to use this prototypes of any way in my site. I dont know, maybe through some code? Not only prototypes

[Rishabh_Tiwari]

Hi there,

Thanks for reaching out. Once you have created the prototype, you can hand over the design to a developer to code that and create a website or an app or you can use a third-party website to code that by yourself. Adobe XD is a prototype designing tool, that allows you to create an interactive prototype. To share the design with the developer you can refer to this article: https://helpx.adobe.com/xd/help/share-designs-prototypes.html

Let us know if this helps or if you need any further assistance.

Regards

Rishabh

[johnc48919458]

Carlos,

I also asked the same question months ago and the way i tackled this was by downloading a few plugins from React and a Web Export plugin. These plugins helped turn my prototype into code (Java, CSS, etc.). I'll be honest and i'd say it was a very confusing process for both me and my developer. My developer couldn't necessarily just take the code. The developer had to disect the code so that it can properly be leveraged for the final website.

Hope this helps!

[Carlos0D4C]

Thanks John, i´m gonna try to apply your advice 

[webs253946331fsl]

First of all Thank you for sharing your doubts, By following example you better understand the answers,

To build an app like Uber, Adobe XD can help you create a genuinely fantastic mobile experience. Here's what you need to know to get started.
Adobe XD is a robust design and prototyping tool that can help you create impressive mobile apps. It's easy to use and has many features to help you bring your app to life.
Here's what you need to know,
1. Choose your platform.
Adobe XD supports iOS and Android so you can design your app for either platform. You can always prepare for both if you're unsure which platform to target.
2. Pick your app's layout.
Adobe XD comes with various built-in layouts that you can use for your app. You can also create your custom layout if you want something specific.
3. Add your content.
Once you have your layout set up, you can start adding your content. Adobe XD makes it easy to add text, images, and other elements to your app.
4. Design your app's UI.
Adobe XD comes with a ton of outstanding UI elements that you can use to design your app's interface. You can also create your custom UI elements if you want something specific.
5. Preview and share your app.
Once you're happy with your app, you can preview it on your device or share it with others. Adobe XD makes it easy to share your app with others so they can see how it works.

[Brian28536460iw3a]

To create a mobile app using Adobe XD, follow these steps:

1. Plan your app: Define the purpose, target audience, and features of your mobile app. Consider the user experience and design elements you want to incorporate.

2. Create artboards: In Adobe XD, start by creating artboards for each screen or page of your app. These artboards represent the different screens and interactions within your app.

3. Design the app screens: Use the design tools in Adobe XD to create the visual layout, including buttons, text, images, and other UI elements. Pay attention to the overall aesthetics and ensure consistency across screens.

4. Add interactions and animations: Adobe XD allows you to create interactive prototypes. Define how users will navigate through your app and add interactions like taps, swipes, and gestures. You can also incorporate animations to enhance the user experience.

5. Preview and test: Use the preview feature in Adobe XD to see how your app prototype behaves. Test the interactions, flows, and overall usability of your app on different devices and screen sizes.

6. Share and collaborate: Share your Adobe XD project with stakeholders, clients, or developers to gather feedback and collaborate on improvements. Adobe XD provides options to share prototypes for review and comment.

7. Handoff to developers: Once the design is finalized, you can use the developer handoff feature in Adobe XD to generate specifications and assets for developers. This streamlines the process of translating your design into a functional mobile app.

8. Develop the app: Provide the design specifications and assets to your development team or use Adobe XD's integration with other tools to export the necessary files for development. The actual development process will depend on the platform and technologies chosen for app development.

Remember to stay updated with Adobe XD's features and capabilities as the software evolves, and explore tutorials and resources available online to enhance your app design skills using Adobe XD.

Good luck with creating your mobile app!