Thanks for your immediate feedback. I appreciate that somebody really takes the time trying to understand the problem behind my request instead of just filing it away.
Let us forget my request for a second and let me explain the problem behind it. As mentioned in my request, I am trying to establish a Design Pattern Library in Xd and want to re-use the the same Components whereever I can in my actual screen designs. In fact, I am working on two XD Cloud files:
• File A: Design Pattern Library file, where I define all the basic assets, like Buttons, Checkboxes, Menus, etc. Each of them is defined as Component in Xd. It also carries all standard colors and font definitions.
• File B: Screen design file where I design the web application I am working on. This file references all assets from the Design System file mentioned above.
Now, let us have a look at one example: I want to place a Button in my screen design file B by creating an instance of the Button Component I have designed in the Pattern Library file A. I replace the button label (which is a feature of the Component) and I adjust the width of the button (which is possible due to the Responsive Resize feature). So far, Xd does a great job.
It would make perfect sense to me if I could treat the icon within the Button similar to the text label: As a part of the Button Component which I replace every time I create a new instance of this Component. The icon in this context is rather just a path while information about color fill and size comes from the Component where it is used. The very same icon may be used not only within a Button, but also within a Butcon, a Combutcon, a Toggle Switch, …
Each of these Controls may have different states which need to be designed, and each state may impact the icon color fill.
Each of these controls may use icons with a different size.
The point is: How an icon is used within a Control (as Xd Component) is part of the design of that Control. If I had to treat icons as Xd Components itself (your suggestion #1), I would have to create all these different sizes od possible states in redundant icon Components, although these are stricly dependent on the Controls I have designed.
The idea of a Component in XD is that I can define a master, which allows me to propagate changes at any time, even though I applied local modifications on my Component instances. Applying this idea to icons does not make sense to me. The one and only change on icons I want to propagate (but invariable, without local modifications) is the path of an icon. Color fill and size belong to the Control (and the dedicated Xd Component) where that icon is used.
Your suggestion #2 has the same flaws as the Xd Component approach, but it shifts the problem to (in my case) Illustrator: Now I have to design color and size modifications of the same icon in Illustrator, just to be able to use it in Xd. Same redundancies, but now even spread across two applications.
So, back to my request: The icon being designed in Illustrator and integrated into a CC Library works and makes sense. What's missing is the ability to embed an icon from that CC Library and style it within a Control represented by an Xd Component. Advantage of this workflow: No redundancies of style definitions and no misuse of the Xd Component concept where it simply won't apply well.
Hope my explanaitions were helpful and you understand the idea behind it.
Reiner
shared this idea
·
Hi Sherif,
Thanks for your immediate feedback. I appreciate that somebody really takes the time trying to understand the problem behind my request instead of just filing it away.
Let us forget my request for a second and let me explain the problem behind it. As mentioned in my request, I am trying to establish a Design Pattern Library in Xd and want to re-use the the same Components whereever I can in my actual screen designs. In fact, I am working on two XD Cloud files:
• File A: Design Pattern Library file, where I define all the basic assets, like Buttons, Checkboxes, Menus, etc. Each of them is defined as Component in Xd. It also carries all standard colors and font definitions.
• File B: Screen design file where I design the web application I am working on. This file references all assets from the Design System file mentioned above.
Now, let us have a look at one example: I want to place a Button in my screen design file B by creating an instance of the Button Component I have designed in the Pattern Library file A. I replace the button label (which is a feature of the Component) and I adjust the width of the button (which is possible due to the Responsive Resize feature). So far, Xd does a great job.
It would make perfect sense to me if I could treat the icon within the Button similar to the text label: As a part of the Button Component which I replace every time I create a new instance of this Component. The icon in this context is rather just a path while information about color fill and size comes from the Component where it is used. The very same icon may be used not only within a Button, but also within a Butcon, a Combutcon, a Toggle Switch, …
Each of these Controls may have different states which need to be designed, and each state may impact the icon color fill.
Each of these controls may use icons with a different size.
The point is: How an icon is used within a Control (as Xd Component) is part of the design of that Control. If I had to treat icons as Xd Components itself (your suggestion #1), I would have to create all these different sizes od possible states in redundant icon Components, although these are stricly dependent on the Controls I have designed.
The idea of a Component in XD is that I can define a master, which allows me to propagate changes at any time, even though I applied local modifications on my Component instances. Applying this idea to icons does not make sense to me. The one and only change on icons I want to propagate (but invariable, without local modifications) is the path of an icon. Color fill and size belong to the Control (and the dedicated Xd Component) where that icon is used.
Your suggestion #2 has the same flaws as the Xd Component approach, but it shifts the problem to (in my case) Illustrator: Now I have to design color and size modifications of the same icon in Illustrator, just to be able to use it in Xd. Same redundancies, but now even spread across two applications.
So, back to my request: The icon being designed in Illustrator and integrated into a CC Library works and makes sense. What's missing is the ability to embed an icon from that CC Library and style it within a Control represented by an Xd Component. Advantage of this workflow: No redundancies of style definitions and no misuse of the Xd Component concept where it simply won't apply well.
Hope my explanaitions were helpful and you understand the idea behind it.
Reiner