So, the way you design the layer structure of your first artboard will be important to the success of your next artboards. This means that if you have ‘Layer A’ in ‘Group B,’ and then on another artboard ‘Layer A’ in ‘Group C,’ XD will not recognize that layer as being the same and won’t animate. “With Auto-Animate we try to keep things as simple as possible for the user,” Alex points out, “so if XD sees the same two layers between artboards, it will automatically animate all the changes that happened to this layer.”įor XD to associate those layers, they have to share a name and live in the same group hierarchy. The reason planning ahead is important is because your layer structure matters. ”You might have one artboard that goes to two or three other artboards depending on where you click, so have a rough idea of how you want each of those artboards to animate if they’re all using the Auto-Animate feature.” “When creating your first artboard, it’s best to know how the next artboard(s) will resolve,” Alex recommends. The most important thing to be mindful of when using Auto-Animate is to have an actual plan for how it will animate. The different types of animations easily achieved in Adobe XD: drag, navigate, and time. Motion can be used for an even more basic reason like creating a pleasant and less robotic experience for the user.” In some cases it’s a way of creating a visual hierarchy, maybe a call to action or a temporary message that fades in and out of the screen. It can be used to help a user create a mental model of where content is moving to and from, allowing them to orient themselves while navigating. “Today’s screen experiences, however, allow you to use motion in a more prominent way. Those offerings were great to get a very basic feel for user flow and build consensus among your team.” “For a while XD offered only basic transition types that mimicked your phone’s native transitions such as push, slide, and dissolve. “Adding Auto-Animate to XD was something that we’ve been thinking about for a long time,” explains Alex Poterek, a senior experience designer at Adobe who helped design Auto-Animate, and is now offering his best advice, tips, and tricks for using the animation feature. Simply duplicate an artboard, modify object properties (such as size, position, and rotation), and apply an Auto-Animate action to create an animated transition between artboards. It enables you to easily create prototypes with immersive animations. The latest release of Adobe XD introduces Auto-Animate, the biggest addition to the tool’s prototyping features yet. Best Practices for Using Auto-Animate in Adobe XD
0 kommentar(er)
