In fact, we found that errors occurred every time (we’re human!): icons would be updated on one platform but not on another or icons would be missing or in the wrong format or size. This is not only time-consuming, but but it’s almost always prone to error. Our design team designs and maintains the icons, and until now the only way for them to provide the correct assets to the different teams, platforms and apps, was to send them via email, chat or dropbox. Sometimes completely new icons are added, while others get updated, and still others get dropped (although, they often remain in the codebase). The icons are continuously evolving, in sync with the evolution of the design. Some of them are the same across different apps, some are very specific to the brands the apps reflect. For multiple platforms ( iOS, Android, Mobile Web, Desktop Web), across multiple teams. The problem we were trying to solveĪt Badoo we build a dating app. This post is a detailed explanation of how we did it, and what we discovered along the way. Well, actually it’s not that easy, but it can certainly be done.
#Sketch icon files series
Supported URL parameters for diagrams.Using a custom build script in Node JS, it is possible to manipulate a series of Sketch files, and then, using an internal Sketch tool, automatically export their assets, to generate multiple icon libraries, for multiple platforms and different brands, that support dynamic colourisation of the assets via design tokens, and also AB testing of the assets via naming convention.Did you know you can even create draw.io diagrams in VS Code?.Did you know draw.io is slowly being renamed to ?.An overview of all keyboard shortcuts for draw.io ():.Repeat this for all the libraries that you want to include.
#Sketch icon files how to
Then, past in the URL of the library and click ‘Open’: Paste the ULR and click Open.Īnd, after a few seconds (depending on your bandwidth), the library is ready to use: (if you know how to display the library name correctly using this approach, please share it in a reply) Navigate to ‘open library from url’ dialog. (this will take a minute to load in the app, give it some time!).Īlternatively, you can open draw.io () and follow these steps to include the libraries manually.įirst, go to my GitHub repo README, check the list of URLs for the libraries, and copy the URL of the library you want to use:
And the best thing is it’s up-to-date and will hopefully continue to be so (you never know of course)! It’s created by Ben Coleman, and you can find the web interface here.
#Sketch icon files download
You can browse through it online and download individual icons or the whole shebang. There are some collections available online, but I can’t always see when they have been updated, and usually they are incomplete, so my search continues…īut recently I stumbled upon an online 💎: the largest single collection of Azure icons available (or at least that I could find)! The collection combines multiple online sources into a single collection. Sometimes I even end up creating them myself. It always takes more time to get a diagram correct then I want it to. You can find a link to more info on the ins-and-outs at the end of this blog post. Use this URL to directly open draw.io with the essential Azure icon libraries loaded and ready to use! Check my GitHub repo for all the libraries.īefore I continue, did you know that the open source draw.io will be rebranded to ? It’s because of the. Tl dr ⓘ used by someone who wrote a large post / article / whatever, to show a brief summary of their post as it might be too long Want to know how I make sure I have the latest Azure icons to work with? Read on! There are lots of tools to create these diagrams, and lately I have been primarily using draw.io and I love it 🤩.
Every now and then I need to draw a diagram for a solution or platform architecture, and enjoy doing that! I usually spend more time on them then planned 🙄.
0 kommentar(er)
