Adobe XD plug-in: Difference between revisions

Jump to navigation Jump to search
no edit summary
No edit summary
 
Line 37: Line 37:
The background component is used for setting the borders of an icon. By default it's completely transparent. If you want to display the border of an icon, you can modify its color or transparency. This makes sense particularly during editing. However, remember that during the final export, background should be fully transparent again (transparency = 0%).
The background component is used for setting the borders of an icon. By default it's completely transparent. If you want to display the border of an icon, you can modify its color or transparency. This makes sense particularly during editing. However, remember that during the final export, background should be fully transparent again (transparency = 0%).


[[File:Xd plugin background.png|600px]]
[[File:Xd plugin background.png|alt=Adobe XD plugin background|600px]]


Icons are stored in folders - one folder per icon. The name of the folder determines how the icon is exported. Remember the rule for icon naming:  
Icons are stored in folders - one folder per icon. The name of the folder determines how the icon is exported. Remember the rule for icon naming:  
Line 46: Line 46:
For example, the name of the About icon on the Home screen is: <code>icon / Home / About</code>.
For example, the name of the About icon on the Home screen is: <code>icon / Home / About</code>.


[[File:Xd plugin images.png|600px]]
[[File:Xd plugin images.png|alt=editing icons in the Adobe XD plugin|600px]]


Each icon folder has two layers:
Each icon folder has two layers:
Line 76: Line 76:
Place the final design of app icon as the '''main icon''' component in the '''Master''' artboard. Instantly, all versions of the icon in the entire artboard will be replaced. Important: Please disable responsive resizing.
Place the final design of app icon as the '''main icon''' component in the '''Master''' artboard. Instantly, all versions of the icon in the entire artboard will be replaced. Important: Please disable responsive resizing.


[[File:Xd plugin appstore.png|600px]]
[[File:Xd plugin appstore.png|alt=Adobe XD plugion appstore|600px]]


Then go to '''Plugins > Resco for XD > Export App Icons''' and follow instructions to export the icons as AppImages.zip. In Woodford, select '''Mobile Apps''' from the '''Administration''' menu, then click the '''Import Images''' tab.
Then go to '''Plugins > Resco for XD > Export App Icons''' and follow instructions to export the icons as AppImages.zip. In Woodford, select '''Mobile Apps''' from the '''Administration''' menu, then click the '''Import Images''' tab.
1,214

edits

Navigation menu