{"id":3765,"date":"2020-02-11T04:59:00","date_gmt":"2020-02-11T04:59:00","guid":{"rendered":"https:\/\/azoora.com\/blog\/?p=3765"},"modified":"2020-02-18T11:40:55","modified_gmt":"2020-02-18T11:40:55","slug":"10-tutorials-to-help-you-master-adobe-xd","status":"publish","type":"post","link":"https:\/\/azoora.com\/blog\/tutorial\/10-tutorials-to-help-you-master-adobe-xd\/","title":{"rendered":"10 Tutorials to Help You Master Adobe XD"},"content":{"rendered":"\n<p><strong>Adobe XD<\/strong> is a popular choice for mobile and web projects. It\u2019s the latest addition to Adobe\u2019s product family and while it hasn\u2019t gained the same popularity as <strong>Sketch<\/strong>, it\u2019s still a great tool for wireframing, prototyping, and UI\/UX design.<\/p>\n\n\n\n<p>In this post, we\u2019ve gathered the best <strong>Adobe XD tutorials<\/strong> that will help you learn the ins and outs of this program.<\/p>\n\n\n\n<h2><a target=\"_blank\" href=\"https:\/\/helpx.adobe.com\/xd\/how-to\/make-prototype.html?playlist=\/ccx\/v1\/collection\/product\/xd\/topics\/quick-starts\/collection.ccx.js&amp;ref=helpx.adobe.com\" rel=\"noreferrer noopener\">Quick Start for Adobe XD<\/a><\/h2>\n\n\n\n<p>In this 14-minute long video, you will learn how to quickly go from idea to prototype in four easy steps. Taught by Adobe themselves, this tutorial includes easy to follow instructions as well as project files so you can follow along.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img data-attachment-id=\"3767\" data-permalink=\"https:\/\/azoora.com\/blog\/tutorial\/10-tutorials-to-help-you-master-adobe-xd\/attachment\/adobe-xd-tutorial-01\/#main\" data-orig-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-01.jpg\" data-orig-size=\"850,450\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"adobe-xd-tutorial-01\" data-image-description=\"\" data-medium-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-01-300x159.jpg\" data-large-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-01.jpg\" loading=\"lazy\" width=\"850\" height=\"450\" src=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-01.jpg\" alt=\"\" class=\"wp-image-3767\" srcset=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-01.jpg 850w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-01-300x159.jpg 300w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-01-768x407.jpg 768w\" sizes=\"(max-width: 850px) 100vw, 850px\" \/><\/figure>\n\n\n\n<h2><a target=\"_blank\" href=\"https:\/\/www.mockplus.com\/blog\/post\/adobe-xd-tutorial\" rel=\"noreferrer noopener\">Ultimate Guide to Adobe XD<\/a><\/h2>\n\n\n\n<p>This in-depth tutorial gives you a complete overview of the Adobe XD interface and then walks you through a complete project build. It also includes links to more tutorials about Adobe XD.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img data-attachment-id=\"3768\" data-permalink=\"https:\/\/azoora.com\/blog\/tutorial\/10-tutorials-to-help-you-master-adobe-xd\/attachment\/adobe-xd-tutorial-02\/#main\" data-orig-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-02.jpg\" data-orig-size=\"850,450\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"adobe-xd-tutorial-02\" data-image-description=\"\" data-medium-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-02-300x159.jpg\" data-large-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-02.jpg\" loading=\"lazy\" width=\"850\" height=\"450\" src=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-02.jpg\" alt=\"\" class=\"wp-image-3768\" srcset=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-02.jpg 850w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-02-300x159.jpg 300w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-02-768x407.jpg 768w\" sizes=\"(max-width: 850px) 100vw, 850px\" \/><\/figure>\n\n\n\n<h2><a target=\"_blank\" href=\"http:\/\/www.foreverdansky.com\/blog\/adobe-xd-tutorial-color-character-styles\" rel=\"noreferrer noopener\">Color and Character Styles<\/a><\/h2>\n\n\n\n<p>This tutorial by Dansky gives you a detailed overview of the color and character styles in Adobe XD. You\u2019ll learn how to create custom color and character styles as well as how to manipulate pre-existing ones.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img data-attachment-id=\"3769\" data-permalink=\"https:\/\/azoora.com\/blog\/tutorial\/10-tutorials-to-help-you-master-adobe-xd\/attachment\/adobe-xd-tutorial-03\/#main\" data-orig-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-03.jpg\" data-orig-size=\"850,450\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"adobe-xd-tutorial-03\" data-image-description=\"\" data-medium-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-03-300x159.jpg\" data-large-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-03.jpg\" loading=\"lazy\" width=\"850\" height=\"450\" src=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-03.jpg\" alt=\"\" class=\"wp-image-3769\" srcset=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-03.jpg 850w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-03-300x159.jpg 300w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-03-768x407.jpg 768w\" sizes=\"(max-width: 850px) 100vw, 850px\" \/><\/figure>\n\n\n\n<h2><a target=\"_blank\" href=\"http:\/\/www.foreverdansky.com\/blog\/adobe-xd-tutorial-app-design-prototype\" rel=\"noreferrer noopener\">App Design &amp; Prototype<\/a><\/h2>\n\n\n\n<p>Learn how to create a fictional banking app in this tutorial by Dansky. You\u2019ll go through the entire process of creating a banking app, complete with a login screen, transaction overview, and transfer screen.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img data-attachment-id=\"3770\" data-permalink=\"https:\/\/azoora.com\/blog\/tutorial\/10-tutorials-to-help-you-master-adobe-xd\/attachment\/adobe-xd-tutorial-04\/#main\" data-orig-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-04.jpg\" data-orig-size=\"850,450\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"adobe-xd-tutorial-04\" data-image-description=\"\" data-medium-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-04-300x159.jpg\" data-large-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-04.jpg\" loading=\"lazy\" width=\"850\" height=\"450\" src=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-04.jpg\" alt=\"\" class=\"wp-image-3770\" srcset=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-04.jpg 850w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-04-300x159.jpg 300w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-04-768x407.jpg 768w\" sizes=\"(max-width: 850px) 100vw, 850px\" \/><\/figure>\n\n\n\n<h2><a target=\"_blank\" href=\"https:\/\/www.youtube.com\/watch?v=4XkRiLn3oKA\" rel=\"noreferrer noopener\">Responsive Layout Grids<\/a><\/h2>\n\n\n\n<p>This video tutorial walks you through the process of creating responsive layout grids which can be used in a variety of design projects. You will learn how to customize the number of columns, the gutter width, and adjust other settings for your layout grid.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img data-attachment-id=\"3771\" data-permalink=\"https:\/\/azoora.com\/blog\/tutorial\/10-tutorials-to-help-you-master-adobe-xd\/attachment\/adobe-xd-tutorial-05\/#main\" data-orig-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-05.jpg\" data-orig-size=\"850,450\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"adobe-xd-tutorial-05\" data-image-description=\"\" data-medium-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-05-300x159.jpg\" data-large-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-05.jpg\" loading=\"lazy\" width=\"850\" height=\"450\" src=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-05.jpg\" alt=\"\" class=\"wp-image-3771\" srcset=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-05.jpg 850w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-05-300x159.jpg 300w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-05-768x407.jpg 768w\" sizes=\"(max-width: 850px) 100vw, 850px\" \/><\/figure>\n\n\n\n<h2><a target=\"_blank\" href=\"https:\/\/www.youtube.com\/watch?v=pMr29NGe8_8\" rel=\"noreferrer noopener\">Adobe XD for Web Design<\/a><\/h2>\n\n\n\n<p>If you want to know how to use Adobe XD in web design projects, this tutorial is a must-watch. The video is 30 minutes long and takes you through designing a complete personal portfolio website.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img data-attachment-id=\"3772\" data-permalink=\"https:\/\/azoora.com\/blog\/tutorial\/10-tutorials-to-help-you-master-adobe-xd\/attachment\/adobe-xd-tutorial-06\/#main\" data-orig-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-06.jpg\" data-orig-size=\"850,450\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"adobe-xd-tutorial-06\" data-image-description=\"\" data-medium-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-06-300x159.jpg\" data-large-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-06.jpg\" loading=\"lazy\" width=\"850\" height=\"450\" src=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-06.jpg\" alt=\"\" class=\"wp-image-3772\" srcset=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-06.jpg 850w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-06-300x159.jpg 300w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-06-768x407.jpg 768w\" sizes=\"(max-width: 850px) 100vw, 850px\" \/><\/figure>\n\n\n\n<h2><a target=\"_blank\" href=\"https:\/\/www.youtube.com\/watch?v=0KgUo7lMo_g\" rel=\"noreferrer noopener\">Create a Social Media App<\/a><\/h2>\n\n\n\n<p>Use this tutorial if you want to learn how to use Adobe XD to create a fictional social media app. Although the design of the social media app is nothing out of this world, this simple project is a great way to familiarize yourself with everything Adobe XD has to offer.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img data-attachment-id=\"3773\" data-permalink=\"https:\/\/azoora.com\/blog\/tutorial\/10-tutorials-to-help-you-master-adobe-xd\/attachment\/adobe-xd-tutorial-07\/#main\" data-orig-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-07.jpg\" data-orig-size=\"850,450\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"adobe-xd-tutorial-07\" data-image-description=\"\" data-medium-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-07-300x159.jpg\" data-large-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-07.jpg\" loading=\"lazy\" width=\"850\" height=\"450\" src=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-07.jpg\" alt=\"\" class=\"wp-image-3773\" srcset=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-07.jpg 850w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-07-300x159.jpg 300w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-07-768x407.jpg 768w\" sizes=\"(max-width: 850px) 100vw, 850px\" \/><\/figure>\n\n\n\n<h2><a target=\"_blank\" href=\"https:\/\/www.youtube.com\/watch?v=My7U8BMZuT0\" rel=\"noreferrer noopener\">Account Creation &amp; Verification UI Tutorial<\/a><\/h2>\n\n\n\n<p>Almost every website nowadays is asking you to create an account. With this tutorial, you\u2019ll learn how to create an attractive account creation page as well as account verification page.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img data-attachment-id=\"3774\" data-permalink=\"https:\/\/azoora.com\/blog\/tutorial\/10-tutorials-to-help-you-master-adobe-xd\/attachment\/adobe-xd-tutorial-08\/#main\" data-orig-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-08.jpg\" data-orig-size=\"850,450\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"adobe-xd-tutorial-08\" data-image-description=\"\" data-medium-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-08-300x159.jpg\" data-large-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-08.jpg\" loading=\"lazy\" width=\"850\" height=\"450\" src=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-08.jpg\" alt=\"\" class=\"wp-image-3774\" srcset=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-08.jpg 850w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-08-300x159.jpg 300w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-08-768x407.jpg 768w\" sizes=\"(max-width: 850px) 100vw, 850px\" \/><\/figure>\n\n\n\n<h2><a target=\"_blank\" href=\"https:\/\/www.youtube.com\/watch?v=xopPpRtPh8k\" rel=\"noreferrer noopener\">User Onboarding Experience in Adobe XD<\/a><\/h2>\n\n\n\n<p>No matter how great your app, program or website is, if you don\u2019t provide your users with a great onboarding experience, they will be less likely to use it. With this tutorial, you\u2019ll learn how to create a smooth user onboarding experience for a mobile app.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img data-attachment-id=\"3775\" data-permalink=\"https:\/\/azoora.com\/blog\/tutorial\/10-tutorials-to-help-you-master-adobe-xd\/attachment\/adobe-xd-tutorial-09\/#main\" data-orig-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-09.jpg\" data-orig-size=\"850,450\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"adobe-xd-tutorial-09\" data-image-description=\"\" data-medium-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-09-300x159.jpg\" data-large-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-09.jpg\" loading=\"lazy\" width=\"850\" height=\"450\" src=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-09.jpg\" alt=\"\" class=\"wp-image-3775\" srcset=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-09.jpg 850w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-09-300x159.jpg 300w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-09-768x407.jpg 768w\" sizes=\"(max-width: 850px) 100vw, 850px\" \/><\/figure>\n\n\n\n<h2><a target=\"_blank\" href=\"https:\/\/www.youtube.com\/watch?v=IoDvnio-628\" rel=\"noreferrer noopener\">Creating a Working Sidebar Menu<\/a><\/h2>\n\n\n\n<p>With mobile usage on the rise, designing working menus that won\u2019t confuse mobile users is more important than ever. In this tutorial, you\u2019ll go through the steps necessary to create a menu that slides in from the side.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img data-attachment-id=\"3776\" data-permalink=\"https:\/\/azoora.com\/blog\/tutorial\/10-tutorials-to-help-you-master-adobe-xd\/attachment\/adobe-xd-tutorial-10\/#main\" data-orig-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-10.jpg\" data-orig-size=\"850,450\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"adobe-xd-tutorial-10\" data-image-description=\"\" data-medium-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-10-300x159.jpg\" data-large-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-10.jpg\" loading=\"lazy\" width=\"850\" height=\"450\" src=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-10.jpg\" alt=\"\" class=\"wp-image-3776\" srcset=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-10.jpg 850w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-10-300x159.jpg 300w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-10-768x407.jpg 768w\" sizes=\"(max-width: 850px) 100vw, 850px\" \/><\/figure>\n\n\n\n<h2><a target=\"_blank\" href=\"https:\/\/www.youtube.com\/watch?v=XiXk9um4or8\" rel=\"noreferrer noopener\">Adobe XD Scroll and Blur<\/a><\/h2>\n\n\n\n<p>This video covers some of the new updates and features added to Adobe XD. More specifically, you\u2019ll learn how to merge artboards and create a realistic interface experience using the scroll and blur feature.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img data-attachment-id=\"3777\" data-permalink=\"https:\/\/azoora.com\/blog\/tutorial\/10-tutorials-to-help-you-master-adobe-xd\/attachment\/adobe-xd-tutorial-11\/#main\" data-orig-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-11.jpg\" data-orig-size=\"850,450\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"adobe-xd-tutorial-11\" data-image-description=\"\" data-medium-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-11-300x159.jpg\" data-large-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-11.jpg\" loading=\"lazy\" width=\"850\" height=\"450\" src=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-11.jpg\" alt=\"\" class=\"wp-image-3777\" srcset=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-11.jpg 850w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-11-300x159.jpg 300w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-11-768x407.jpg 768w\" sizes=\"(max-width: 850px) 100vw, 850px\" \/><\/figure>\n\n\n\n<h2><a target=\"_blank\" href=\"http:\/\/www.foreverdansky.com\/blog\/adobe-xd-tutorial-chat-ui-design\" rel=\"noreferrer noopener\">Chat UI Design<\/a><\/h2>\n\n\n\n<p>Chatbots and live chat boxes are growing in popularity and used more and more on various websites. Learn how to design a clean and attractive Chat UI design in this hour-long video that covers everything from designing the app screen to the actual chat interface.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img data-attachment-id=\"3778\" data-permalink=\"https:\/\/azoora.com\/blog\/tutorial\/10-tutorials-to-help-you-master-adobe-xd\/attachment\/adobe-xd-tutorial-12\/#main\" data-orig-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-12.jpg\" data-orig-size=\"850,450\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"adobe-xd-tutorial-12\" data-image-description=\"\" data-medium-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-12-300x159.jpg\" data-large-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-12.jpg\" loading=\"lazy\" width=\"850\" height=\"450\" src=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-12.jpg\" alt=\"\" class=\"wp-image-3778\" srcset=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-12.jpg 850w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-12-300x159.jpg 300w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-12-768x407.jpg 768w\" sizes=\"(max-width: 850px) 100vw, 850px\" \/><\/figure>\n\n\n\n<h2><a target=\"_blank\" href=\"https:\/\/www.youtube.com\/watch?v=ZkrXzxLiSn4\" rel=\"noreferrer noopener\">Ecommerce Product Detail Design<\/a><\/h2>\n\n\n\n<p>Stretch your creative muscles by designing a prototype for an e-commerce product. This video tutorial is just under 20 minutes long and covers creating the project page and a scrollable interface, along with helpful tips on creating your own project workflow.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img data-attachment-id=\"3779\" data-permalink=\"https:\/\/azoora.com\/blog\/tutorial\/10-tutorials-to-help-you-master-adobe-xd\/attachment\/adobe-xd-tutorial-13\/#main\" data-orig-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-13.jpg\" data-orig-size=\"850,450\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"adobe-xd-tutorial-13\" data-image-description=\"\" data-medium-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-13-300x159.jpg\" data-large-file=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-13.jpg\" loading=\"lazy\" width=\"850\" height=\"450\" src=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-13.jpg\" alt=\"\" class=\"wp-image-3779\" srcset=\"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-13.jpg 850w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-13-300x159.jpg 300w, https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial-13-768x407.jpg 768w\" sizes=\"(max-width: 850px) 100vw, 850px\" \/><\/figure>\n\n\n\n<h2>Conclusion<\/h2>\n\n\n\n<p><strong>Adobe XD<\/strong> is an easy to use program that can help you prototype mobile apps, websites, user interfaces and even user onboarding experience. With these tutorials, you\u2019ll be able to learn how to use Adobe XD effectively and speed up your prototyping process.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Adobe XD is a popular choice for mobile and web projects. It\u2019s the latest addition to Adobe\u2019s product family and while it hasn\u2019t gained the same popularity as Sketch, it\u2019s still a great tool for wireframing, prototyping, and UI\/UX design. In this post, we\u2019ve gathered the best Adobe XD tutorials that will help you learn [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":3766,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"spay_email":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false},"categories":[85,62],"tags":[114,86,110,50,111],"jetpack_featured_media_url":"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/02\/adobe-xd-tutorial.jpg","jetpack_publicize_connections":[],"jetpack_shortlink":"https:\/\/wp.me\/p7FQPL-YJ","jetpack-related-posts":[],"jetpack_sharing_enabled":true,"jetpack_likes_enabled":true,"_links":{"self":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts\/3765"}],"collection":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/comments?post=3765"}],"version-history":[{"count":1,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts\/3765\/revisions"}],"predecessor-version":[{"id":3780,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts\/3765\/revisions\/3780"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/media\/3766"}],"wp:attachment":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/media?parent=3765"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/categories?post=3765"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/tags?post=3765"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}