8 anti-trends of web design 2019
There are many web design trends that have recently been popular. But just like trends in fashion design, they tend to become outdated and become anti-trends. In this article, we…

Continue reading →

8 anti-trends of web design 2019
There are many web design trends that have recently been popular. But just like trends in fashion design, they tend to become outdated and become anti-trends. In this article, we…

Continue reading →

Basic myths about website promotion (Part 1)
What is website promotion (SEO, search engine optimization) - this is an increase in its attendance by a certain audience of users, which is achieved by indexing the site in…

Continue reading →

52 web design tools that will improve your performance in 2020 (p2)

23. Canva

Canva is a popular tool for quickly creating images and infographics for social networks
Do you want to quickly and easily create infographics for social networks? Then Lawrence Harmer, founder of Solve Web Media, recommends Canva. This is a free tool for creating graphics both for print and for the Internet.

24. Affinity Photo

Affinity Photo has all the necessary functions for editing images (Image provided by: Affinity)
Looking for an alternative to Photoshop or Illustrator? This professional editor has all the features you will ever need. There is also an iPad version.

25. Orion Icon

This library offers various icons (Image provided by: Orion Icon)
In the Orion Icon library, you can find icons on various topics. Linear, solid, color, and flat icons are available on the site. Each icon is available in SVG and vector format. The nice thing is that you can create your own collection for different projects.

26. SVGito

This free app saves you from having to manually edit SVG format files (Image courtesy: Peter Nowell)
SVGito is a free web application that cleans SVG files, thus eliminating the need for manual editing. This small app created by Peter Novell automatically optimizes your SVG files. At the touch of a button, you can reduce their size and complexity without changing their appearance.

Read also: Adobe integrated XD into third-party Windows applications
27. Squoosh

A tool from Google that makes it easier to compress images
Squoosh is a free app from Google that helps web designers compress images without sacrificing quality. You drag the image into the app and use the slider to determine the compression ratio. The app will help you achieve a balance between image quality and file size.

Squoosh works both online and offline. Web designers save time, and Google gets a faster web that still looks good.

Animation
28. Principle
Principle is great for interactive design – particularly for mobile apps. Customizing and polishing animated interactions is something that Principle does perfectly.

29. Anima
Anima is a great plugin if you want to use Sketch for complex prototyping. This is a tool for creating really nice transitions and more complex interface animations.

30. Anime.js

Decorate the app with this animation engine (Image provided by Anime.js)
Although web page animation is sometimes applied incorrectly, reasonable use can make it easier to navigate a website. CSS animations and transitions were a huge step forward, but more complex interactions often require a library. Anime.js is an animation engine that allows you to add complex animated components to your applications.

Here’s an example showing a super-simple API:

var myAnimation = anime({

targets: [‘.box1′,’.box2′],

translateX: ‘5rem’,

rotate: 180,

duration: 3000,

loop: true

});

This code defines the objects that you want to animate, as well as the animation features. The API allows target elements to use CSS selectors, DOM elements, or even JavaScript objects.

The author, Julian Garnier, provided a collection of CodePen that demonstrates what the library is capable of, as well as detailed documentation on GitHub.

31. Hype Professional

Export stunning animated HTML5 layouts (Image provided by: Hype)
Hype Professional is an application that allows you to export stunning interactive and animated HTML5 layouts. It is able to animate elements with natural movements without keyframes or code. This incredibly simple editor provides tools that will bring projects to life and leave static interfaces behind.

Testing
32. Sizzy

Sizzy allows you to view multiple screens while testing the app (Image provided by Sizzy)
Sizzy is a tool that allows you to view multiple screens simultaneously while you are testing web applications. Sizzy allows you to see all changes at the same time, making testing faster. It will also be easier for you to find and fix errors in the layout.

33. Linksplit

Linksplit allows you to quickly and easily set up A / B testing
The most effective way to make your site better is A / B testing. You can split traffic between two or more different versions and determine which one works best. And Linksplit makes it much easier to set up.

Go to the site, enter the target URLS, and you will be given one short test URL that you can share with your audience.

34. Verifier
Fake email addresses registered on one-time domains are a threat to online communities, and this simple tool can be the Saviour of your site. The verifier can be added to the registration system by e-mail on the site. It instantly checks a list of more than 18,000 one-time domains and lets the user know if they need to provide a real address for registration. It also checks the existence of the address domain and the spelling order.

With a free API key, Verifier can be a really important step in the fight against spammers in online communities.

Export and conversion
35. Lunacy

Lunacy allows Windows users to easily edit Sketch files (Image provided by: icons8)
The introduction of Lunacy has been a great relief for Sketch users, as it solves the problem of file availability .sketch only on the Mac. Now you can open, edit, and save them on Windows with this free tool. This is a fast program that doesn’t hang when opening large files. It also has a good set of editing tools. So you can make some changes, save the file and send it to your colleagues. You can export files to PNG and SVG, and Lunacy will automatically load all the missing Google fonts.

36. Zeplin

Zeplin transforms Photoshop or Sketch files into a free app and makes them available for Mac, Windows, or just on the Internet
Zeplin-this tool is suitable for the period when the design is just designed and is being prepared for development. It allows you to pass the design and prototypes to developers, complete with all the specifications, code snippets, and exported resources that are needed. You can upload your Sketch, Photoshop, XD, and Figma files to Zeplin, and this tool will provide all the necessary information for developers and designers.

Zeplin significantly saves time for both designers and developers.

37. React Sketch.app

Airbnb shares its unique tool with the developer community.
React Sketch.the app provides a very simple way to manage Sketch resources in a large design system. This is an open source library that allows you to write React components for rendering in Sketch documents.

Because React Sketch.the app uses Flexbox, and its components can have the same extended layout as your actual components. This means that you no longer need to drag and drop rectangles manually. React Sketch.the app makes it easy to select and include data in Sketch files. It also provides an easy way to create your own development tools on top of Sketch.

38. URL to PDF

Convert HTML to PDF automatically with the help of this API
URL to PDF is a self-contained API that allows you to convert HTML code to PDF files. It is convenient for rendering receipts, invoices, or any other HTML content. By default, the API ignores the page’s CSS @media print rules and configures Chrome to emulate the @media screen so that the standard PDF file looks more like a real site. You can set it to work automatically at regular intervals. And, most importantly, it is absolutely free.

39. Avocode

Avocode helps you code websites or apps from Photoshop or Sketch projects
Avocode allows front-end developers to easily code websites or applications from Photoshop or Sketch projects. It was created by the same team that gave US CSS Hat and PNG Hat, so it’s not surprising that they took the export process one step further. A special feature of Avocode is that you can use its Photoshop plugin to sync your PSD with Avocode with a single click.

Avocode quickly and automatically analyzes a PSD or Sketch file and transfers everything to a beautifully designed user interface. After that, you get full control over the export of assets, including the export of SVG as standard.

Read also: what would the logos of famous brands look like if they were created in the Bauhaus
VR and AR
40. ARKit

Create augmented reality for iOS 12 devices with Apple’s ARKit 3
With ARKit 3 on iOS 12, your AR apps can now be processed by multiple users at the same time, and then resumed in the same state. You can also include real-world objects in your AR experience, giving your users even more immersive experiences.

41. Firefox Reality

Firefox Reality is a browser designed specifically for VR devices
If you work in webVR, you should try Firefox Reality, a browser for virtual reality devices such as Viveport, Oculus, and Google Daydream.

The browser was released by Mozilla in September 2018. It is now available in the app stores of these devices and is designed to move smoothly between a 2D network and a full immersion in additional reality. You can also search the Internet using your voice or your device’s headset.

42. Hologram

The basic principles of website usability
What is the usability of the site? Today we will talk about one very important characteristic of the site — site usability. What is "usability" (from the English. Usability -…

...

Web designers created the worst UI in history
Web design has come a long way over the years, but that doesn't mean it's perfect. We are constantly writing about how to make the UI better, how to fix…

...

About store design and how to increase traffic and profit
What should be the design of the store, online store? This article will focus on the basic principles of store design. These store design principles are not new and have…

...

52 web design tools that will improve your performance in 2020 (p1)
Now there are a lot of great tools for web design. Regardless of what task you are trying to solve, most likely, a certain tool has already been developed for…

...