10 best new web design tools for February 2019

[Rss Bot 1]

The dark months of the year are a good chance to hunker down and build your knowledge before spring brings opportunities that will distract you. To that end, this month’s tools focus heavily on learning resources. If you haven’t got into progressive web apps yet, there are two books from great writers that will get you up to date and show you what can be achieved. 

There’s also a performance checklist with all the resources you need to learn about speeding up your sites, some design case studies that show how things were done at some big sites, and a huge survey exploring how design has impacted business performance at thousands of organisations. 

01. Best of 2018 UX Design Case Studies

In-depth accounts of real-world UX design scenarios

This round-up from the Case Study Club provides some fantastic learnings from some of the most interesting web design case studies of the last year. Every scenario has its unique challenges and constraints, and these deep-dive articles explore how some of the industry’s top designers handled their particular project. You’ll read about the process of redesigning the New York Times homepage, Chrome’s new look, the Mailchimp dashboard and lots more. 

• Web design tools to help you work smarter in 2019

02. Velocity

A ready made design system to help you get off the ground

Building your own design system is an intimidating task, so using something like this as a framework to get started makes life a lot easier. Velocity is a UI kit and design system for a fictional self-driving car company that works with InVision Studio, Sketch and Photoshop. It contains 30 screens for common app functions such as sign-in, settings, map, chat and so on, and they come in small, medium and large sizes so you can see how components will work on different devices. There are over 70 components and over 300 UI elements that you can mix and match to build your app. 

03. FBT

An internationalisation framework for JavaScript

If your website or app needs to work in different languages, FBT can help. It’s a JavaScript internationalisation framework that facilitates grammatically correct translated texts in dynamic applications. It’s used by Facebook, and you can find more useful tools and projects over at Facebook Open Source, Facebook’s developer community. You’ll find all kinds of useful tools related to artificial intelligence, data infrastructure, security and more.

04. Static Site Boilerplate

An ordered workflow for static sites

This great boilerplate provides an ordered workflow for creating static sites and has a built-in development server – no need to have one already on your computer – so you can get up and running with minimal fuss. Your code is automatically linted, concatenated and minified, you can use Sass or Less without vendor prefixes, and images are automatically optimised. There are various other useful features that make life easier, and overall it’s a handy tool for doing static sites without reinventing the wheel.

• What is Sass?

05. Front-end performance checklist 2019

A thorough round-up of resources and advice for web performance best practice

For the last few years, Smashing Magazine have been keeping this massive resource on web performance and it’s been freshly updated for 2019 with the best advice for making your site as fast as possible. It covers everything from changing the culture of your organisation to prioritise performance to dealing with the technical challenges and trade-offs required to keep the functionality you need while shaving seconds off load times. Today’s web is slower and clunkier than ever because of heavy, poorly optimised pages. Let’s make it better!

Also read: 5 ways to speed up your websites and apps

06. Learn JavaScript

Interactive lessons for learning JavaScript basics

Jad Joubran, a Google Developer Expert and Microsoft Most Valuable Professional, has created this online interactive JavaScript course that’s suitable for beginner developers with basic knowledge of any programming language. You learn JavaScript basics via a series of challenges that are based on real-world projects to ensure your learning is practical and relevant to modern applications. The first 40 lessons and challenges are free. 

07. The New Design Frontier

Data from thousands of companies on the relationship between design and business outcomes

If you need some hard data to convince leaders at your organisation of the transformative power of design, this industry wide survey from InVision on the impact of design practices on business performance will help. It has data from 2,200 organisations spanning 24 industries from all over the world. There is information from small businesses, large enterprises, non-profits and even governments, and each has reported how design has reshaped their products and practices. 

The data explains the extent to which different companies have benefited from greater integration of design in their business (it varies a lot), and there’s analysis that seeks to understand why the efforts of some companies have been more effective than others, so you can learn how to use design in a way that has the most impact on your bottom line. 

08. Pixel Mob

Free-to-use images from various sources

Pixel Mob is an aggregator that pulls in high-quality royalty free images from multiple sources including Unsplash, Pixabay and Pexels. It serves up a great selection of images and also suggests related search terms that might help you find what you’re looking for. It will definitely save you time if you find yourself opening multiple tabs and comparing results from different services.

09. Progressive Web Apps by Jason Grigsby

Learn about the advantages of using Progressive Web Apps

Progressive Web Apps (PWAs) look and behave like native apps, but you don’t need to deal with app stores because they’re web-based. Your app is available to all devices and you’re free from the restrictions of proprietary platforms, so there’s a strong case for using them – but they come with a different set of challenges. In this book, Jason Grigsby explains how to make the case for PWAs in your organisation, how to grow your audience and how to create the most value for your users.

10. Progressive Web Apps: The Future of the Mobile Web

A free ebook with some great case studies

Here’s another great resource on Progressive Web Apps – this time it’s a free ebook that’s the result of a collaboration between Microsoft, Google and Awwwards. You’ll learn why PWAs are important, how to build one and how to assess the results. Usefully, this book explores some interesting case studies from Lancome, Trivago, BMW and Pinterest, so you can see some real-world results and learn from their successes. It’s also useful data you can use to make the case for PWAs in your organisation. 

Read more:

• 10 best new web design tools for December 2018
• The 7 deadly sins of web design
• 27 steps to the perfect website layout

View the full article