Bookmarks - Adobe XD Plugin
Introduction
The first time I used Adobe XD I knew that I wanted the ability to quickly jump around to different artboards without manually zooming and panning around. For small projects this ability isn't very useful. On bigger projects however it is super useful. In fact, the larger your document and greater the artboard count, the more useful bookmarking becomes.
Bookmarks exists to empower the XD users that want this ability.
Bookmarks
If you are unsure if Bookmarks would be useful to you and/or your team, here is a list of uses and qualities it provides. A video (coming soon) showcases it in action.
- Jump around large documents with ease
- Jump to areas of interest when presenting designs, user flows, etc.
- Jump to a bird's-eye view of all artboards in one view
- Bookmarks persist in the document so they're shared with team members automatically
- Nickname bookmarks
Video coming soon
You can download and install Bookmarks within XD via Menu > Plugins > Discover Plugins... and search for Bookmarks. The plugin exists for both Mac and Windows. Once installed, it looks like this after the cmd/ctrl + shift + B shortcut.
If you end up installing Bookmarks, don't hesitate to reach out on Twitter @derekknox or via emal braindroplabs [at] gmail.com with improvement ideas, feature requests, or other related thoughts.
If you also happen to use Unity3D you'll likely dig a similar plugin I made for it called Scene Shot Bookmarks.
Developer Experience
In first researching if bookmarking zoom and pan locations was even possible, I found myself at the Adobe XD API Roadmap. In combination with the API Reference these resources detailed a few APIs that sounded promising. Through asking a series of questions on Twitter and with the help of @kerrishotts I validated that bookmarking in XD was 100% possible.
Additionally I learned that third-party plugins are authored in HTML, CSS, and JavaScript. Since that's my bread and butter, I thought I'd have the project done in a weekend. Unfortunately, there are more than a few pain-in-the-ass gotchas that other aspiring plugin authors should be aware of.
In no particular order:
- A subset of HTML, CSS, and JavaScript are supported
- This manifests as a subpar UX for Bookmarks where sacrifices I'd not normally have to make were forced
- Your plugin must exist within a
<dialog>(though plugins in panels are on the roadmap)
innerHtml()and manual element creation vs. providing static.htmland.cssfiles- This negatively impacted iteration speed (again due to the subset issue mentioned above) and the expectation of using
.htmland.cssin distinct files
- This negatively impacted iteration speed (again due to the subset issue mentioned above) and the expectation of using
- Lack of "this-is-the-main-way-you-should-author-the-shell-of-you-plugin"
- The GitHub example repo was great... but it was noisy and had seemingly outdated examples. Options are good, but providing and promoting a standard would help plugin authors actually focus on their plugin and not the shell and lifecycle enforced by Adobe.
- Shortcut restrictions
- I get this likely has to do with security and not globbing up the shortcut space, but the lack of flexibility here was another PIA which results in a subpar UX for the end-user.
- The form for submitting my plugin was borked and I had to enter all the information twice
- This is pretty rediclous to be honest but I'm thankful the process is fairly short
Overall, I give the Adobe XD plugin authoring experience a C. I know the team is still working to make this experience better while also improving the APIs, but right now it falls short. I'm looking forward to these improvements however as they will empower authors and thus end-users to get much more out of XD.
