What’s New for Designers, June 2017
June 19, 2017
There’s a mix of function and fun in new design and development tools this month. From adding emojis to links, to fonts that wow, to CSS tricks, there’s a little something for everyone in this collection. Plus, almost everything on the list this month is free, except for a couple typefaces and tools. They’re sure to be useful to designers and developers, from beginners to experts.
If we’ve missed something that you think should have been on the list, let us know in the comments. And if you know of a new app or resource that should be featured next month, tweet it to @carriecousins to be considered!
Vectr is a free graphics tool that lets users create vector elements online (or using the desktop tool). Use it for logos, website mockups, presentations or print design needs for anything that requires a scalable image. The tool syncs between online and desktop versions to help you pick up projects from anywhere. Plus, Vectr includes collaboration tools so you can design and edit with others in real-time.
Data Gif Maker
Google’s new project allows you to create an easy gif comparing two elements by filling out a simple form. Pick the content, add data points and choose a quick color scheme and you have a highly visual data element to embed in web projects.
Add an emoji option to web links with this nifty link shortener. It makes tough URLs easy to manage and is a fun element to add to social media link share posts.
Add multi-factor and authentication that doesn’t require passwords to your website with this tool. Authentiq Connect lets users decide when to step up their security, and whether to use a second factor, or go passwordless. It is compatible with OAuth 2.0 and OpenID Connect.
Better Font Finder
Did you ever wish that you could find the perfect set of Google Fonts by grouping them visually? This tool does just that. Using filters and character types, the project allows you to see groups of options with similar characteristics so that you don’t get stuck browsing for hours on end.
Minimalist Phone Mockups
The free phone mockup includes Sketch and Photoshop versions to help showcase design projects. It comes with an oversized (6,962 by 4,350 pixel) canvas with changeable colors for the background or devices.
For designers that are sick of flat-style buttons, Colorion’s Gradient Buttons are the solution. The gallery of buttons comes with a variety of graduated options—single and multi-color—with one-click CSS for use in website projects. You can ever search by color to find something that will match your palette in a jiffy.
The reveal-on library contains elements with easy animations and options that have a variety of applications. The library uses ES6 rather than jQuery.
Insert icons directly into your HTML with code. It’s super simple: Just insert the tag and the Icons8 tool will find a matching icon and generate it in the right style, size and color.
Buttercup is a free and open source password manager for Windows, Mac and Linux. (You can also add it to Firefox.)
Word Counter calculates the number of characters, words, sentences, paragraphs or pages in real time. Just type in the box or paste type from somewhere else to get stats immediately. It can also be used to track text length against common web standards such as Twitter’s character count, Google’s meta description and Facebook’s average display length.
Trendy CSS Text Shadows
More design projects are getting away from flat styles with funky touches, such as the bold shadows featured in the Trendy CSS Text Shadows project. The collection of long text shadows includes font, color swatches and the CSS to use the concepts in your projects. Just scroll for bold headline inspiration.
This tool is a documentation site generator made with no statically built HTML files. It is simple and lightweight and includes a smart full-text search plugin. It works with multiple themes.