Spring is in the air with plenty of new tools, particular color and CSS options. We hope that the change of season has you inspired to create and that these new design tools can make your work life just a little easier.
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!
Abstract Acrylic Graphic Pack
The Abstract Acrylic Graphics Pack is, ahem, packed with textures and splashes in colorful vector formats. All of the background-ready elements are designed in a high-resolution format in JPG, PNG and AI formats. The pack includes 12 acrylic splashes, eight textures and 90 vector shapes to use as overlays. (The download does require an email address and you can add an optional donation to support the creator if you like.)
Prompts
Prompts is a lightweight, and aesthetically pleasing set of interactive prompts. It’s made with a simple code concept that has no big dependencies or dozens of tiny modules. You can design a prompt to ask for a single answer, a chain of answers or even dynamic prompting.
Dribbble Color Palette Generator
Turn any color palette from a Dribbble shot into a Sketch-Palette plugin. Just save your favorite colors and download them right to the Sketch-Palette plugin for use in projects. The tool includes Firefox and Chrome extensions.
FastPhotoStyle
FastPhotoStyle is a code repository from NVIDIA – yes, the video card makers – that includes their fast photo style transfer algorithm. The tool allows users to transfer the visual style of one image to another. The code falls under a Creative Commons Non-Commercial Share Alike license, so check the rules before using it in projects.
CSS Color Gradients
Create a more intuitive color gradient with CSS Color Gradients. Pick a start and end color and the tool adjust the gradient to give you the best and most visually pleasing color fade, so you don’t end up with harsh starts and stops. Then you can grab the CSS for your color gradient and add it to projects.
Launchaco
Launchaco is a simple website builder for small start-up sites. You can create responsive designs, apps and all of the website tools integrate with common elements such as Google Analytics for tracking, HTTPS, and custom domains. Users can create a free account to build a website or opt for the annual paid version ($49.99 beta pricing) for more robust and unlimited features.
Chrome Music Lab: Song Maker
Take a break from color swatches and code with the Song Maker from Chrome Music Lab. Color in the blocks with your mouse, pick a music style and see what your visual creation sounds like. It’s a fun–and creative–diversion!
.colors
The .colors tool solves an everyday web design dilemma: You have an array of colors in your code, but don’t always know what they look like. This tool allows you to enter an array of codes and generates a color palette with each color identified by code. Just paste any code snippet into the tool that contains colors – hex, HSL or RGB – .colors does the rest.
Today’s Date SVG
Terence Eden wanted an SVG that always displayed the current date on his blog – so he made one. Today’s date SVG is a generic date icon that accurately displays the day and date. Just add a few lines of code and JavaScript and you are ready to go.
Kutt.it
Kutt is a new link shortener with robust features so that your links are branded and trackable. Kutt lets you create, protect and delete links; track analytics; use a custom domain and integrates with an API. Plus, the tool is open source and free to use (you can even host it on your server).
30 Seconds of CSS
30 Seconds of CSS is a curated collection of code snippets that almost anyone can understand in less than a minute and deploy in website design projects. Snippets are lumped into categories so you can find just what you need with the code to make it happen (and an explanation for greater understanding).
Sketch Isometric
The Sketch Isometric plugin allows users to generate isometric views from artboards and rectangles in the Sketch app. The isometric view, which represents three-dimensional objects in two dimensions, is a popular choice for showing app mockups with multiple screens in one visual display. The plugin lets you rotate and twist, scale and change the color and depth of renderings.
Duet Display
Need more monitor space? Duet Display lets you turn an iPad into an extra monitor for your Mac or PC. The tool, which was built by former Apple engineers, can help you increase productivity and interact with your computer via touch through the iPad. All it takes to connect is a software download and Lightning or 30-pin cable.
Notifications
Inclusive Components has a good article on notifications and how to include notification components in more than just “web apps.” Notifications can be a part of any dynamic web experience when you need to draw attention to something with a short message. From understanding live regions to chat applications to flash messages, this article breaks it all down.
Pure CSS Moleskine Notebooks
Fans of the notebook of the same name will love this pen featuring CSS-animated Moleskines. Pen features four notebooks that are closed and open to feature inside pages on hover with plain, ruled, grid and dotted “paper.”
Mario Pixel Icons
Bring back fond childhood memories with a site of pixelated, video-game style icons. The set includes all the images you’d expect to see in an early video game in vector format. Use them online or even on a shirt design. The set includes 100 icons in AI, PNG and SVG formats.
Handlebars in UI Design
Shankar Balasubramanian, a designer at Angie’s List, takes a good look at handlebars, a new user interface element that’s gaining popularity. Here’s how he describes it in the informative post: “Handlebars are an interface element to help the user resize and rearrange the different sections on this canvas (or interface in modern UI). If you have used the iOS multitasking split-view on iPad, the little vertical and horizontal handles in one of the two apps in split-view are what I call as ‘Handlebars.’”
Extinct Animals Icons
Human beings have accelerated extinction rates in the animal kingdom like never before. Whether it be due to hunting, habitat destruction, or food source competition, more an more animals will never be seen again. This varied set of extinct animal icons seeks to educate as well as provide a great resource.
2018 Career Happiness Survey
What are you trying to get from your career? What parts of work make you happy? The Career Happiness Survey is trying to find that information with a survey for individuals and leaders looking to make good decisions. Everyone who participates will get the results via email.
Tutorial: Stunning Hover Effects with CSS Variables
Tobias Reich has a fun tutorial that helps you create a cool hover effect for a button. The design is simple but stands out with a nifty gradient that is just a little different from all the standard color change hover states often used. He walks you through the process so you can customize and create your hover effect.
Fonts.LOL
Fonts.LOL is the first type foundry dedicated to color fonts. The typography style is based on open-type SVG fonts that include multiple colors, strokes (and widths) and gradients. The concept behind the collection of color fonts is to push forward the technology and make color font adoption easier and more widespread. Just pick a color font, download and install to use. (Licenses can vary by font.)
Bluefish
Bluefish is a somewhat blocky sans serif with a limited number of styles in the free demo set. (A full version is also available.) It can make a nice display option and the demo includes regular, italic, bold and bold italic styles with 378 characters in each.
Gudlak
Just in time for St. Patrick’s Day is the release of Gudlak, a handwriting style typeface with clover flourishes. The demo version includes a limited set of 53 characters, but a full typeface option is available. This font can be fun for seasonal projects when used sparingly.
JMH Arkham
JMH Arkham is a vintage-style serif typeface with a lot of character. The typeface includes a full set of upper, and lowercase characters with fun tilts and notches. Some of the letters also have longer tails to add flourish to your typography.
Kabe
Kabe is a monospaced typeface with a lot of character. Its use could easily extend to display text for print and website designs. The typeface includes upper, and lowercase letters, numerals and punctuation.
Stay Classy
Stay Classy is a simple, line-style handwriting typeface with plenty of ligatures and a tall stance. The light typeface is great for display or lettering for invitations; it includes a full character set, numbers and punctuation as well as alternates.
| Add Realistic Chalk and Sketch Lettering Effects with Sketch’it – only $5! |  |
This content was first posted here:
What’s New for Designers, March 2018
No comments:
Post a Comment