Best of the web for Design and Web Development January 2022

• January 31st, 2022
• News

The first month of 2022 is in the books., in this post where looking back at the best design tutorial and web development articles. The roundup features some great Photoshop and Illustrator tutorials watercolour paint effect in Photoshop to a lighting text effect using illustrator. Theres also some great web development and design articles from what where the hottest front end tools in 2021 to brilliant ways to tackle designer block. This is jam packed with some great we hope you enjoy reading through.

Design tutorials

How to Use the Liquify Tool in Photoshop

The Liquify filter is one of the most powerful functions of Photoshop—it allows you to modify photos in a truly magical way. In this tutorial I’ll show you how to use Liquify in Photoshop: where to find it, how to adjust its settings, and what to use it for.

How to Create a Watercolor Painting Effect in Photoshop

In today’s Photoshop tutorial I’m going to show you a clever combination of Photoshop filters that converts an image into a realistic looking watercolour painting effect. A range of built-in filters will produce the foundations of the effect, then the addition of a paper texture and some finishing touches with a watercolour Photoshop brush pack adds an extra level of realism to produce a convincing final result.

How to Create Rainy Night Scene in Photoshop

In this tutorial, you will learn how to create a rainy night scene in Photoshop, with a dark & mysterious mood. The scene is comprised of a Japanese girl wearing kimono carrying a umbrella, standing outside in a restaurant, waiting for something or someone.

How to Create a Lightning Effect in Illustrator

In the following tutorial, you’ll learn how to create a lightning text effect in Illustrator. To start, you’ll learn how to create an art brush, the background, and the main compound path.

How to Create a Geometric Triangle Pattern in Adobe Illustrator

how to create a geometric pattern using tessellating triangle shapes with a randomised colour scheme. This detailed mosaic effect is ideal for adding colourful backgrounds to your designs, or even as interesting abstract poster art. I’ll share a secret that helps to dramatically speed up the process by randomly adding colour fills to each shape automatically, and keep watching to see how this pattern can be processed to seamlessly repeat across an infinite area.

Web and design articles

Three questions to ask yourself if you’re facing a mid-career design crisis

How to make a mid-career design shift without leaving UX entirely

22 Smart Google SEO Tips for 2022

We’re back with a brand new season of Whiteboard Friday episodes for your viewing pleasure. First up: SEO expert Cyrus Shepard shares his top 22 tips for successful Google SEO in 2022. Watch to find out what to prioritize and what to look out for in the year ahead!

5 Brilliant Ways to Tackle Designer’s Block

If you are a designer and have never dealt with designer’s block, you are probably a superhero. For us mortals, designer’s block is a pretty common problem. There are occasions when we sit in front of our screen, and our creativity just evaporates.

A Deep CSS Dive Into Radial And Conic Gradients

In this article, we’ll be taking a closer look at two gradients: conic-gradient and radial-gradient. You’ll see how each one of them works in detail, what the differences and similarities are between them, how and where to use them, and some use cases for each.

Ten Tips For Aspiring Designer Beginners (Part 2)

In Part 1, Luis Ouriach shared advice he wished he had when starting out in his career. In this second and last part of this series, Luis continues sharing tips that helped him grow and become a better designer throughout the years.

What Were the Hottest Front-End Tools in 2021?

Some of these front-end tools are super-practical, while others probably only made this list due to curiosity (which I base on the number of unique clicks). And since many of the tools that make my year-end lists are pretty new, I think this is a good indicator of the kinds of front-end tools that will be popular in the coming year.

Style each list item using simple CSS

Lists are the form of data representation commonly used by all types of documents. In HTML there are two types of lists namely ordered and unordered lists. 

30 Frontend Tips

I recently posted a Twitter thread of 30 tweets on frontend development. Pieces of advice I wish I had when I started in the field over 10 years ago. This post is basically the thread verbatim, kept for posterity on this site.