In our last article, we shared the latest enhancements available on Adobe XD CC 2019 from a design point of view, but as you probably already know, XD isn’t limited to design, it’s also about prototyping, and that’s what we’ll be looking at today.
Prototype building is regarded somewhat of a superpower nowadays. Being able to build a compelling, convincing prototype quickly will make you a much more persuasive and effective designer. This is why Adobe has been working to make prototyping in XD richer and even more capable.
Enhancements include prototyping any form of comment interaction and gesture, being able to drag and swipe, fixing various elements on your artboard while the background scrolls, and placing artboards on top of each other as overlays. But the one feature that Adobe believes will go a long way in unlocking creativity of its users when it comes to prototyping is Auto-Animate.
With this brand-new approach to animation, there’s no need to master a complicated timeline interface. As a matter of fact, you don’t even need to be able to write a single line of code. Once in XD, select Prototype (found next to the “Home” icon).
Starting with two artboards, drag a wire from the one artboard to the other and back again, and select Auto-Animate from the action menu. (This can be done across multiple artboards.) To preview, click the play icon at the top right of the screen, and watch how your images transition into each other on your screen. Whether it’s on your desktop, mobile phone or tablet, this feature will add life to your UI. A simple app to use, but a powerful one.
Another amazing feature that works hand-in-hand with Auto-Animate is Voice.
Nowadays, designers need to work on so many different platforms, with immersive media like Voice, which has proven to be rather challenging. It’s only a matter of time before Voice becomes a part of every app experience, making it essential for designers to be able to create and design with using Voice. Unfortunately, there haven’t been tools for this… until now. That’s right. Designing, prototyping and sharing can all be done using Voice as a medium.
Just as you do with auto-animate, simply drag a wire from one artboard to another. On the first artboard, select Voice as the Trigger from the action menu and add your words under Command. Then select Speech Playback from the action menu on the second artboard and type in the response you’d like your app to give in the Speech block. This can be previewed on your mobile device.
This is great for artificial intelligence applications, home automation systems and other apps that require Voice automation and will take designing to the next level.
All the artboards for your product can be saved in one place alongside each other, regardless of the devices they’re for, with the ability to fluidly switch between design and prototype without having to leave the app. If you haven’t done so yet, you should really try Adobe XD.
So, what new Adobe Creative Cloud CC 2019 features will we be sharing with you next time? There’s only one way to find out… join us next time.
It’s February, the hottest month of the year in South Africa and Adobe has a Summer Sizzling Deal to match. At the beginning of March 2019 Adobe creative Cloud for Teams will cost $79.99, but for the rest of this month you can take advantage of Adobe’s HOT Commercial/Government Deal where they have slashed 38% off that price. Grab this deal while it is still summer and you will only pay $49.99.
See the details regarding this deal below:
- This offer is available for new customers who purchase 3 or more seats of Adobe Creative Cloud for teams – All Applications @ $49.99 user/per month, regularly priced at $79.99 user/per month and Creative Cloud for teams – Single Applications @ $19.99 user/per month, regularly priced at $33.99/user per month, through Adobe’s Partner Network and Adobe Direct.
- This offer starts on 11th February 2019 and expires on 1st March 2019.
- This promotion is available to new Adobe customers who do not have an existing Creative Cloud for Team subscription. Offer does not apply to new seats added to existing VIP contracts, new VIP contracts for existing VIP customers or renewals.
- For transactions under this promotion which do not fulfill the eligibility criteria Adobe reserves the right to terminate the respective licenses.
- 12-month membership required for new customers enrolling a new VIP agreement.
- Offer not available to Education customers.
- For 3-year contract term option offer applies only to 1st year (initial purchase). Regular pricing (RRP) will apply for 2nd and 3rd year renewals
* Offer expires on 1st March 2019. Offer available to Commercial and Government customers only. Valid only for eligible persons who are 18+. Residents or persons in embargoed countries or countries subject to U.S. or local export restrictions are not eligible. Since Adobe’s products and services are distributed through Adobe resellers, or other channel partners or entities (“Partners”), Adobe cannot and does not guarantee that any end user will receive any particular discount. Actual license fees for each end user are determined by the Partners. [Since Learning Curve is an Adobe Platinum Reseller, we guarantee this discount.] Prices quoted are Recommended Retail Prices (RRP) only. Offer and prices subject to change without notice due to unforeseen circumstances. Offer may not be assigned, exchanged, sold, transferred, combined, or redeemed for cash or other goods and services not expressly stated here as included. Subject to availability where the recipient resides. Additional terms and conditions may apply. VOID WHERE PROHIBITED OR RESTRICTED BY LAW.
If you are ready to order or would like some more information, call us on 021 790 4170 or drop us a mail here: firstname.lastname@example.org
What’s not to love about Adobe XD? This powerful tool helps us to design, prototype and share. The good news is, it just got better.
NEW FEATURES & UPDATES AVAILABLE ON ADOBE XD CC 2018
Seamless Import of Photoshop Files:
XD can open Photoshop files seamlessly, so you can design screens within Photoshop, using your favourite filters and rich textures it provides, and open it within XD.
Simply click File > Open and find the PSD you need. When you click to open the PSD, a new XD doc, containing your artboards will open. They’ll be native, with smooth vectors and editable text. From here, you can merge your artboards with your main document and continue designing them if you want. As you click on them, you’ll notice that layers and layer names you’ve created in Photoshop were transferred too.
The Layers Panel is rather minimalistic compared to other apps, because XD’s interface is context aware, showing you only what you need to see when you need to see it. The settings of Property Inspector on the right will change based on your selection.
There’s also a great Assets Panel where you can store your colour swatches, symbols (which is great for keeping everything consistent) and character styles. Where before, symbols only remained linked in a single document, they now remain linked between different documents in the latest version, which goes a long way when it comes to control and consistency.
XD also works seamlessly with Illustrator.
Do you need to reconfigure screens for different aspect ratios and breakpoints? Simply switch on the Responsive Resize toggle and drag any edge of the artboard to the height and width you want, and this time-saving feature will automatically resize your screen proportionally. You can even select a specific layer group, should you only want to resize that particular part of the screen or move it around.
New Plugins Eco-System:
Developers can now build plugins in XD. There’s a Plugins menu where you can view all plugins, saving you the hassle of leaving XD to find them and download them from different websites. It’s worth noting that all these plugins have been vetted by Adobe engineers, so they’ll work well on both Mac and Windows. They allow developers to create their own UI within them and can connect to outside web services, such as Google Translate. Let’s have a look at some of them
World Ready Plugin:
For previews of how your design will look when localized for different languages.
To take the UI that you’ve designed on a specific artboard, for example a mobile phone screen, and paste it into a perspective mock-up of a mobile phone. Open your Layers Panel, select the vector layer that defines the screen, Open the Angle plugin and select the artboard containing the UI, click the Apply button, and Angle will fit and skew your artwork intelligently to the artboard.
Yes, we know we’ve shared lots of features and updates available in Adobe XD and you probably can’t wait to try them out, so we’ll leave you to it for now. In our next article, we’ll continue with a few more awesome XD updates and features, so don’t miss it.