Best of the web for Design and Web Development May 2019

• May 29th, 2019
• News

The 5th instalment of the year of our popular monthly roundup. If your reading our web  roundup for the very first time it is a great blog post for catching up on the highlights from the past month from design tutorials to web development articles. This roundup includes some great design tutorials from how to create a “cyber punk” effect using Photoshop to creating illustrations using illustrator. There’s also some great web development articles, which are geared more towards web developers.

This has been another great month fo  the online design/web development community. I’m really pleased with the  posts this month  you will really enjoy reading through the articles, and broadening your knowledge and expanding your expertise.

Design tutorials

How To Give Your Photos the Cyberpunk Look

Photoshop tutorial I’m going to show you some image processing techniques to achieve a Cyberpunk style visual effect within your photos. This popular art style takes inspiration from 80s nostalgia, and the neon-noir genre of movies such as Bladerunner, which feature densely populated, futuristic cities illuminated by bright neon signs and advertisements. We’ll process the original photo to give it a hyper-realistic HDR appearance, then apply heavy colour grading with hot pinks and bright blues, which are a popular aesthetic of this style. Enhancements to the neon signs, plus some subtle mist and smoke effects will then finish off the image with the stylised atmosphere of those neon-noir movies.

How to Illustrate a Cartoon Building Vector in Adobe Illustrator

Learn how to illustrate a cartoon building vector, simply by using basic geometric shapes and various Adobe Illustrator tools and functions. Get ready to make a fun, beautiful cartoon building illustration!

Create a Telescope Icon in Adobe Illustrator in 10 Easy Steps

Stars have been attracting people for centuries and we ended up inventing telescopes. In this tutorial, we’ll be creating a telescope, too! We’ll be using geometric shapes and most useful Adobe Illustrator functions to create a golden telescope icon and reach for the stars.

How to Create a Dramatic Angel Photo Manipulation in Photoshop

Today, we will be putting together a dramatic and cinematic angel photo effect using only a handful of images, so let’s get started!

How to Create a Dusty Texture From Scratch

In this tutorial, we’ll create a dusty overlay texture from scanned paper, and I will show you how to apply this texture to your image.

How to Create a Retro Vintage Badge in Adobe Photoshop

This tutorial will show you how to draw your own shapes and use layer styles to create a vintage advertising badge.

Web and Design articles

Faster smarter JavaScript debugging in Firefox DevTools

Script debugging is one of the most powerful and complex productivity features in the web developer toolbox. Done right, it empowers developers to fix bugs quickly and efficiently. So the question for us, the Firefox DevTools team, has been, are the Firefox DevTools doing it right?

How to Create an SVG Pie Chart—Code Along with Kasey (Video)

Need some help coding an SVG pie chart? Pair up with Kasey as she teaches you how to step by step.

Google Fonts Now Supports font-display!

Google Fonts are used by many websites (including Scotch.io) and up until now, we didn’t have the ability to control how we loaded the fonts.

Switching From WordPress To Hugo

WordPress is a fantastic CMS that powers a big chunk of websites out there, which all have different features. As a result, it has a pretty robust architecture that can feel a bit too complex to run a simple blog. Let’s have a look at how Hugo can help us create a blog that is simple and fast.

Introducing the first Microsoft Edge preview builds for macOS

Last month, we announced the first preview builds of the next version of Microsoft Edge for Windows 10. Today, we are pleased to announce the availability of the Microsoft Edge Canary channel for macOS. You can now install preview builds from the Microsoft Edge Insider site for your macOS or Windows 10 PC, with more Windows version support coming soon.

Making the Move from jQuery to Vue

As someone who has used jQuery for many. years and has recently become a Vue convert, I thought it would be an interesting topic to discuss the migration process of working with one to the other.