10 best new web design tools for December 2018

[Rss Bot 1]

Here are our picks of the best web design tools that have emerged over the last month or so; you’ll find some great learning resources as well as tools to make everyday tasks simpler and faster. 

01. Whimsical

Collaborative flowcharts, wireframes and sticky notes

Billed as "fast and delightful", Whimsical offers and fun and pleasing way to collaborate with colleagues via an efficient user interface that is indeed a delight to use. There are three types of visual collaboration: flowcharts, wireframes and sticky notes. Any number of people can work on the same thing simultaneously, and each tool is really powerful. You can create up to four free boards per month, and after that you need to pay $10 per user per month. 

02. web.dev

A resource from Google that will help you build sites that are secure, resilient and fast

Google’s web platform team have created this resource to help developers up their game and build websites that take full advantage of the capabilities of the modern web. There are tools that will help you measure your site’s performance to find out where to start improving it, and tutorials and guides that will teach you how to do that. The aim of the project is to teach developers how to build sites that are fast, safe and secure, accessible and resilient.

03. Flare

Flare lets you work on final assets right from the start

Flare is a tool for designing and animating vector art for web and games. The aspect that sets it apart from the rest is that it is you’re always working on the final assets that will run in your app or game – so you don’t need a complex process where you might be designing in one piece of software, animating in another and then recreating the whole thing in code. The creator of Flare, 2dimensions, is offering it free as part of their Open Design movement, an initiative that encourages designers to share their works-in-progress. 

04. Getform

An easy way to set up and manage forms on your site

Getform is a really easy way to add a form to your website and manage the responses – just give it a name, add the URL and form fields to your code and it’s done. You get a great-looking form on your site and submission data can be integrated with various popular platforms such as Salesforce, Google Sheets and Mailchimp, and exported as CSV, JSON and XLS. There is powerful spam filtering, and there’s a file upload functionality so you can collect up to five files per submission – a feature often missing with form tools. 

05. humaaans

Customise and adjust images of people to fit your needs

This customisable illustration kit is like "legos made of flesh...and vectors" because it enables you to change elements such as the clothing and hairstyles of the human figures, as well as rotating and posing them however suits you. It's great for building figures for your app or website interface that will fit your layout perfectly, and it’s a nice compromise between using stock imagery and the time and expense of hiring your own illustrator. The library is for personal or commercial use, and is provided under a Creative Commons Attribution 4.0 International Licence. Read more about it in our news post here.

06. Mindful Design by Scott Riley

Psychology principles that will help you to create better products

Learning some things about how the brain works will make you a better designer. Mindful Design by Scott Riley lays out certain aspects of psychology and neuroscience that are helpful for visual design, such as how attention and distraction work, and how we parse, codify and group information. 

Riley explains how to use this understanding to inform your design process, and even explores how we can use this information in an ethical way. Rather than creating products that are addictive, he offers a much-needed alternative perspective by looking at some theories on intrinsic motivation, and how to build products that treat people well. Mindful Design is out 4 February, and you can save 18 per cent by pre-ordering on Amazon. 

07. Service Workies

Learn how to use Service Workers by playing a game

Master Service Workers with this game-based teaching approach that solidifies learning while you slay dragons that represent Progressive Web App pitfalls. Once you’re done, you’ll be able to make your app work offline, get some amazing performance improvements and create experiences that feel native. If you enjoy this, you can learn other good things from Flexbox Zombies (like Service Workers, this is free) and Grid Critters ($229). 

08. Squoosh

Play with the settings of several image compressors

This image optimiser lets you see exactly what has been lost by compression by providing a slider you can move over the image to see and compare before and after versions. You can try out various image compressors and experiment with the settings for each to see which gives the best results for you image. 

09. Shapy

A user interface for CSS gradients

If you’re new to CSS gradients this tool is a fun way to get started by using a GUI instead of writing the code yourself from scratch. You can specify canvas size using sliders, and switch between linear gradients – which make rectangular shapes – and radial gradients, which make round shapes. From there you can enter the colours for where your gradient starts and stops and use the preview window to tweak things until you get exactly the look you’re after. 

10. The Y Combinator Database v2.0

Research companies that have come out of the Y Combinator accelerator

Ever wondered what happens to the companies that start out at the accelerator Y Combinator? Now you can track them according to 16 different metrics with The Y Combinator Database v2.0, which launched last year and has recently been boosted with a ton of extra features. You can view companies ranked according to employee count, funding amount, growth rate and lots of other factors, and you can drill down into different industries. 

Read more:

• The best free graphic design software
• 10 ways to avoid cross-browser compatibility issues
• 10 best new web design tools for October 2018

View the full article