UPDATE: This grid is for Bootstrap 4. See my new Bootstrap 5 template. I couldn’t find a good clean Bootstrap grid for Adobe XD that uses XD’s layout grid feature with guides to mark the midpoint of column gutters. So I made this grid template and I hope you like it! Download XD File Free for commercial or personal use. Please tell others about this template, but send them to this webpage to get it. (Do not redistribute this template on any other website.) What’s Included The templa...| Dan Rodney's Blog
After selecting a masked object, I wanted to select the mask via a keystroke. At first I couldn’t find the answer, but you can do it… and it’s easy! Select the Mask via a Keystroke in Sketch Select the masked object by either double-clicking on the mask group, or selecting the mask group and hitting Return. Press Tab to select the mask itself! Additional Masking Keystrokes for Sketch Once you’ve selected the masked object or its mask, hit Tab to switch back and forth between the maske...| Dan Rodney's Blog
Over a year ago I wrote Is Adobe XD Ready for Production Work? and a lot has changed since then. So it’s time for an update! At Adobe MAX 2016, Adobe said “you really have everything you need to be successful doing production work inside of XD”. I like designing with Sketch, and Adobe XD is clearly inspired by Sketch (to put it mildly). It’s been out of beta for a while now, so can you really do production work with it? That depends on your needs. To help you decide, I’ve compiled a...| Dan Rodney's Blog
Prior to iOS 11, you could drag a local webpage (.html file) onto the iOS Simulator to view it in Safari. Now it tries (but fails) to add the file into the new Files app. Luckily I found a pretty easy workaround. In the iOS Simulator, make sure Automatically Sync Pasteboard is turned on. Open the .html file in a web browser on your Mac (Safari, Chrome, etc.). Copy the URL (file:///Users…) In the Simulator, click into the URL bar, and then click Paste. --- This article was originally posted...| Dan Rodney's Blog
UPDATE: This grid is for Bootstrap 4. See my new Bootstrap 5 template. I found that most of the Bootstrap grids for Sketch did not use Sketch’s Show Layout (Ctrl–L) or don’t mark the midpoint of column gutters, so that’s why I made this grid template. I hope you like it! Download Sketch File Free for commercial or personal use. Please tell others about this template, but send them to this webpage to get it. (Do not redistribute this template on any other website.) What’s Includ...| Dan Rodney's Blog
I could not find a Bootstrap grid for Photoshop that uses artboards, so I made one. I hope you like it! Artboards require Photoshop CC, so this won’t work in CS6 or older. Download Photoshop .PSD File Free for commercial or personal use. Please tell others about this template, but send them to this webpage to get it. (Do not redistribute this template on any other website.) What’s Included The template contains artboards for the various device sizes in Bootstrap 4: Phone: Extra Small De...| Dan Rodney's Blog
When saving SVG (scalable vector graphics) in Adobe Illustrator, there are some things you should know that will affect the quality of the SVG files you produce. Disclosure: If you make a purchase using my links to Adobe’s website, I may earn a commission (which helps support me). Ways to Create SVG in Adobe Illustrator File > Export > Export As (and Export for Screens): This newer export produces more optimized, smaller files with cleaner code than File > Save As. Ignores the artboard ...| Dan Rodney's Blog
I’ve seen many web designers who work at 1x and I’ve read articles that say it’s best to design at 1x. But I think a more modern workflow is to work at 2x (Retina) size. In this article I’ll explore the various issues affecting our workflow, so you can understand why I recommend designing at 2x. Let me clarify something before getting started. I’ll only talking about designing web graphics in Photoshop. Other apps like Sketch, Adobe XD, or Illustrator work totally differently, so th...| Dan Rodney's Blog
At Adobe MAX 2016, Adobe said “you really have everything you need to be successful doing production work inside of XD”. I like designing with Sketch, and Adobe Experience Design (XD) is clearly inspired by Sketch (to put it mildly). I’ve started learning XD and it does show a lot of potential. It’s still in beta, so can you really do production work with it? That depends on your needs. To help you decide, I’ve compiled a list of its limitations. Disclosure: If you make a purchase u...| Dan Rodney's Blog
Did you know Google has a color picker you can use to mix up new colors, or convert color values between HEX, RGB, HSL, and more? Here’s how to use it! Search for a color value (like the examples below) to see the color picker. Hex values: #00cfc8 RGB values: rgb(253, 88, 150) Click Show Color Values to get other conversions (such as RGB, HEX, etc.) Here’s a screenshot of what it looks like. Happy Googling! --- This article was originally posted on Dan Rodney's Blog. If you enjoyed this ...| Dan Rodney's Blog