For designers and developers: Useful websites and tools!

I would have liked to divide the post into two separate posts, one for designers, and one for developers.. but due to the great overlap between the two fields, I preferred to combine them, at least better than repeating some sites in

posts. Designers and developers!

method.ac

The site offers two fun games to practice on the Pintool tool, The Bézier Game and Shape Type.. Spending some time in both games, will increase your skills in one of the most important and powerful tools in design software!

Also Read: As a Designer Why Should I Master the Pin Tool?

Adobe Color CC

is one of the most powerful tools for choosing colors.. The site contains huge groups of colors that are consistent with each other, you can view them and the ratings and comments of designers on them.. You can also build your own group of colors.

Note: Although the tool is very useful, but it is not magic, it is not correct to rely on it completely, without an understanding and understanding of the theories and principles of color science. You can read: #Designer_Thoughts: Colors.

Colors may match each other. But it may not be the best fit for your design.

BrandColors

Sometimes while we are working on a specific design we need to add some elements from famous brands, such as social media icons for example.. Well instead of choosing a “random” or inaccurate color tone you can rely on this site, it provides you with the official color codes of most of the famous brands around the world.

FlatIcon

is one of the most powerful and richest resources in the field of icons. In most cases, it is more than enough in this aspect.. Also, most of the icons on the site are in a “raw” image, that is, they are not colored and do not contain any prior coordination.. Therefore, you can coordinate and modify them to suit your design.

The site is also a great addition that works on Photoshop and Illustrator, through which you can download icons directly into the program. You can find it here:

http://www.flaticon.com/apps/adobe-extension

Iconfinder

The second source for searching for icons. It also has a large set of icons, and I use it occasionally.

Pixabay

is one of the most powerful sources in the field of images.. The site contains a wide variety of images, covering most areas.

BitBalloon is

a great platform that offers the easiest way to upload your design [HTML / CSS / JavaScript] on the Internet, and without getting into the complexities of dealing with hosting, just drag the design folder to the site and a live link to the design will be generated.

Very useful for making a live view of the site on the Internet quickly, or to measure its speed, or to make Validation of design files, or ..etc.

Icomoon / fontello

create your own icon font, instead of using a font with more than 600 icons and without actually needing them, which will hurt your site's performance. You can assemble the icons in SVG format or design them yourself on Illustrator..

You can use either one of the two services.

FORMSPREE

is an easy and secure service to create a “contact us” form on your site, very useful especially if the site is static, or on the blogger platform. You will not need to deal with PHP or the back end in general, but you will not need to just register with the service, just add the HTML code for your site, and a protected form will be added to your site.

You can also use AJAX to send messages without the need to reload the page, and with full control over the message that is displayed to the visitor, whether during or after sending the message, or when an error occurs.

CSS Diner

is a beautiful and entertaining game with 26 levels to practice the selectors in CSS in an interactive way.

FlexBox Froggy

Another game of 24 levels to practice the awesome features of FlexBox in an interactive way..and entertaining!