Editor’s Note: Our featured community member this week is Kenny Krosky, a growth designer at Adobe based in Temecula, California. As a member of the Adobe growth team, he’s constantly embedded in the creative process and conducting research to improve user experience across our products.
Designing for designers and creatives requires accuracy and precision — with regular feedback, reviews, and iterations, it’s a demanding workflow with many rounds of revisions. Over time, he found ways to build his own XD plugins to accelerate his workflow and get into a rhythm that matched the cadence the work demands, and with XD Plugins you can too!
We had a chance to learn about his experience developing multiple plugins for Adobe XD. We also hear his take on where things might be heading for folks developing on Creative Cloud like himself.
— Rob Kleiman, Platform Marketing Associate, Developer Experience
Kenny, what do you do at Adobe?
As a Growth Designer for Creative Cloud products, I design and execute experiments to challenge or rethink the current experience with our tools including XD, Photoshop, Premiere Pro, and Illustrator.
My team focuses on making sure users have a smooth start when getting familiar with Creative Cloud products. We’re looking at these applications at the product level and also the user experience as it relates to communication channels like email, banners, and web surfaces.
What kind of projects do you work on at Adobe?
We wear many hats on my team. Not only do we design experiments but we code them too. One of the coolest development projects I recently worked on was building out the deep-linking pages for XD. It’s the page users are linking to when they share a cloud document or a plugin from inside the XD Plugin Manager.
I recently developed an in-app modal inside of Photoshop mobile, which was pretty neat for me because I’ve been using Photoshop since my early teenage years. I also get to work on other interesting projects like coding landing pages, email templates, and some fun internal tools.
What was the first time art and code collided for you?
This might be a similar story for most: I wanted a snazzy looking MySpace page and started messing around with the code. This was my first dive into coding and messing around with hex codes and the other elements within MySpace. Fast forward and now I’m usually in an environment where I rely on JavaScript a lot.
What was your first thought when you learned that users could extend the features of Adobe products?
I thought it was incredible! Not only is listening to your users important but when you give the users the tools and ability to make features and add to the product, that’s a game-changer.
You can take matters into your own hands and build on top of an already intuitive tool to improve your workflow (and help so many others as a result).
What do folks need to know to get started with building plugins for Adobe XD?
Before diving into building a plugin for Adobe XD, I highly recommend you learn the basics of HTML, CSS, and JavaScript. These three languages are the foundation of what you need to know before diving into plugin development.
Not only will these languages help you build awesome plugins, but you can apply this knowledge to the web browser too. When I found out that plugins are a mixture of HTML, CSS, and JavaScript I was so happy, because I’m familiar with these languages.
I use each of them in this video where I walk through the steps to build out the artboard generator plugin, which is not in the XD Plugin Manager, but can be found on GitHub.
Beyond that, there are a bunch of similarities between plugin development and most of the web projects out there.
Where did the ideas come from for your XD plugins?
The ideas for my plugins are pretty straightforward. I saw a problem (or something I thought was a problem) to solve within XD and I built around that idea.
- Keyboard shortcuts: I thought showing the shortcuts in the application was an important addition to the application so I built something that allows you to quickly search and find any keyboard shortcut within XD to improve your productivity.
- Placeholder Image plugin: On certain projects, I’d send over wireframes of designs and would hear the same question: “What size image do I need here?” This plugin quickly and easily solves this problem. It adds a placeholder image into objects like rectangles, ellipses and polygons. It automatically includes the dimensions for the height and width of that object so the sizing question is answered without having to manually write them down for every wireframe.
Triangle: This is a silly plugin idea that I’ve made public to everyone. Before the Polygon tool became available, I made this because it was a tedious process to create perfectly shaped triangles.
All of these are good examples of my thought process around plugin development. They’re simple and they aren’t over-complicated or over-designed, but they each solve a common problem.
What do you like most about the XD Plugin API?
I honestly love so many things about it but if I had to pick it would be the styling of UI components. Having XD’s native Spectrum styles apply to your plugin’s UI elements by adding HTML attributes or class names is awesome. This helps your plugins maintain the consistent look and feel of the XD product.
The documentation that the plugin team has built is great and very easy to digest too. If you’re familiar with modern JavaScript, you can essentially build a plugin to help you with nearly all aspects of XD. The documentation page also has resources for a community of developers that post Q&A so you can get help with the API if needed!
What does the future of XD extensibility look like?
The future of extensibility within XD is huge. I think we have seen a big community form around this aspect of the product in just the one year that the APIs have been available and that has helped so many users.
I would like to see more open-source projects and collaborations between designers and developers to build tools they would love to see in the product.
Even Adobe’s collaboration tools themselves are pushing ahead in creativity and collaboration. Seeing the XD team roll out Live Collaboration, otherwise known as co-editing, has been a pivotal change for me and my team. It makes it simple for teams like mine to fail faster, communicate easier, and work seamlessly.
Is there a philosophy that informs how you approach your work?
If I had to boil down the way I work into a motto, it would be: Don’t complicate things.
When you do something over and over again and you’re able to trim even the slightest amount of time over a long period of time, it adds up. I actually still refer to my shortcut plugin from time to time. It definitely has provided a benefit and increased my ability to work faster.
I often build tools that take the tedious and manual labor out of my workflow which saves me a bunch of time! Which is also why plugins are great.
Remember the goal is to make sure users have a smooth start when getting off the ground.
Thanks for your time, Kenny!
— —
Kenny has three plugins that are currently available for Adobe XD. You can keep up with him by following him on Twitter or checking out his website.
Getting started with plugin development is quick. Head over to theXD Plugin API documentation to start building your plugin for Adobe XD.
For more stories like this, subscribe to our Creative Cloud Developer Newsletter.
Top comments (0)