In this article I wanted to focus on websites that I came across during my work on mobile application development and that have stayed with me for good. There are a lot of different websites on the Internet, which a beginner programmer/graphic designer has no idea about, and which are very helpful in everyday work. This list is meant to present interesting sites, but also to show that the Internet is a mass of sites with different functionalities – this is why we should not be afraid and browse for what we need!
List of sites that are useful for front-end application development or design:
-
Flat UI Colors 2 – 14 Color Palettes, 280 colors ? A useful site when we quickly need interesting color matches for our application. You can choose from 14 different color palettes, 20 colors each.
-
Picular Sometimes we need a color for one particular element, but we have a hard time finding the right one. There comes Picular to the rescue. Just type the element which color you are looking for and the page displays all the colors associated with it. -
Free Vector Icons and Stickers – Thousands of resources to download One of the biggest, if not the biggest icon database. I use it very often when I don’t have an icon from design and I don’t want to wait until the graphic designer sends it to me. In 90% of cases I find an identical icon on this site. Not all icons are free, but the site offers friendly filters. I use two: one to show only free icons, and the other which allows you to show only icons with black borders or only with black fill ( it really speeds up the search process).
A list of services that are helpful when working with photos and graphics:
-
? Color Picker online | HEX Color Picker | HTML Color Picker Many times we have found a design that we would like to implement, but didn’t have the colors it used. This site allows you to upload a photo and check the color of each pixel. -
Change Colors in a PNG – Online PNG Maker It allows us to swap pixels with one color for another i.e. it checks if a given pixel has the color (or is similar to the color – you can specify the % similarity) specified by the user and swaps it to the intended color. As an example, we have a picture of a plant on a white background – we want to have a transparent background, so we choose white, set the similarity range to 5% and replace the matching pixels with transparent ones.
-
Crop your images in seconds for free! A tool for fine-tuning photos. Let’s say we got a photo from a client that he wants in his app, but it has a big margin around the actual photo i.e. we have a plant in the middle, but around it I have a lot of white background on which nothing is on, and it takes up unnecessary space. Thanks to this page we can crop the same fragment from the left and right side, as well as from the top and bottom, so that the plant is still in the middle of the photo. -
TinyPNG – Compress WebP, PNG and JPEG images intelligently Compression of photos with the .png extension. Reduces photo size by about 80% on average. Very useful if we have a large number of photos in our application and we want to reduce the application size. -
TinyJPG – Compress WebP, PNG and JPEG images intelligently Same tool as the one above, only for photos with .jpg extension. -
pointerpointer.com Maybe it is not a useful page, but it is very interesting and funny. It displays us a random photo with people pointing their finger perfectly in the place indicated by the mouse cursor. -
Online Image Vectorizer Converter of icons/images to vector graphics. The free version is very slow and has high time and quantity limitations. It will work very well if you only have one item you need in vector resolution.
Other pages:
-
Internet Speed Test – A very simple site to check the quality and speed of our internet connection. Without unnecessary gadgets and ads, thanks to which the page loads very quickly and we can immediately check whether the slow loading is caused by the speed of the Internet or its lack.
-
Flowchart Maker & Online Diagram Software Very extended service for building any kind of diagrams/schematics/maps. We have at our disposal several hundreds of elements, which we can build, e.g. block diagram, network diagram, flowchart. The site offers more than 150 ready diagram types for quick use and modification. -
Lorem Ipsum – All the facts – Lipsum generator Text placeholder generator. We can generate random text based on a given number of words/paragraphs/bytes/ bulleted lists. Helpful when a client hasn’t provided us with text, but we want to see what the application will look like when we add text to it. -
Lorem Picsum Similarly to the random text generator, this service generates us a random image at a given resolution. It is very helpful, when we know, that the photo, displayed to the user will be downloaded from API, but at the moment it does not send this photo yet – we paste special link to the service and every time we use it we get different photo. Additional feature is to provide a photo with blur effect or in grayscale. -
Epoch Converter Converts time from so called epoch time to readable for us date and vice versa. Fast, fun and has various options for settings. -
JWT.IO JWT token debugger. Allows us to read the encoded information in the token (e.g. id, name, but also information about the token itself – type and algorithm used) and first of all checks if the token is correct. -
Screen Sizes List of all information about Apple displays. They can be categorized by screen size or by device model.
