Envato https://envato.com Design & creative inspiration Fri, 07 Dec 2018 04:54:36 +0000 en-US hourly 1 https://wordpress.org/?v=4.9.8 https://assets.wordpress.envato-static.com/uploads/2016/08/cropped-favicon-32x32.png Envato https://envato.com 32 32 Learn CSS Grid Layout in a Single Video https://envato.com/blog/learn-css-grid-layout/ Thu, 06 Dec 2018 16:12:49 +0000 https://envato.com/?p=74925 Learn how to use CSS Grid Layout, a powerful tool for web designers who want to create flexible, creative layouts.

The post Learn CSS Grid Layout in a Single Video appeared first on Envato.

Learning how to use CSS Grid Layout doesn’t have to be hard. In fact, you can do it just by watching a single YouTube video.

Don’t believe me?

Try watching A Quick Introduction to CSS Grid Layout by Adi Purdila, and see how much solid information he manages to pack into 53 minutes of video instruction. By the end, you’ll be confident in using CSS Grid Layout for your next web design project.

What You’ll Learn

For a long time, web designers have been used to creating layouts with CSS by using floats. Floats, however, were never meant to be used to create grid layouts. The introduction of Flexbox was a big improvement, but it didn’t address all the layout challenges. A layout displays elements along both axes, and Flexbox is mainly a one-directional system.

Thankfully, CSS Grid Layout is gaining traction and has been adopted by all major browsers, which means you can use it in your projects today. CSS Grid Layout is the most powerful layout system currently available. It’s a two-dimensional system, and in this video, you’ll learn the basics of working with it.

See the Pen Bootstrap vs. Foundation vs. Floats vs. CSS Grid Layout by Envato Tuts+ (@tutsplus) on CodePen.

The course may be called “A Quick Introduction to CSS Grid Layout”, but it’s actually very long and detailed compared with most of what you’ll find on this topic on YouTube.

CSS Grid Layout example on CodePen

You’ll get a full introduction to what CSS Grid Layout is, how it works, and some of the terminology you’ll need to know. Then you’ll see how to create a grid container and define rows and columns.

CSS Grid Layout example on CodePen

You’ll also see how to place elements on the grid and build useful layouts for your websites. The video also covers the all-important topic of browser support, so you can see how well CSS Grid Layout is supported by major browsers.

Start Using CSS Grid Layout Today!

CSS Grid Layout is a powerful tool for web designers who want to create flexible, creative layouts. This single video will take you through everything you need to know to get started using it.

CSS Grid Layout explained

So set aside an hour or so to get up to speed, either by watching the video above or by clicking through to watch A Quick Introduction to CSS Grid Layout over on YouTube.

And if you want to take things to the next level, try the more advanced courses, Beyond the Basics: CSS Grid Layout and Breaking the Grid With CSS Grid Layout.

The post Learn CSS Grid Layout in a Single Video appeared first on Envato.

Master These Awesome New Skills in December 2018 https://envato.com/blog/best-online-design-courses/ Wed, 28 Nov 2018 18:30:48 +0000 https://envato.com/?p=55304 Why not learn a new skill in December? Get inspired with these fantastic new courses and tutorials.

The post Master These Awesome New Skills in December 2018 appeared first on Envato.

The year’s almost coming to an end, but that doesn’t mean that you can’t pick up some new skills. While everyone else is indulging in holiday-season madness, you can be smart and get a head start on your New Year’s resolutions.

To get you inspired and give you some ideas, here’s a roundup of some great courses and tutorials on graphic design, web design, coding, photography, and business. Many of these resources are free, and others are included in a subscription to Envato Elements. So there’s nothing stopping you from picking up a valuable new skill this month.

From learning Adobe Rush to animating SVGs, there’s something here for everyone. Let’s get started!

1. Design a Winning Project Proposal

How to Design a Project Proposal in Adobe InDesign

When you’re putting together a proposal, the design really matters. Your prospective client will probably have dozens of other proposals to look through, and grabbing their attention with a clean, elegant design will give you a crucial advantage. This course teaches you how to stand out from the crowd by putting together a great proposal in InDesign.

2. Learn CSS Animation

Who uses Flash these days? CSS3 gives you so many great animations while providing a seamless experience for users. This free video course lets you build your CSS animation skills by completing six small but useful projects that use CSS animations. Take the free course now.

3. Build a WordPress Website With Elementor

If you don’t know code, you can still build your own website easily. Just use WordPress and a special builder plugin like Elementor. In this tutorial, Adi Purdila walks you through how to get set up, so you can quickly go from zero to a functioning website—with no coding skills required. Get started here.

4. Edit Video With Adobe Rush

Adobe Rush

When Adobe comes out with a new app, it’s worth paying attention. While the company isn’t flawless, it does have a great track record at producing software that becomes the new industry standard. So take the time to have a look at Adobe’s new video editing app, Adobe Rush. Follow this tutorial to see how it works and get up and running quickly.

5. Make Interactive JavaScript Maps

Interactive JavaScript Maps With Leaflet

Maps are everywhere on the web, but how many interactive ones do you see? Learn how to make your maps stand out with interactive features in this fascinating course by Craig Campbell. You’ll use the powerful Leaflet framework to create a map and add a range of shapes, markers, click events, and more. Take the course.

6. Draw a Peacock

How to draw a peacock

If you’re anything like me, you take one look at an image like this and think, “I could never draw that!” But Monika Zagrobelna’s instructions are so detailed and simple that you may just have a chance of reproducing it—or at least getting close. See how it’s done.

7. Use MongoDB Stitch in Android Apps

How to Use MongoDB Stitch in Android Apps

MongoDB Stitch is a powerful serverless platform that can meet all your back-end requirements. This tutorial takes you through every step required to use the platform in an Android app. Read the tutorial to find out how it works.

8. Animate SVGs

Animated SVG

We all know about animated GIFs, but did you know that animated SVGs are a great alternative? You can even use them for things other than cute cat memes. Find out how to animate SVGs in this amazing tutorial by Adi Purdila.

9. Use Custom Post Types in WordPress

How to Use Custom Post Types in WordPress

WordPress has so much flexibility built in, but many people never use it. For example, most people stick with the default post type, but you can create your own custom post types to include data that’s useful for your own website, saving you a lot of time. See how to use WordPress custom post types.

10. Peer Into the Future of Graphic Design

2019 graphic design trends

OK, this last one is not a skill, exactly, but if you want to be a designer, it’s essential to keep up to date with trends in the industry. This article takes a peek into 2019 to predict what’s coming for designers. Read Grace Fussell’s predictions for 2019 design trends and see if you agree.

Want to Learn More?

If these new courses and tutorials aren’t enough for you, check out the full Envato Tuts+ library of more than 1,100 courses and 26,000 free tutorials. There’s sure to be something there for you. Have a look at these recommendations from previous months to get some more inspiration.

Create a Split Image Poster in Adobe Photoshop

Split image poster

Isn’t this a striking poster? I love the combination of shapes and colours, and the way the image in the center is split into full-colour and black-and-white segments. It looks complex, but in this free tutorial, Laura Keung teaches you to create this poster step by step in Photoshop. Read the instructions.

Edit Video the Right Way in Adobe Premiere Pro

Time for a free YouTube course now. That’s right, you can find a lot more on YouTube than cute cat videos. This comprehensive three-hour video takes you through the nuts and bolts of editing video in Adobe Premiere Pro. It starts with the basics of getting set up and importing your footage, and then it takes you through the whole editing process, right through to the final stage of exporting your finished video. Set aside some time to watch the video, or bookmark it to watch later.

Go Further With Figma

Figma online course

Figma is an incredibly versatile app for designing user interfaces, and it’s quickly becoming a favorite tool for UI and UX designers worldwide. This course helps you learn some of the more advanced aspects of working with it, such as styles and team libraries. So watch Beyond the Basics: Figma to get up to speed. Or try A Guide to Prototyping in Figma for a practical guide to using the software for prototyping.

Make Your Site Accessible for Keyboard-Only Users

Navigating quick links in the Tuts+ footer with the Tab key

Here’s the problem: most web interfaces are designed with mouse cursors and touch interaction in mind, but many users rely on the keyboard to navigate. This tutorial teaches you the important skill of designing for keyboard accessibility. You’ll learn some great techniques for assisting keyboard users and making your sites accessible to a broader audience. Read the full tutorial here.

Create a Scary “La Llorona” Photo Manipulation

La Llorona photo manipulation

With the terrifying trailer for the new horror movie The Curse of La Llorona generating quite a bit of buzz, why not take inspiration from the movie—and the original Mexican folk tale—by creating a “La Llorona” illustration of your own? The best part is that it’s easy to do in Photoshop, thanks to this free step-by-step tutorial by Abbey Esparza. Learn to create the image here. They should definitely have used this for the movie poster!

Build a Real-Time Applause Feature

Pusher real-time applause feature

You know those features on sites like Medium.com that let you recognise a post by clicking the “applause” icon and seeing the number of claps increase in real time? With this tutorial, you can create that feature for your own app, using Angular and Pusher. Get the instructions and source code here.

Master Affinity Designer

Here’s another comprehensive YouTube course for you. This one is 2 hours 45 minutes long, and it takes you through using the Affinity Designer app in all the detail you could possibly need. If you want to get started with this popular alternative to Adobe Illustrator, all you need to do is watch this video.

Test Your Site for Accessibility

Accessibility test screenshot

Yes, another accessibility post! Why? Because it’s an important subject that’s been neglected for too long. Envato Tuts+ Web Design just devoted a whole week to it—read more here. This post is about testing your site, and what better way to do that than by discovering how we actually do it an Envato? Get the inside scoop from Envato developer Luke Jones.

Create PHP Forms

Coding a PHP form

Forms are not the most exciting aspect of a website, but they’re one of the most important. They let visitors contact you, give feedback, and interact with the site in lots of other ways. This course shows you how to create functional forms in PHP. As a bonus, you’ll get to learn and practise some useful PHP skills too! Take the course!

Write a Letter in the Right Format

Writing a formal letter

We cover a lot of technology topics on Envato Tuts+, so let’s finish with something more old school. You may not need to write many formal letters these days, but you’ll have to do it at some point. And chances are that when you do need to write a letter, it will be important to get it right. Think about a cover letter for an important proposal or an invitation to a prestigious event. Getting the details right is very important, so get the full lowdown here.

Discover a Brand New Design Program

Affinity Publisher magazine layout

Affinity Publisher is still in beta testing before its official launch, but it promises to be a fabulous alternative to Adobe InDesign. So why not take it for a test drive by downloading a free trial version and following the steps in this tutorial to create a stylish magazine layout. Get started now!

Make a Professional Resume

Are you tired of your job? Looking for a new challenge? If you want to start 2019 in a more rewarding role, you’ll need to start the process now. This free video course takes you through the process of creating a professional resume to kick-start your job hunt in just ten minutes. Just watch the video above, or check it out on YouTube.

Design Your eCommerce Website in Adobe XD

If you need to design an eCommerce site, this tutorial will teach you everything you need to know to get started with an effective prototype in Adobe XD. You’ll get full instructions on how to create the prototype and how to master some key features of the software. Learn more here.

Learn to Use CSS Grid Layout

CSS Grid Layout

If you’re still using floats or Flexbox to create grid layouts in your web design projects, there’s a better way. It’s called CSS Grid Layout, and you can learn all about it in this one-hour course. Take the course to master the most powerful layout system currently available.

Create a Hand-Lettered T-Shirt Design

Hand Lettering T-Shirt Design

This tutorial is two for the price of one. You get to learn some amazing hand lettering techniques, and you also learn to create a striking T-shirt design in Photoshop, complete with a realistic mockup. Oh, and the tutorial is free, so it’s really two for the price of none. But that doesn’t sound so good… Anyway, start learning here!

Create Advanced 3D Web Animations

3D Animation with Three.js

Three.js is a powerful JavaScript animation framework, and in this course you’ll learn some amazing techniques for animating complex scenes in Three.js. Take the course to take your animation skills to the next level.

Weave Some Keynote Magic

Keynote Magic Move feature

Do you know how to use the power of the “Magic Move” feature in Apple’s Keynote presentation software? It’s a great way to give your presentations a distinctive, professional look by incorporating some slick animated transitions. Learn how it works in this quick video tutorial.

Create an Email Template—The Easy Way

Email template

Email templates aren’t easy to create because they often rely on complex table-based structures. In this course, you’ll learn an easy way to create a beautiful email template by customizing a premade starter template from Envato Elements. Find out how it’s done.

Troubleshoot Your Web Apps With Raygun APM

Raygun APM

We’ve covered a lot of design topics, so here’s one for the developers out there. In this tutorial, you’ll see how to monitor the performance of your web apps, identify problem areas, and figure out solutions. It’s all done using the Raygun APM dashboard, and you can get the details in the full tutorial.

Learn Adobe Illustrator From Start to Finish

Illustrator for Beginners course

This course is a comprehensive guide for complete beginners to Adobe Illustrator. It starts with zero assumed knowledge and in over three hours of video lessons, it takes you up to the point where you can create finished illustrations using the Pen Tool, the Curvature Tool, brushes, and more. Take the course to go from zero to competent illustrator in a few hours!

Create a Back-to-School Icon

Back to school icon

Since it’s back to school time, let’s start by creating a simple icon to mark the event. Do kids still use rulers and calculators these days, or are they doing everything on their smart watches? In any case, the symbols are very recognisable, and you’ll also learn a lot about creating any type of icon in Affinity Designer. Take the free tutorial to get started.

Design a Corporate Website the Easy Way

UI kits in Sketch

When you need to design a corporate website, there’s no sense starting from scratch. Instead, you can give yourself a solid head start by using a UI kit. This in-depth course will teach you what a UI kit is and how to use one to design a corporate website using Sketch. Find out more.

Create a Seamless Real-Time Experience in Web & Mobile Apps


Channels by Pusher

Users now expect the same real-time experience across web and mobile apps. Delivering that just got a whole lot easier thanks to this comprehensive series of free tutorials on Pusher and its Channels platform, which allows you to give your users a seamless real-time experience across multiple channels. Browse through the series to get up to speed with this powerful technology.

Create an Awesome Portrait on Your iPad

Punk portrait in Procreate

Can you believe that this stunning portrait was created on an iPad? And can you imagine creating it yourself with step-by-step instructions? That’s exactly what you’ll get in this tutorial. So view the instructions and start using your iPad for something other than Netflix!

5. Watch the Sketch vs. Adobe XD Face-Off!

Sketch and Adobe XD are both useful programs for web designers, but which is better? What are the pros and cons of each, and how can you decide which one to use? Find out in this video.

Make Some Creepy Halloween Images

Halloween cat photo effect

Frankly, the scariest part of this tutorial for me was its claim that Halloween is already approaching. Can’t we stay at the beach a little longer? But I have to admit that some of the photo effects you learn how to create in this tutorial are very creepy and impressive. So if you want to get spook-ready well in advance, follow this tutorial.

Make a Flyer

Make a flyer

Ah, that’s more like it! A summer music festival, beaches and palm trees… You can really feel the summer vibe in this flyer design. So if you’re not ready for creepy Halloween cats just yet, stave off autumn with this fun flyer design project in Photoshop. As usual, you’ll learn loads of useful skills along the way. So sign up for the course now!

Code With Swift on the Server

Server-side Swift

Swift is well known as the programming language you use to develop apps for the iPhone and other Apple devices. But did you know that it’s now a server language too? In this tutorial, you’ll learn what server-side Swift is and why you would want to have Swift on your back end. You’ll also see how to get started with the Kitura, Vapor, and Perfect frameworks. Get started with server-side Swift!

Design a Book Cover

How to design a book cover

People used to dream of having their book published one day. Now, with services like Amazon and CreateSpace, it’s easy to skip the dreaming and go straight to the publishing. But as you’ll see if you browse any online bookstore, getting the cover right is easier said than done. So take this book cover design course to learn how to create a professional-looking book cover that will entice new readers to buy and read your book.

Use an Image as a Base for Your Web Design Project

Image used for web design

In web design as in other creative endeavours, getting started is often the hardest part. How do you find inspiration to get beyond that blank page? This video tutorial introduces an interesting concept: using an image as the base for a web design project. It shows you how to pick a good image, pull it into Adobe XD, and use it to create your colour scheme. From there, you can build out the whole site much more easily than you would have been able to with nothing but white space to look at. Watch the video to see how it works.

Create Your Own Smartphone Mockup

Smartphone Mockup

Envato just launched a new partnership with Placeit, which makes it easy to create photo-realistic mockups with no design skills at all. But if you want to create a mockup the old-school way, with smart objects and smart filters in Photoshop, then read this tutorial for the full lowdown on how to do it.

Make Your Own WordPress Plugins

WordPress call to action plugin

Often, the best way to learn something new is by rolling up your sleeves and doing it. And if you have the right guide, you can even get the practical experience without having to waste time on missteps. That’s what this course offers: you get to create a series of practical call-to-action WordPress plugins, with expert guidance to help you through the whole process from start to finish. Take the course to get started right away.

Be Popular in China

Baidu screenshot

Making it big in China is every website owner’s dream. But making it happen is more complicated than you might think. The SEO practices that you’ve followed with Google in mind just won’t cut it in China. Read this in-depth China SEO guide to learn about everything from on-page optimisation to business licenses.

Go Offline

Going Offline

No, I’m not talking about unplugging and going to the beach (although that’s not a bad idea). I’m talking about making your website available even when people have bad internet connections. An offline website? How is that even possible? With the magic of service workers. Learn about them in our new short course, or read an in-depth eBook if you prefer.

Brush Up on Photoshop Brushes

I included this course not just for its pun potential, but also because it’s a really useful guide to getting the most out of Photoshop brushes. If you do any kind of art, design or other creative work in Photoshop, you need to watch this video. Oh, did I mention it’s a free course? That’s another good reason to watch it.

Build Your Own Music Player

Vuetify music player

Well, this is just cool. I don’t know much about Vue.js, let alone Vuetify.js, but I love the idea of building my own music player. If you do too, and if you know a little bit more about progressive JavaScript frameworks than I do, you’ll love this tutorial. What are you waiting for? Get started already.

Photoshop Your Own Sci-Fi Scene

Scifi photo manipulation

This amazing sci-fi scene looks impossible to create, but this tutorial makes it easy. All you need to do is download some images and textures, and then follow the step-by-step instructions on how to put them all together and make the necessary adjustments. Find out how it’s done.

Make a Landing Page—the Easy Way

Landing page example

If you need to get a landing page up and running quickly and easily, there’s no need to reinvent the wheel. Just pick a professionally designed landing page template, customise it to meet your needs, and focus your time and energy on the important part: making the page successfully convert. Take this short course to find out how to go from zero to a professional landing page in no time.

Make Kinetic Typography in PowerPoint

Even if you don’t know what kinetic typography is, I bet you’ve seen it. Think about those slick text effects you see on presentations or videos, where text comes together in smooth animations. Well, instead of reading my description, it’s probably better just to watch the video. It only takes 60 seconds, and you’ll not only see what kinetic typography is, but learn how to create it too!

Get People to Register for Your Webinar

Webinar registration page

Webinars are a great way to build your audience by giving people valuable information. Do it right, and you can convert casual visitors into engaged followers and future customers. But first, you have to get people to sign up. This article gives some great tips on creating an effective registration page that will give you a full set of attendees every time, and it links to some useful resources for building the page. Read the article to find out how.

Design in Memphis Style

Memphis Style
Do you like bold colours and playful design elements? Then you’ll love the Memphis Style, created in the 1980s and now back in vogue. From three of our recent tutorials, you can learn what the Memphis Style is, and then make a text effect and a poster in Memphis Style.

Master Variable Fonts

Variable fonts

If you do any work with web typography, you need to learn about variable fonts. They’re a fantastic new development that lets you get much more creative with typography than you ever could before—while also reducing your font load time. Get up and running with variable fonts in our comprehensive new course.

Make a Competitive Premium WordPress Theme

Make a competitive WordPress theme

We’ve all seen them, haven’t we? Those WordPress theme authors who rake in thousands of dollars from a single popular theme. How do they do it? You’ll get some great tips in this tutorial. Generally, articles only tackle one aspect of theme development: business strategy, technical quality, or marketing. This one covers all three. Read the tutorial to help you create the next hit WordPress theme.

Customize a Logo Sting in Adobe After Effects

Logo stings are those cool animated logo effects that you often see at the start of videos. They’re a great way to communicate your brand in a stylish way that even jaded YouTube viewers will remember. In this course, you’ll learn to create a complex logo sting the easy way, by downloading an awesome template and customising it. For a limited time, the Projection Mapping logo sting template is available for free for you to follow this course and learn. Simply create an account on Elements and then download it for free.

Make a Professional Invoice

Professional invoice

I’ve been a freelancer for over a decade now, so I know the importance of getting paid on time. Even if you do all the creative stuff well, you still need to handle the invoicing properly so that your clients pay you before your bills are due. This quick, ten-minute course will help you create a professional invoice in either Microsoft Word or Adobe Photoshop. Watch the course now.

Go Further With Gutenberg Blocks in WordPress

Extending Gutenberg blocks

If you work with WordPress, you probably know that a major overhaul of the classic post and page editor is coming soon. Although many articles present it as a problem (how do you get ready for it, how do you make sure your themes are compatible, etc.), it’s actually a great opportunity to offer a whole range of new functions to your theme and plugin users. Read this tutorial in our Gutenberg series to learn about extending custom Gutenberg blocks. Or take our new in-depth course, Coding Blocks for WordPress Gutenberg.

Make Great Landscape Photographs With Your Smartphone

Smartphone landscape photograph

Smartphones are great for casual photography, but can they really compete with digital SLR cameras for shooting landscapes? The answer, as you’ll see in this tutorial, is a resounding yes. You’ll learn some tips and tricks that will take your landscape photography to the next level, with nothing more than the phone in your pocket (although a tripod and access to Photoshop will also help!). Get started here.

Learn Node.js From Scratch

Nodejs from scratch

What do you mean, you don’t know Node.js? It’s a massively popular open-source, cross-platform JavaScript runtime environment that will take your JavaScript development to the next level. If you’re a Node.js beginner (or a more experienced developer who needs a refresher), this two-hour introductory course is perfect for you. It’ll take you through Node.js concepts from the ground up, while introducing you to some great tools for Node.js developers. Take the course here.

Create a Rainbow Pride Text Effect 

Pride text effect

We ran various tutorials to celebrate Pride Month in June, including this great little piece on creating a rainbow text effect. It doesn’t matter that June has now ended—any time of year is a great time to show your pride or solidarity. Plus you’ll pick up some great Adobe InDesign skills if you follow along. Get the step-by-step instructions.

Go Live!

Live screencast

Live streaming can be a great way to boost your online profile, connect with your fans and followers, and reach out to a new audience. But it can also be completely terrifying. In this tutorial, you’ll learn why you should do live streaming or screencasting, and you’ll pick up some great tips on how to do it, from the tools and equipment you need to the techniques that will help it go smoothly. Find out more.

Create Custom Blocks in WordPress Gutenberg

If you use WordPress, you’ve probably heard all about Gutenberg, an entirely new editing experience coming to WordPress later this year. Most of the articles so far have focused on adapting to it and dealing with issues, but what I like about this tutorial is that it focuses on the opportunities Gutenberg offers. Specifically, it shows you how to create your own custom version of a block—the drag-and-drop unit that Gutenberg is built around. With custom blocks, you can offer truly unique experiences in your themes and plugins. Find out how.

Learn Photoshop From the Ground Up

We often focus on new technologies in these posts, but sometimes it’s good to get a refresher on something that’s been around a long time. This comprehensive three-hour video-based course treats Photoshop as if it’s a new piece of software, introducing it to you from start to finish, with no prior knowledge assumed. This is a perfect way for beginners to master Photoshop, whether you’re a designer, photographer, marketer, or hobbyist. Take the course to learn about layers, adjustments, masking, Smart Objects, and a whole lot more.

Code an Image Gallery Android App With Picasso

If you’re creating a mobile app, you’ll probably need to load images at some point. This tutorial teaches you how to do it quickly and easily with Picasso, a popular open-source Android library for loading both local and remote images. It gives you an introduction to what Picasso is and why you should use it, and then it takes you step by step through the process of using it to create an image gallery app. Get the full instructions and source code here.

Make a Website Using a Responsive WordPress Theme

If you’re a small business owner or freelancer who wants to set up a professional-looking website quickly and easily, this short course is perfect. You get to see the full process of creating a site using a premium WordPress theme. You’ll install and activate the theme, configure the options, and then create the home page, menu and hours page, contact page, and so on. Take the course to get started.

Think Like a Designer

When you hear the phrase “design thinking”, what comes to mind? Maybe putting good design and aesthetics at the centre of whatever you’re working on? That’s not a bad definition, but this tutorial argues for something different. Design thinking is about seeing everything from the customer’s point of view and designing everything with a view to what the customer needs and wants. Read the full tutorial to learn more about how it works and what the implications are for designers.

Use Regular Expressions in JavaScript

The most exciting tutorials are usually the ones where you build something. This isn’t one of those. There isn’t even a good preview image to show. It’s very much about the nuts and bolts of code, and yet those nuts and bolts are very useful indeed. With regular expressions, you can manipulate strings of data in pretty much any way you want, allowing you to find matches, replace parts of the string, and much more. Read this beginner’s guide to get an idea of what’s possible.

Make Extra Income From Side Gigs

Are you a designer? Do you want to make some extra money? If you answered “Yes” to both those questions, then this tutorial is for you. In it, you’ll learn about ten different ways of using your talent to bring in income from side gigs. Teaching, writing, consulting, merchandising, and more—these ideas will get you thinking about new possibilities for your design career. Read about all ten side gigs here.

Create a Porg

We couldn’t let May the 4th go by without a Star Wars tutorial, could we? And what better choice this year than those cute, fluffy porgs? This is actually a two-part tutorial. First, you can learn how to draw a porg by slowly adding simple shapes and then shading. Then you can take that drawing and create a beautiful vector illustration in Affinity Designer.

Break the Grid With CSS Grid Layout

Traditional grid-based layouts have a lot of advantages, but you also end up with a lot of websites that look pretty reminiscent of other websites. If you want to make an impression, try breaking the grid. This course shows you exactly how to do it using the CSS Grid Layout model. Learn the full process with video instructions here.

Animate an Explosion!

Boom! The explosion effect above looks complicated to create, but it’s actually quite simple to build it using the Toon Boom software. You’ll get the step-by-step instructions in this tutorial, and you can use the skills you develop to build all kinds of different animations. Read the tutorial to get started.

Get to Grips With WordPress Gutenberg

If you use WordPress to create or update websites, you’ve probably heard about a massive change that’s coming soon. The update, codenamed Gutenberg, will change the way you create and edit posts and pages—probably for the better, but with some major adjustment required. Take the course to see how it will work.

Also check out these helpful Gutenberg articles:

Draw a Puppy

Who doesn’t love puppies? Just look at how cute and chubby that little guy is. But seriously, there’s more reason to take this tutorial than just the cuteness factor. You’ll also see how to break down a fairly complex thing like a puppy into simple ovals and lines so that you can draw it easily. Read the instructions here.

Create Double Exposure Effects in Adobe Photoshop

Double exposure effects, where multiple images are blended together, can be very visually powerful. But there’s more to creating them than simply slapping one photo on top of another. This course takes you through three separate examples to give you a comprehensive understanding of the dos and don’ts of double exposures. Take the course to discover how it’s done.

Create Accessible WordPress Themes

Accessibility is crucial when designing WordPress themes in 2018. But how do you ensure your theme is fully accessible to everyone? This tutorial guides you through the essential steps, from using semantic HTML to checking for color contrast and avoiding repetitive link text and more. Read the tutorial to get up to speed.

Master the New Bootstrap 4 Grid System

Bootstrap is an incredibly popular framework for building websites, and the new version 4 comes with a lot of changes. One of the biggest is a complete revamp of the grid system. Take the course to learn all about the changes and practise using the new system.

Do Better Market Research With Focus Groups

No matter what industry you’re in, knowing what your customers want is a pretty essential part of staying in business. You’ve probably heard of focus groups and how big companies use them to decide which variant of a product will work better. But did you know that small firms can use them to? Do you know how to set one up and use it effectively? If not, read the tutorial to find out.

Get the Most Out of Medium Telephoto Photography Lenses

Sometimes, having the right piece of gear can make a real difference to the quality of the images you produce. But with such a wide array of cameras and lenses out there, it can be tough to know where to start. This video tutorial breaks it all down for you, showing you the benefits of a medium telephoto lens and how to get the most out of it. Watch the video to get clued in.

Upgrade to Java 8 for Android App Development

The technology updates seem to be coming thick and fast. Along with Gutenberg and Bootstrap 4, there’s also Java 8 to look out for. Although Java 8 has actually been around for a few years now, Android app developers couldn’t use it until recently. However, in version 3.0, Android Studio started supporting Java 8, and this short course shows you how to add Java 8 to your Android Studio projects and upgrade your code to take advantage of all its new features. Take the course to prepare for the upgrade.

Create a Cute Spring Illustration

No drawing skills required! You can construct this cute illustration using simple shapes and tools in Adobe Illustrator. Get the full step-by-step instructions to see how it’s done.

Design Better User Experiences for Global Audiences

Creating an engaging user experience (UX) is hard enough anyway, and it gets even tougher when you have to consider the different cultural contexts of people around the world. This short tutorial introduces you to some important best practices. It’s also worth reading up on what dark UI patterns are and why you should avoid them.

Create a Photorealistic Digital Painting in SketchBook Pro

Fruit? Really? Yes—there’s a good reason why painters have honed their skills for centuries on this classic still life subject. Fruit gives you a variety of colours and textures to work with, and its various surfaces reflect light in different ways. This tutorial takes you through the whole process in detail, using techniques from 3D modelling to make the end result look incredibly realistic. By the end, you’ll be ready to use the same techniques to paint any subject you want. Follow all the steps here.

Create a Small Business Branding Package the Fast Way

If you’re a small business owner or freelancer who wants to create professional branding materials quickly and efficiently, this quick ten-minute course is for you. You’ll learn how to select appropriate templates from Envato Elements and bring them together to form a cohesive brand identity that instantly builds customer trust. Take the course now.

Manage Storage on Your iOS Device

Does this sound familiar? You buy a phone or tablet, it comes with a ridiculous amount of storage that you’re sure you’ll never end up using. Then, within no time, you get messages popping up saying the device is full. This tutorial takes you through some useful steps to avoid that problem for iOS devices by freeing up space and using storage more efficiently for common problem areas like photos and music. Learn those iOS storage secrets here.

Learn PHP for WordPress

For me, the attraction of WordPress is that it lets you build sophisticated websites without having to understand PHP, the underlying programming language it’s built with. You can bolt together themes and plugins, tinker around with a few settings, and you’re good to go! But, of course, if you want to go to a deeper level of customization or become a WordPress developer, you will need to learn PHP eventually. This course is a great introduction, letting you take your first steps with PHP in the familiar environment of WordPress. No more flaking out and using the Customizer—go ahead and take the red pill to see what’s really happening under the hood.

Overcome Your Cognitive Biases and Design Better Websites

If you want to be a great web designer, you probably think you need to learn all the latest CSS and JavaScript tricks and master the latest frameworks. While all of that is useful, you’ll also need to do something more important and often more difficult: know your own cognitive biases and work to overcome them. This fascinating tutorial digs into some of the weird biases lurking in our brains and shows how they can affect your work as a web designer. Read the tutorial to learn about your biases and master them so you can design better websites.

Code a React App With GraphQL

Often, the best way to learn something is to get your hands dirty with a practical example. In this course, you’ll be building a trip-planning app for the Finnish public transport system. Along the way, you’ll learn how to seamlessly retrieve and integrate live server data into your app, while structuring your queries, accessing real-time data, and handling errors. You’ll also get to know the quickest route from Mäkkylä to Espoonlahti. Take the course to start building and learning today.

Create a Shatter Effect in Photoshop

A shatter effect is a powerful visual metaphor that you can use in a range of designs to illustrate progress, change, or breaking through boundaries. This tutorial shows you how to create the effect easily in Photoshop, starting with a stock image and creating a special “shatter brush” to let you apply the effect, before making all the necessary adjustments so that it looks realistic. Get the full instructions here.

Create a Weight Tracker App With Cloud Firestore

Cloud Firestore is an easy, secure way to store your Android app’s data in the cloud. This tutorial shows you how to use it to create a simple weight tracker app. You’ll learn how to set up user authentication and a basic user interface to make a fully functioning app in a surprisingly short amount of time. See how it’s done.

Animate a Rubber Hose Character in Cinema 4D

The simple, fluid “rubber hose” style of animation is a great way to learn the basics of animation without worrying about the detailed anatomy of your characters. And although the characters are often simple, their movements can look very realistic. This course shows you how to animate a rubber hose character in Cinema 4D, giving you a perfect introduction to 3D animation along the way. Take the course now.

Create a Truly Terrifying Photo Manipulation

Too often, things like this get published around Halloween, but I think we should be able to scare the bejesus out of each other all year round. As well as being nightmare-inducing, this photo manipulation project is a great way to learn about techniques like using colour grading to add atmosphere and mood to a scene. Read the tutorial to start assembling this scene step by step.


Build a WordPress Portfolio Site in 1 Hour

A portfolio website is a must for people in all kinds of different industries. It lets you pull together your work and show it off in a visually engaging way. This course shows you how to create a portfolio site the easy way, using WordPress and a pre-designed portfolio theme. Take the course to build a great-looking site in just an hour.

Create a Surreal Portrait in Photoshop

Some designs are so striking that you just think, “Wow, I could never create that.” Well, I do, anyway. But this tutorial breaks the whole process down into easily manageable steps. If you’ve got a copy of Photoshop and some time available, you can work your way through this and create a stunning photo manipulation with a stitching effect. Get the full set of instructions.

Build a React Component

Are you up for a challenge? This post sets you the challenge of building a React component for displaying a Twitter avatar, and then you can either work on it by yourself or watch the video to see how it’s done. Take the challenge here.

Brush Up on Your Illustrator Skills

Adobe Illustrator is one of those programs that you can use for years without discovering all its features. This course takes you through 10 essential design tips to help you get the most out of Illustrator and bring your creative ideas to life. Take the course to discover all 10 tips.

Get Up to Date on SEO

Search Engine Optimisation (SEO) is one of those subjects that changes all the time. That’s why Envato Tuts+ publishes annual reports on The State of SEO. Check out the latest SEO report for 2018 to discover the ins and outs of AJAX crawling, artificial intelligence and more.

Create an Online Store With Shopify

If you want to set up an online store or monetise an existing site, Shopify is a popular solution. This course makes it easy for you to get up and running with your own online store. Take the course to watch 12 detailed video lessons that will take you from zero to a functioning store in no time. Bonus: the sample store you’ll be creating is a pet store, so plenty of scope for cute dog photos!

Replace a Laptop With an iPad

Haven’t we all dreamed of leaving the laptop behind and going for the simplicity and comfort of an iPad? For “power users” like professional graphic designers and coders, this may not be practical, but for many of us, an iPad can now handle most if not all of the tasks we use our computers for. So if you’re ready to slim down, read this article for details of how to make the switch successfully.

Learn Vue.js

Vue is a progressive framework for building user interfaces using HTML and JavaScript. In this short course aimed at designers, you will learn the basics of pulling data into your web pages using Vue’s simple templating syntax. Take the course now.

Master Lightroom’s New Dehaze Tool

Take a close look at the image above. The left half is how the photo originally looked, and the right half has had the Dehaze tool applied to it in Adobe Lightroom CC. As you can see, it’s a powerful tool, and this tutorial teaches you exactly how to use it. Read the tutorial to get up to speed.

Create a Modern Restaurant Website

What I like about this tutorial is that it goes beyond the technical aspects of building a website to deal with the whole process, from defining your target audience through the design of the site and then marketing and content creation. While some of the tips are specific to restaurant websites, others could be applied to a range of other business websites. Read the article here.


Learn to Design for Colour-Blind People

Colour blindness test

If we’re putting something out into the world in the year 2018, it really should be accessible to everyone. What I like about this tutorial is that it explains in lots of scientific detail what colour blindness is and how things look to people with different kinds of colour blindness, and then it goes on to give tips on what you can do to make your designs easier for everyone to view. Read the tutorial to learn how to tell protanopia from deuteranomaly and cater for people with either of them.

Switch From Font Icons to SVG

SVG icon

Icon fonts are popular among web designers, and for good reason. But did you know that SVG can sometimes be a better choice for handling icons? Take the course to find out why you should consider using SVG for icons and to learn the practical steps for switching from icon fonts to SVG.

Make an Unbounce Landing Page

Landing page example

A well-designed landing page can make a huge difference to your website, enabling you to steer visitors clearly towards the action you want them to take, whether that’s signing up for your mailing list or buying your latest product. Luckily, Unbounce makes it easy to create the landing page you want, and this tutorial shows you exactly how to do it. Start creating your landing page now.

Create an Artistic Collage in Photoshop

Collage in Photoshop

Feeling creative? This next tutorial is perfect for anyone who wants to experiment with new artistic techniques while picking up some tips on Adobe Photoshop and Lightroom too. Juxtapose jarring images and symbols, mix in some bright colours, and create a striking result. Get the step-by-step instructions here.

Build a CMS With Laravel

Build a CMS With Laravel

Or for a very different kind of creativity, why not learn to build your very own content management system? This is a really comprehensive course that includes 23 video lessons with a total viewing time of over four hours. It’s recently been updated with brand new lessons to take advantage of the latest features in Laravel 5, so why not take this comprehensive course and learn pretty much everything there is to know about creating a CMS with Laravel.

Colour Correct Video in Adobe Premiere

How to Color Correct Video in Adobe Premiere

Don’t you just hate it when you shoot video that looks perfect in every way—except that the colour balance is off? Problems with tone, white balance and other colour settings are common when shooting video, and they can ruin the end result. So watch this free video to get instructions on salvaging your work by adjusting the colour in Adobe Premiere.

Create Cool Text Styles With SVG

SVG text styles

Remember that earlier I was extolling the virtues of SVG for fonts? Well, it turns out that you can create some pretty amazing text effects with it too. Bubble bevel, anyone? Chunky metal? Or how about a neon light effect? Take the course to complete five practical projects that will teach you a whole lot about using SVG to manipulate text.

Create a “Celebration” Illustration

Champagne celebration illustration

The holiday season may be over, but hopefully there’ll still be plenty of reasons to celebrate in the year to come. So why not celebrate with this elegant champagne illustration? What I like about it is that it’s built using just basic shapes, tools and effects in Adobe Illustrator—no drawing skills required! Find out how to do it.

Build Your Own Web App With Flask

Build a Web App With the Flask Microframework for Python

Sometimes, the best way to learn is by getting your hands dirty and doing something. Flask is a popular microframework for creating web apps in the Python language, and this course teaches you how to use it to build your very own file-based wiki app. Watch the free preview to find out more.

Write a Great Motivational Speech

Motivational speech

Whether you see yourself pacing around the stage at TED or simply want to deliver a compelling speech at work or school, this tutorial is packed with tips to help you put together a killer motivational speech. Read the tutorial to learn not only how to engage your audience, but how to inspire them.


Master Photo Manipulation Techniques

Egyptian goddess photo manipulation

The great thing about photo manipulation is that if, like me, you can’t draw to save your life, you can still create some amazing scenes like the one above, just by merging photos together and applying some effects. There’s a bit more to it than that, of course, but this tutorial breaks it all down into easy steps. So why not learn photo manipulation today?

Make a Professional Resume in 10 Minutes

Resume building in Photoshop

Along with making New Year’s resolutions, another popular activity at this time of year is making a new career move. If you need to update your resume to propel you towards that dream job in 2018, this short course is for you. Building on a professional template from Envato Elements, you’ll learn how to create a resume that is clean, targeted, and highlights your skills and abilities. Take the course to give your career a boost this month.

Learn Natural Language Processing (NLP) in iOS 11

NLP tweet analyzing app

Machine learning is a hot topic right now, and it’s only going to get more important as time goes on and the possibilities and capabilities of the technology multiply. This tutorial will help you surf the crest of the wave by introducing you to natural language processing, a key element of machine learning. Essentially, it’s the means by which computers understand human speech—not just grasping the basic meaning, but doing complex things like analysing sentiment and pulling out key information. Read the tutorial to find out more about how it works and to get some practice using it in iOS 11.

Take Better Photos by Knowing the Sun’s Position

Calculate the sun's position with SunCalc

We’ve all seen great photos ruined by the sun being in the wrong place—usually right behind our beautiful subject, making it into a silhouette shorn of all its details. Of course, the sun is never really in the “wrong place” at all. It moves predictably around the sky, and there will be a time of day—or a different season—in which you can get the shot you want. Read the tutorial to find out how you can use a simple web app to plan your photography shoots with the sun in mind.

Design a Mobile UI in Sketch

Mobile UI design in Sketch

Sketch is a powerful digital design application, and it’s perfectly suited to those who design user interfaces for web or mobile apps. In this course, you’ll learn how to create a mobile UI design in Sketch, working from an initial wireframe all the way through to a completed design.

Make a Climate Change Infographic

Climate Change Infographic in Adobe InDesign

Here’s an idea for the New Year: do something to help future generations have a habitable planet on which to make and break their own resolutions. An infographic is a great way to communicate complex information and statistics in an engaging way, and this tutorial teaches you how to create one in Adobe InDesign. Find out how it’s done.

Build a Branding Package the Easy Way

Making a Facebook cover

Branding is a powerful tool for building a company’s reputation—some of the major world brands are worth billions of dollars. Having a consistent and professional branding package across print and web can really help set a business apart from its competitors. This course teaches you how to create this package on a budget by using Envato Elements and Affinity Designer. You’ll produce a logo, branding colors, a customized website, a business card, a Facebook cover design, and more. Get started here.

Create an Android Music Player App With Anko

Create a Music Player App With Anko

Anko is a Kotlin library that makes it easier to build Android apps. What better way to learn it than by getting your hands dirty building a music player app that can automatically pick and play random songs from the user’s device? It’s quite a complex app, but the tutorial makes it easy to understand. Get the full instructions and code.

Design for Visual Impairment

Example of an accessibility browser plugin being used to change the contrast of a web page

If you have a website or do any kind of design work for the web, you should be conscious of how to design sites that everyone can view easily—including the millions of people with color blindness, low vision, blindness, or other visual impairments. If you’re not, or if you need a refresher, then read this accessibility tutorial to make sure you’re not inadvertently excluding potential visitors and customers through simple but common design flaws.

Learn the Fundamentals of JavaScript

JavaScript fundamentals

There are lots of JavaScript tutorials and courses out there on the web, but many of them deal with a particular aspect of the language and assume some pre-existing general knowledge. It’s quite rare to find a systematic guide that teaches you the language from the ground up. This JavaScript Fundamentals course does exactly that. It starts with the basic concepts and builds slowly over the course of 7 hours and 61 separate lessons to teach you more complex topics and show you how to use JavaScript in practice. If you want to code for the web, you need a solid understanding of JavaScript, and this course is perfect. Take the course to start learning today!


Create Your Own Color Font

Make a color font

In case you haven’t heard the news yet, color fonts are shaping up to be one of the hottest design trends of 2018. This tutorial teaches you how to create your very own color font using the latest version of Adobe Illustrator and the powerful Fontself extension. So why not learn this important new design skill?

Learn Gravit Designer

Gravit Designer

Speaking of new skills, have you tried Gravit Designer yet? It’s a completely free vector application that was launched earlier this year. It’s available in the browser as well as on Linux, Mac, ChromeOS and Windows, making it arguably the most accessible application of its type in the world. Learn how to use it in this thorough introductory course.

Build a Slack Bot With Python

Slack Bot with Python

If you do any kind of online collaboration, you’ve probably come across Slack. It’s used by over 50,000 companies—and yep, Envato is one of those. This tutorial shows you the code and takes you through all the steps to build your own unique integration with Slack, using Python for the logic. Learn the steps here.

Master PowerPoint Templates

Use PPT templates

We all know that a presentation looks smarter and more coherent when we use a well-designed template, don’t we? But getting the most out of a PowerPoint template is another story. This in-depth video course shows you how to create a polished presentation from start to finish, using the popular X Note template as an example. So take the course and move your presentations to the next level.

Speed Up Your Design Process With Studio


More new design software for you to learn. Studio is a free online UI design tool, ideal for web designers or anyone else designing for digital products. Watch the video to get up to speed with Studio quickly and easily.

Stabilise Your Video Footage

Stabilise video

Have you ever taken some great video footage, only to find that it is too shaky to be usable? Unless you use a tripod or have the steady hands of a neurosurgeon, the answer is probably yes. Luckily, Apple’s Final Cut Pro X has stabilization processing built in. Find out how to stabilise your video footage in this video tutorial.

Understand Basic Typography

Typography terms

Any designer will tell you that typography is crucial to good design. From company brands to newspaper headlines to advertisements to websites, you can see the power of typography in action everywhere. But, like any specialised field, typography has its own vocabulary, which can be confusing for beginners. Watch this 60-second typography video to learn how to tell your counters from your spines and your stems from your shoulders.

Type International Characters More Quickly

International characters

If you often switch between different languages (or if you just enjoy using words like “smörgåsbord”), you’ve probably encountered the annoying situation of taking ages to type a letter with an accent that’s not included on your standard keyboard. On a Mac, of course, you can hold down the key and see a range of common accents, but that can still take a while. There’s a better way, involving automation apps. Learn the shortcuts here.

Design Icons With Adobe XD

Adobe XD icon design

In the wake of Black Friday, Cyber Monday and all of the associated consumer frenzy, you may well be sick of 2 for 1 deals. But this course offers genuine value, by allowing you both to brush up your icon design skills and to learn Adobe XD at the same time. Take the course to get instructions on using Adobe XD to design a range of useful icons.

Learn to Code Securely in Swift 4

Secure coding in Swift

If you want to create apps for Apple devices from watches to iPhones, Swift is the programming language to use. With version 4 only released a few months ago, now is the perfect time to get up to speed with secure coding in Swift 4. Read the in-depth tutorial to learn about concurrency, race conditions, Grand Central Dispatch, and more.

Master PHP

Fundamentals of PHP

Take a look at your favourite website. There’s a good chance that it was built with PHP. This powerful programming language created a big proportion of the web, and it’s easy to learn and easy to use for writing web applications. In this comprehensive, seven-hour video course, you’ll learn all the fundamentals of PHP, from the basics of using variables and writing loops and functions up to coding classes for simple object-oriented programming (OOP). Along the way, you’ll learn all the most important skills for writing apps for the web. Take the course to get started building your own web applications.

Create an Inspirational Photo Grid for Instagram

Photo grid for Instagram

You’ve probably seen them before—those grids of beautiful photos, often accompanied by an inspirational message. This tutorial shows you how to create them yourself, either in Photoshop or with a simple grid-building app. It’s quite easy, and the results can be impressive. So why not give it a try?

Draw a Mandala

Draw a mandala

This tutorial hits the trifecta—you can learn a new skill, explore your creativity, and relax at the same time! What’s not to like? Drawing a mandala can be very therapeutic, and although it looks complex, it’s actually quite simple to do. So learn all the steps and start sharpening your drawing skills while relaxing your mind.

Use Gulp to Speed Up Your Web Design Work

Using Gulp for Web Design

If you’re a web designer, you’ll want to learn about Gulp, a simple JavaScript task runner that can really speed up your work and save you a lot of time. Take this in-depth course to discover what Gulp is, how it works, and how you can set up some super-efficient workflows for handling CSS files, JavaScript files, images, and more.

Pay Tribute to a Hitchcock Classic

Vertigo movie poster tribute

I love old movie posters from the 1950s and 60s. The tools available to designers back then were so much simpler, but there were no limits to their creativity, and some of the results were just fantastic. In this tutorial, you’ll learn how to create a movie poster paying tribute to the classic Vertigo poster designed by Saul Bass. You’ll learn a lot about Adobe InDesign along the way, while also doing some Photoshop and Illustrator work. So get started on this wonderful project, and upload your own version in the comments for others to take a look at.

Confront the Command Line


If you use a Mac, you’ve probably come across the “Terminal” icon, and if you’re like me, you’ve probably ignored it. But the Terminal gives you unfettered access to the deeper reaches of your Mac via the command line (if you remember MS-DOS, think of that classic C:\> prompt and the commands you used to enter). You can do some pretty useful things that just aren’t possible with the usual graphic interface (such as “caffeinating” your Mac). So take this beginners’ tutorial to discover some nifty examples and get started using the command line.

Design a Landing Page With Adobe XD

Adobe XD landing page

It’s still quite early days for Adobe XD, Adobe’s user experience design software, which only came out of beta a few weeks ago. So why not be one of the early adopters? This course shows you how to use Adobe XD to wireframe and design a landing page from start to finish. Take the course and build your skills in this useful application.

Create a Spirit Day Text Effect

Create a Spirit Day text effect

Envato Tuts+ ran quite a few tutorials and articles last month to mark Spirit Day. Although the day has now passed, this tutorial will still teach you some useful skills for creating text effects in Adobe Illustrator. Plus you’ll be prepared for next year’s event, which will probably come around again sooner than you expect! Find out how to create the effect.

Childproof Your iPad

Childproof your iPad

Those newspaper stories about kids running up huge credit-card bills on their parents’ iPads are fun, aren’t they? But they’re probably not so much fun for the parents involved. If you have kids or know someone who has kids, there’s a high chance that your beloved iPad will fall into their hands one day. So take this tutorial and find out how to protect your iPad from damage (both internal and external), as well as protecting kids from coming across bad stuff on the internet.

Learn the Kotlin Programming Language

Kotlin fundamentals

Kotlin is a new programming language for coding Android apps, and it’s way more concise and secure than traditional languages like Java. This course teaches you everything you need to know to get started coding in Kotlin, from the basics of getting set up and writing your first code right through to advanced features like lambdas, higher-order functions, and using Java and Kotlin together in the same app. Take the course and add a powerful new language to your toolkit.

Learn Creative Typography

Creative Typography course

Think of creative designs, and maybe you think of a creative use of images, shapes, and colour. But you can do a lot with plain old letters, and this course shows you how. You get to play with typography and develop your creativity as you create a concept-driven typographic artwork. Take the course to give your creativity a boost this month.

Turn Your Cat Into a Zombie

Zombie cat

Yes, Halloween is coming around again, and that can mean only one thing: it’s time to turn your cat into a zombie. In fact, this tutorial shows you how to turn any portrait, whether human or animal, into a terrifying, dead-eyed, blood-spattered zombie. Even if you hate Halloween as much as I do, you’ll still pick up some useful Photoshop techniques in this one. So take the zombie-making tutorial and see how it’s done.

Beef Up Your WordPress Security

WordPress security tips

If, like me, you run a WordPress site, you probably alternate between feeling good about the number of websites that use your chosen platform (currently 28% of the web and rising) and feeling worried about the constant security threats. Take this short course to learn the key steps you should take to make your WordPress site much more secure.

Create an Android App That Recognizes Images

Image recognition app

OK, the simple app created here doesn’t look as good as the zombie cat, does it? Fair enough. But once you’ve learned the skill of incorporating image recognition into an Android app, there are so many possibilities for more complex apps. This tutorial shows you how to use machine learning to recognize the content of images with the IBM Watson Visual Recognition service. Get the step-by-step instructions and code samples here.

Draw a Monkey

Draw a monkey

Drawing tutorials can be frustrating—they sometimes seem to be written for people who already know how to draw. But this tutorial is truly for beginners, and it breaks the whole process down into simple shapes like ovals, curves, and crosses. It’s a great way of learning to draw, and it may just help you see the structures behind objects so that you can draw things other than monkeys. Read the full instructions.

Optimize Your Website Without AMP

Optimize a Website without AMP

Google’s AMP is awesome! It’s a great way of optimizing your website with simple plug-and-play code. Why would you want to optimize a site without it? Well, actually there are several reasons, and you’ll learn more about them in this course. You’ll also learn exactly how to convert an existing AMP-based site to use non-AMP equivalents, helping you to make your site blazing fast while keeping total control. Take the course to find out more.

Make a Professional Business Card in 10 Steps

Design a business card in Adobe Indesign

Lots of people just use generic business cards, but if you really want to make an impression, it’s much better to do it yourself. You get a chance to showcase your creativity while ensuring your business card sticks out from the crowd. It doesn’t have to be complicated either—this tutorial shows you how to create a great-looking business card from scratch in Adobe InDesign in just ten steps. Find out how.

Create a Job Board Website With WordPress

job board website

A job board is a great type of website to build for any industry or niche—it allows you to provide really useful information (everybody likes to be able to find job opportunities), and your traffic and referrals can grow fast. This tutorial shows you how to create one using a WordPress theme and some simple customisation, with no coding skills required. Start creating your job board website here.

Use Swift Design Patterns

Swift design patterns

In the world of coding, design patterns are incredibly useful ways of solving common problems that arise in development. But they can be abstract and hard to grasp for beginners, and you can end up struggling to tell your factory from your facade. This comprehensive, 24-video, 3.5-hour course will set it all straight, with detailed explanations and examples of how each pattern can be used in the Swift programming language. Take the course here.

Create a Plastic Jelly Style

Plastic jelly style

Wait, doesn’t that style look a bit dated? More 2007 than 2017? Yes, well spotted! This last tutorial is a bit of a nostalgia trip. Tuts+ turned 10 years old in September, and to celebrate, we decided to recreate the very first tutorial on the site, by Envato founder Collis Ta’eed, but this time using up-to-date techniques in the latest version of Adobe Creative Suite. So step back in time with us, and start making plastic jelly like it’s 2007!

Create an Android Instant App Feature

How to Create an Instant App Feature

If you’re not up to speed with Android’s new Instant Apps feature yet, this tutorial is ideal for you. Instant Apps let people load entire sections of your app on demand, just by tapping a URL and without having to download the full app. This gives you a great opportunity to get your app in front of as many new users as possible. Learn how to create an Android instant app feature here.

Create a Modern Business Card Using Adobe Photoshop

Create a business card in Photoshop

Yes, we do live in a world of social media and online connections, but a good printed business card is still as important to today’s freelancer or business owner as it was to Don Draper in Mad Men. Learn how to create your own professional business card design in this step-by-step Photoshop tutorial.

Use Linux for Web Design

Linux for Web Design

If you’re a web designer, your choices are not limited to macOS or Windows. You can also work very effectively in Linux, and in fact there are some real advantages to doing so. Take the course to find out all about using Linux for web design.

Improve Your Email Open Rates

Increase email open rates

No matter what kind of work you do, I’m willing to bet that you send emails, and that you want people to open them. This tutorial shows you 10 simple steps you can take to improve your email open rates. Who knew that the way you capitalise your subject line can make more people open the email? I didn’t, but the data suggests it’s true. Read the tutorial to discover all 10 email tips.

Create an AI-Powered Chatbot

Create a chatbot

Artificial intelligence is here—and I’m not talking about those dumb social media algorithms that collect masses of data on you and yet still can’t arrange your feed in the right order. I’m talking about chatbots that can hold increasingly realistic conversations with us. In this tutorial, you’ll learn how to create a simple conversational chatbot using the IBM Watson Conversation service. The best part, for me, is the way it serves up inspirational quotes. Get the step-by-step instructions here.

Learn About HDR Photography in 60 Seconds

What is HDR photography?

Sometimes you just don’t have a lot of time to spend learning something new. But everyone can spare a minute, can’t they? That’s the idea behind the Tuts+ 60-second videos—you learn a new skill or technique in just one minute. In this one, you’ll get an introduction to HDR photography. Watch the 60-second video here.

Create a Surreal Photo Manipulation

Surreal photo manipulation

What do you get if you take a photo of the sky, put it in Photoshop, and add photos of a cat, a wall, some trees and a bunch of fish on top? The result, for most of us, will be an amateurish mess. But with the techniques covered in this tutorial, you’ll get the bizarre, impossible and yet weirdly realistic scene shown above. Click here to learn how it’s done.

Learn React Through 5 Practical Examples

Five Practical Examples to Learn React

React is one of the most popular web frameworks, and if you want to learn to use it, what better way than through some practical examples? In this course, you’ll build a digital clock, an Ajax-powered navbar and more, and in the process you’ll learn all the basics of coding React components from JSX and managing state right through to higher-order components and lifecycle methods. Sign up for the course.

Understand How the WordPress Loop Works

The WordPress Loop

If you’ve been working with WordPress for any length of time, you’ve probably heard about the Loop. But do you really understand what it is and how to use it? This short, ten-minute Coffee Break Course will get you fully up to speed. Start learning about the WordPress Loop.

Create Your Own Stress Cave

Stress Cave

It’s great to learn new technologies and computer skills, but it’s no use having these skills if you’re too unproductive to use them. In a busy work day, it’s easy to get derailed by stress and its close companion, procrastination. So read this quick productivity tip to learn how to take a step back into the stress cave and take some simple steps to help you see the right way forward.

Create a Haunting Photo Manipulation

Surreal photo manipulation scene

Photo manipulation is a wonderful way to create whole new worlds from your imagination, without needing to draw or paint anything yourself. In this tutorial, you learn how to take seven different photos and blend them together into one weirdly haunting scene. Get the step-by-step instructions here.

Animate Icons!

Create animated icons

Sometimes good design is eye-catching, but other times it’s almost unnoticeable. A well-designed icon may not win any great plaudits, but it’s one of the little details that adds up to a better user experience for your website, app, game, presentation, etc. So why not take things to the next level by adding animation. Take the short video-based course for full instructions on creating icons in Adobe Illustrator and then animating them in After Effects.

Draw Hair in 4 Different Styles

How to Draw Hair

Did you know that the average human head has about 100,000 individual hairs? What that means is that if you want to draw someone’s hair, you can’t draw separate lines for each strand—you need to learn some tricks to create the illusion of 100,000 hairs while using far fewer lines. Take this drawing tutorial to see how it’s done.

Get Up and Running With Sketch

Sketch course

Most of these design tutorials and courses use Adobe software because it’s so popular and offers so many features. But Adobe is not the only game in town. Take this comprehensive, 17-part video course to get up and running with Sketch, a powerful digital design application that’s great for icon design, web design, and more.

Learn the Quick Way to Create Professional Logos

Create a logo kit

Have you ever had one of those annoying clients who demands double the work in half the time? Of course you have. Here’s a trick for icon designers: have a few flexible logo kits ready to customise so that you can meet even the tightest deadline. Take this short course to learn how to create the three building blocks of a successful logo kit.

Paint “Love” in Sign Language

Love in sign language

OK, I’ll be honest—I’m mostly just including this one because I love the end result. But it does also teach some really useful digital painting skills. Look at the dramatic lighting and the realistic textures of each hand; those are some techniques you could use in a wide variety of projects. See how to create this painting from scratch.

Make an Animated GIF

Create an animated GIF

Whether you love them or hate them, animated GIFs are all over the web. This tutorial shows you an easy method of putting together an animated GIF in Adobe Photoshop. The example is of a wolf’s glowing eyes, but feel free to use the same techniques for laughing dogs, weird celebrity mashups, or whatever your heart desires. Start animating your GIFs here.

Go Back to the Nineties

Nineties flyer

The 1990s are popular again! Who knew? As far as I remember, the 1990s weren’t even popular in the 1990s. But if those headache-inducing colours and shouting fonts give you a flood of happy nostalgia, this is your chance to step back in time to the days of oversized cargo pants, overused fluorescent colours, and Hootie & the Blowfish. (Oh, and you can also learn some useful flyer design skills in Adobe InDesign.) Enter the time machine here.

Send a Ransom Note

Ransom note text effect

Well, no—don’t actually send a ransom note, OK? That would be creepy. But this tutorial does teach some useful skills to help you manipulate fonts and work with shapes and textures in Photoshop to create a realistic text effect. Take the tutorial to learn how it works.

Create a Realistic Mockup

Create a wine bottle mockup

If you’ve ever worked in product or packaging design, you know the importance of a good mockup. Clients often struggle to see the potential of a design until you show them how it will look in the real world. This final tutorial in our list teaches you to create your own wine-bottle mockup from scratch in Photoshop. Along the way, you’ll learn how to manipulate photos, create realistic shadows and reflections, add lighting, and more. Ready to get started? Click here for the full instructions.

Publish Facebook Instant Articles

Create Facebook Instant Articles

OK, it’s true that Facebook’s “Instant Articles” feature has been controversial, and you may not love the idea of having your content living on Facebook’s platform instead of your own. But the advantage is that readers get to access your articles at a lightning-fast speed, and your content fits in seamlessly with the Facebook app, making for a great user experience. And whereas at first it was only for large publishers, now it’s available for all of us. Get a step-by-step guide to publishing Instant Articles in this tutorial.

Master Affinity Designer

Learn Affinity Designer

Just when Adobe seemed to have the vector design market locked down, along came Affinity Designer a couple of years ago, winning a whole host of new admirers among web designers and graphic designers. If you haven’t tried it yet, this course is a perfect way to find out what all the fuss is about. You’ll learn Affinity Designer from the ground up—and the course was recently updated to cover new features like artboards, constraints, symbols, and some powerful new typography tools.

Use Style Guides for Accessibility

Accessibility style guide

Keeping your skills current is not just about learning new technologies. It’s also about important concepts like accessibility. Making your sites accessible to as many people as possible is not just the right thing to do; it also makes business sense. You work hard to attract visitors, so why turn some of them away because you’ve failed to make the simple changes that would allow them to view your site? I like this quick tutorial because it shows you how to create a style guide for accessibility, while also introducing you to some important accessibility concepts and techniques along the way.

Build an Onboarding Tour Using JavaScript

JavaScript onboarding tour

I don’t much like the word “onboarding”, but I do love those interactive tours that pop up when you visit a new site or app, showing you how everything works with simple boxes that you can click through (or click out of) at your own pace. This short course shows you how to build your own tour from scratch, using HTML, CSS, and vanilla JavaScript.

Design Better Logos

Logo design in Adobe Illustrator

Logo design is one of those things that may well be handled by a specialist graphic designer, but it’s always a useful skill for a web designer to possess. You’ll also get a useful rundown of the major tools, panels and features in Adobe Illustrator, which will be useful for other design tasks beyond logos.

Manipulate Colors in JavaScript


It’s good to learn new skills, but it’s even better to build something useful. This screencast ticks both of those boxes. Take a look at the demo—a neat little tool that lets you select a starting color and have a tasteful color scheme generated for you. You’ll learn how to create that yourself, using the Chroma.js library.

Get Hands-On Practice With the CSS Flexbox Model

Flexbox slider

Flexbox is a relatively new layout mode in CSS3, and as the name suggests, it can give you some wonderful flexibility in your page layouts. This popular course lets you get your hands dirty by tackling six projects designed to help you learn Flexbox thoroughly. And now it’s been updated with two more bonus projects on modals and sliders, so it’s an even better way of getting up to speed.

Work Better With Other People

Collaborate on website content

No matter how well you know the ins and outs of CSS, the reality of working as a web designer is that you’ll have to deal with other human beings at some point, and that’s when things can get so complicated that you end up yearning for the comfort of your code editor. This tutorial looks at some useful ways to get the content of a website prioritized among multiple members of a team with the least fuss.

Build Forms With CSS Grid

CSS Grid form

Yes, I know. Forms are not the most exciting topic in the world, are they? But the attraction of this tutorial is not the forms, but the way you create them—using the CSS Grid Layout Module, another quite recent addition to the web designer’s arsenal. It shows you how to create a form the “traditional” way, using floats, and then how to achieve the same end result using CSS Grid.

Get a Refresher on the Basics

Web design pointers

With so much new stuff to learn, sometimes it’s valuable to go back to basics and make sure you’ve still got a solid grasp of the essentials. Or maybe you’re just getting started and want to avoid some of the most common mistakes. Either way, these 10 simple design pointers from Tuts+ Web Design Editor Ian Yates will help you make sure you’re on the right track.

Keep Your Mac Efficient and Well Maintained

Mac maintenance

Have you ever taken your Mac to an Apple store and seen the “genius” running a diagnostic test on your computer? This post shows you how to run that test yourself and interpret the results, as well as checking the health of your hard drive—all without the help of a lanyard-wearing hipster genius.

Design a Vintage Music Festival Flyer

Music festival flyer

Here in the northern hemisphere, summer is just around the corner, and festival season will soon be in full swing. I love the summer colours and the vintage VW campervan in this design—but more importantly, the tutorial teaches you some great skills in Adobe InDesign, Photoshop and Illustrator. If you’re shivering in the southern hemisphere right now, just think of this one as forward planning.

Add MailChimp Signup to Your WordPress Site

MailChimp WordPress form

Some Tuts+ courses are several hours long and cover lots of ground, but this one is very short (just six minutes) and very simple. It teaches you something that sounds straightforward but can cause headaches if it’s not done right—how to add a MailChimp signup form to your WordPress site. In six minutes, you can get your site fully set up to start gathering email subscribers. Not bad, huh?

Know When to Fly Your Drone

When to fly your drone

I love watching aerial video footage. There’s something so calming and majestic about seeing the world from the perspective of a bird. In this video tutorial, you can learn about the best times of day to fly your drone for filming purposes (and in a companion tutorial, you can learn about the pros and cons of different weather conditions). I’m sure it’s all useful information, but I like the tutorials purely for the eye candy.

Make an Explainer Video

Explainer video

Have you noticed that explainer videos are everywhere? And they all have the same annoyingly cheery music? In this tutorial, you’ll learn how to put together a good explainer video for your company or personal site. My one gripe is that it’s a written tutorial—being a fan of recursion, I’d have preferred an explainer video on how to make explainer videos. But it’s still a good post. Check it out.

Convert a Photo Into a Charcoal Drawing

Charcoal drawing Photoshop action

Charcoal drawings look amazing, but creating them involves both getting your hands dirty and spending years on the painstaking and often frustrating process of learning to draw. This video shows you how to skip both of these steps and just create a cool charcoal drawing from any photo with a simple Photoshop action.

Create a Split-Screen Slider With JavaScript

Splitscreen slider

I love the split-screen effect here—as you drag your mouse across an image, a line splits the screen and it changes from colour to duotone. Try the demo at the top of the tutorial to see how it works! Then you can learn the process of creating it, with both a screencast and written instructions to make it easy to understand.

Design Buttons, Textures and Icons for Video Games

Design game UI assets

The thing about what video-game designers call “UI assets” (and the rest of us call “buttons, icons and stuff”) is that, if they’re designed well, you probably don’t even notice them. But if they look clunky, they can ruin the gaming experience. This course teaches you how to design them well. Plus the aesthetic reminds me of playing The Secret of Monkey Island as a child. Remember Guybrush Threepwood, anyone?


Record Vocals Like a Professional

Record vocals

Want to be the next Lana Del Rey or Justin Bieber? Or maybe you even have some more up-to-date cultural references. In any case, this tutorial will teach you everything you need to know to record professional vocals using just your computer and some simple equipment. Then you’ll be well on your way to YouTube stardom—all you need to do next is….

Make a YouTube Banner

YouTube banner

Even with the most professionally recorded vocals, some of your potential fans may be put off if your YouTube banner looks as if it was designed by a hyperactive child with unsupervised access to Microsoft Paint. This tutorial teaches you to put together a simple banner for a YouTube channel using stock images and basic tools in Adobe Photoshop.

Draw a Skull

Draw a skull

Macabre? Perhaps. But what I like about this tutorial is that you can produce a great end result even if you have zero drawing skill (yes, that would be me!). Monika Zagrobelna breaks the whole process down into such simple steps that you really can’t go wrong. If you can draw lines and circles and have access to a pencil, you can draw a convincing human skull.

Tell Your “em” From Your “rem”

em and rem

If you’ve even dabbled in web design, you’ve probably come across the “em” and “rem” units of measurement. But what are they? What’s the difference, and when might you want to use each one? This one-hour course will get you crystal clear.

Solve Android’s Most Common Error Messages

Android error messages

Stumped by a ClassCastException? Tearing your hair out over a missing R.layout.main? Wondering who in Android-land thought that “Only the Original Thread That Created a View Hierarchy Can Touch Its Views” would be a helpful error message to give to human beings? This article demystifies 13 of the most common error messages to plague Android developers.

Hit Inbox Zero

Inbox Zero

I’ve saved the best for last. While we may love to be able to draw, paint, create apps or become a YouTube star, I think a lot of us would settle for an empty email inbox. This tutorial will teach you how to reach the “You have no messages” promised land. You can also grab a free eBook for more detailed email mastery tips.

There’s More…

This post has just skimmed the surface of what Tuts+ has published recently, and in the full archives going back ten years, there’s even more. So if you don’t see what you’re looking for in this post, you can search the full Tuts+ library of more than 1,100 courses and 26,000 tutorials to find exactly what you need.

The post Master These Awesome New Skills in December 2018 appeared first on Envato.

Learn Advanced Audio Processing for Video in Our Free YouTube Course https://envato.com/blog/audio-processing-for-video/ Mon, 26 Nov 2018 22:17:29 +0000 https://envato.com/?p=74550 Learn advanced techniques in audio processing for video in this free video course.

The post Learn Advanced Audio Processing for Video in Our Free YouTube Course appeared first on Envato.

Professional video production isn’t just about the footage you shoot; the quality of the audio is just as important. But audio processing for video can be a tricky process. Luckily for you, we’ve just published a comprehensive 3.5-hour course, which you can watch completely free on YouTube: Advanced Audio Processing for Video.

What You’ll Learn

This course teaches you everything you need to know about audio processing for video. You’ll learn how to edit, process, mix, and master audio for your video projects.

You’ll learn how to use essential audio plugins like EQs, compressors, gates, expanders, and de-essers.

Audio processing for video: equalization

You’ll learn how to clean up dialog tracks by fixing noise, reverb, and mouth clicks.

Audio processing for video: noise reduction

Finally, you will learn how to use some mastering plugins like compressors and limiters to keep your audio levels and tone in check.

Audio processing for video: compression effect

By the end of this course, you will have the skills you need to be able to tackle the audio portion of your projects like a pro!

Learn Audio Processing for Video Today!

With this detailed video, you’ll be all set to go from audio novice to processing pro. Just make some time in your schedule and watch the video above—or click through to watch Advanced Audio Processing for Video on YouTube.

Advanced Audio Processing for Video

And as a bonus, did you know that an Envato Elements subscription now includes audio? Take a look at the selection of over 7,000 high-quality royalty-free music tracks and 75,000 useful sound effects to find one you can use in your next project. Or read more of our audio articles.

The post Learn Advanced Audio Processing for Video in Our Free YouTube Course appeared first on Envato.

Cyber Monday: Get 50% Off on Selected Templates, Add Ons and Presentations https://envato.com/blog/cyber-monday-get-50-off-on-selected-templates-add-ons-and-presentations/ Tue, 20 Nov 2018 05:16:53 +0000 https://envato.com/?p=74018 Cyber Monday is just around the corner and we’re celebrating early with a massive week of discounts! Starting today, and running until the 27th November, we’re offering 50% off specially selected items in our sale. Yup! You heard that right: 50% off. So if you’re looking for the best selection of Instagram and Facebook ad […]

The post Cyber Monday: Get 50% Off on Selected Templates, Add Ons and Presentations appeared first on Envato.

Cyber Monday is just around the corner and we’re celebrating early with a massive week of discounts! Starting today, and running until the 27th November, we’re offering 50% off specially selected items in our sale. Yup! You heard that right: 50% off.

So if you’re looking for the best selection of Instagram and Facebook ad templates, fabulous Adobe Photoshop actions, cutting-edge PowerPoint presentation templates, amazing mockups and so much more, look no further than these 17 best-selling items for designers that you can now pick up at an incredible saving.

Cyber Monday Graphic Templates Blog

1. Simplicity 2.0

When it comes to well-designed PowerPoint presentations, Simplicity 2.0 certainly is ahead of the pack. One of the bestsellers in this category, Simplicity 2.0 is a multipurpose presentation template that features a clean, modern design that is extremely easy to customise. The package contains 120 presentations, hundreds of unique slides in 16:9, 16:10. 4:3 and A4 page formats, and 15 colour themes. Once you’ve selected your presentation, all you need to do is drag-and-drop your own photos, change the text, and you’re ready to go. For those who want to do a bit more customisation, a help manual is available.

2. Concept Art Photoshop Action

Turn your photos into beautiful works of art with Concept Art Photoshop Action. Just highlight the area of your photo where you want the action to take effect, press play, and watch as your photo takes on a painterly appearance. You can customise every aspect of the action to increase or decrease the effect, and 10 colour effects are also provided to help add a more individual feel to each of your creations. A fun action that will save you loads of time if you’re looking to transform your photos into digital paintings.


3. 321 Instagram Promotional Bundle

A terrific set of templates for anyone designing Instagram banners, the 321 Instagram Promotional Bundle contains an eclectic mix of 421 Adobe Photoshop designs with creative and unique layouts. Each template’s layered PSD files are easy to customise so that whether you’re designing sales announcements, special offers, launching a new product or promoting a business, you’ll be able to get the job done quickly and easily.


4. Corporate Business Brochure

Need help designing a business brochure? Look no further than the Corporate Business Brochure template. This beautiful 16-page template comes in A4 or letter size and has a clean, modern design that will appeal to the most discerning of clients. The template, which is editable in Adobe InDesign, can be customised as required or used as is. All you need to do is add the company logo, photos and text, change the colours to reflect the company’s brand, and you have a finished item ready for print or to be turned into a PDF.


5. Guardian Photoshop Action

Add some drama and artistry to your photos with the Guardian Photoshop Action, a great action for sports and action shots. All you need to do is highlight the subject of your photograph, and play the action to transform your photos from ordinary to WOW! You can customise the action to increase or decrease the effect, and a ‘How-To’ file is provided in case you get lost.


6. Web Showcase Mockup

If you’re looking for a great way to show off a website you’ve designed, check out Web Showcase Mockup. This very stylish package allows you to use screenshots from a website, app and/or mock-ups you’ve made and display them in an attractive and innovative way that’s sure to impress your clients every time. The package contains three PSD files and a PDF help file to help you on your way.


7. 15 PRO Landscape and Nature Lightroom presets

Bring a fresh and exciting look to your photos with these 15 PRO Landscape and Nature Lightroom Presets. The package contains 21 presets that will allow you to warm up, cool down and/or intensify the colours in your images in various ways. Compatible with Lightroom 4 and above, the presets are designed to use with RAW, DNG and JPG photo files.


8. Male T-Shirt Mockups

Get your t-shirt design business off to a great start with this Male T-Shirt Mockups package. Featuring a total of 11 high-resolution PSD mockup files, the package enables you to show off your design on the front and/or back of different coloured t-shirts worn by a male model. This will help give prospective customers a good idea of how your t-shirt will look on them and hopefully lead to more sales. The package comes with both video and text instructions to help you get things set up.

9. Urban Sketch Photoshop Action

If you love the gorgeous effect of watercolours, you’ll love the Urban Sketch Photoshop Action. This oh-so-simple action generates a variety of painterly strokes that give your photos a beautiful, hand-painted look. You can determine the degree of the watercolour effect that you want to apply to each photo, as well as modifying the colour using any of the colour presets included.


10. Business Proposal PowerPoint Template

The Business Proposal PowerPoint Template is another of our favourite PowerPoint templates. This one has more of a classic corporate style and offers an extensive range of charts, graphs, infographics, etc. In all, there are 20 colour themes with a dark and light version of each, which can all be customised to suit your brand needs.

Business Proposal PowerPoint Template

11. Magic Retouch Pro

Photo retouching is a skill that can take months if not years to master, but Magic Retouch Pro helps you apply professional-level retouching to your photos, even if you have little retouching knowledge. This incredibly useful Adobe Photoshop plugin uses sliders to make adjustments and includes a wide variety of features, including blemish removal, eye enhancement, teeth whitening, digital makeup, and more. The package is regularly updated to add new features and includes a PDF User Guide and video tutorials to help you make the best use of your purchase.


12. 550 Facebook Banner Bundle

As the biggest social networking site around at the moment, Facebook is as popular with advertisers as it is with its users. The 550 Facebook Banner Bundle aims to make your job as a designer of Facebook ads that much easier by creating a resource you can draw on again and again. With such a large number of multi-purpose templates to choose from, this pack can be used to build any kind of Facebook ad. Each template contains layered PSD files that are easy to customise. Just add the required images and text, and your ad is ready to upload.


13. 3D Photoshop Action

If you want to transform text into 3D but you don’t know where to begin, the 3D Photoshop Action has got you covered. Not only can it give your text a genuine 3D look, but it can also transform vector shape, pixel layer, smart object, and layer groups. It offers quite a lot of customisation options so that you can create your own unique look. A PDF help file is included.

3D Photoshop Action

14. Kacell

Looking for a great Keynote template? Try Kacell, a collection of over 10 templates of 170 slides each that will make your clients sit up and take notice. With its fresh, modern design, Kacell offers a good range of infographics, data charts, portfolios, team pages, price tables etc. to suit a wide variety of subject matter. The template is also very easy to customise. Just choose the best design for your project, customise the master slide to suit your needs, replace photos and text, and you’re ready to go.


15. Realistic Stationery Mock-Up Set 1

Mockup templates are a great way for designers to show off their design ideas to their best advantage, and Realistic Stationery Mock-Up Set 1 is perfect for stationery designers. The mockup comprises 5 templates created using Smart Objects in Adobe Photoshop. To use them, you simply need to place your design in the smart object and it will automatically update the mockup to show your designs translated into business cards, letterheads, envelopes, etc. A great way to impress clients with a realistic look of the final product.

Realistic Stationery Mock-Up Set 1 - Corporate ID

16. Startup Business Plan PPT Pitch Deck

Another great PowerPoint presentation, the Startup Business Plan PPT Pitch Deck is a collection of 4 different templates, each containing over 500 unique slides. Each template has a clean, contemporary feel and uses fresh icons and colours for a look that will appeal to innovative businesses. The templates are all easy to use and customise.

Startup Business Plan PPT Pitch Deck

17. Animated Glitch – Photoshop Action

Glitch effects are a cool way to add texture and interest to your designs, and Animated Glitch helps you to do so quickly and easily with a Photoshop action. When you run the Animated Glitch action on your photos, logos or artwork, the Action will generate a sequence of animated glitch effects to transform your work. You can make as many variations as you like with just a few clicks and then export the file as a normal image, animated GIF, or video.

Take Advantage of this Great Offer Today!

Remember, these unbeatable savings end on the 27th November, after that, the prices go back to normal. So head to our Cyber Monday Sale and take advantage of this offer while it lasts.

The post Cyber Monday: Get 50% Off on Selected Templates, Add Ons and Presentations appeared first on Envato.

Cyber Monday: Get 50% Off on Premium Themes and Plugins for Your Website Project https://envato.com/blog/cyber-monday-get-50-off-on-premium-themes-and-plugins-for-your-website-project/ Tue, 20 Nov 2018 05:16:21 +0000 https://envato.com/?p=73992 Cyber Monday is nearly here, and we’re celebrating early with a massive week of discounts! Starting today and continuing until the 27th November, we’re offering 50% off specially selected items in our sale. To help you with your bargain-hunting, here’s a selection of 19 useful plugins, templates, scripts and WordPress themes that are now half […]

The post Cyber Monday: Get 50% Off on Premium Themes and Plugins for Your Website Project appeared first on Envato.

Cyber Monday is nearly here, and we’re celebrating early with a massive week of discounts! Starting today and continuing until the 27th November, we’re offering 50% off specially selected items in our sale. To help you with your bargain-hunting, here’s a selection of 19 useful plugins, templates, scripts and WordPress themes that are now half price.

Cyber Monday Themes Blog 

1. Total 

If you’re a web developer looking for a multipurpose theme that you can use as a reliable base for creating websites for a wide range of clients, you need to check out Total. A polished and responsive WordPress theme, Total prides itself on bringing together the power of the WordPress Customiser and WPBakery Page Builder to enable users to build just about any website they dream of. With a long list of great plugins and features including Slider Revolution, Unlimited Portfolio and WooCommerce integration, Total is that WordPress theme that discerning web developers can’t afford to ignore.

Total - Responsive Multi-Purpose WordPress Theme

2. Essential Grid Gallery

Want to create a beautiful grid gallery for your website? Take a look at Essential Grid Gallery, an all-purpose grid building plugin for WordPress sites that allows you to display all kinds of content in a highly customisable grid. Whether you’re looking for a grid to display your photos, artwork, portfolios, services, products, blog posts, videos or something else, Essential Grid makes creating stylish grids easy. Just select the content source for your grid, select a style for your grid, select your preferred navigation, and then add the grid to any area of your WP site with a simple shortcode. Of course, the plugin also offers tons of customisation for those who have a specific look or function in mind.

3. Porto

Building an e-commerce store has never been easier than with Porto, a great package that has everything you need for your Shopify store. With several layouts and styles to choose from and over 20 beautiful demos to inspire you, it’ll be no time at all before you have your own Shopify store up and running.


4. Noor

Noor is a WordPress theme that’s getting ahead of the competition. This multi-purpose theme is Gutenberg ready and fully compatible with AMP, which guarantees a 5x faster loading speed in mobile devices. It also supports WooCommerce, WordPress Multilingual Plugin (WPML), right-to-left scripts, is SEO optimised, and much more. Aside from all this, this high-performance theme offers several beautiful, minimalist layouts and more than 300 elements and modules so that you can create just about any site you can dream of.


5. Slaido

Another really useful plugin is Slaido, a huge library of over 300 gorgeous slider templates that you can browse and select to add to your site with just one click. One of Slaido’s recent innovations was to add niche templates targeting popular industries like fashion, food, business, music, sports, etc. Obviously, any of the sliders can be adapted to any purpose, but the categories just make browsing through 300+ sliders a whole lot easier.


6. Materialize

Build your own admin template with the help of Materialize, a multipurpose Material Design admin template with a huge collection of Material Design animations, widgets, and UI elements. The template works seamlessly on all major web browsers and mobile devices, and it has a beautiful, clean design.


7. Epic News Elements

Epic News Elements takes all the work out of building a a premium news site or news page on your WordPress site. Compatible with themes that use Elementor and WPBakery Page Builder, Epic News offers more than 70 features including sliders, carousels, YouTube playlists, an advance content filter, and more.


8. WooCommerce Notification

Marketing is all about psychology, and customers are more likely to shop in a popular store than a store with no one in it. Enter the WooCommerce Notification plugin, designed to show prospective customers that your online store is busy with other customers snatching up all the great merchandise. The plugin functions by displaying recent orders in real time on your online storefront, thus showing buyer validation and showing off new products to prospective customers.

WooCommerce Notification copy

9. Bridge

One of our bestselling WordPress themes, it’s easy to see why Bridge is a perennial favourite. With 24 layouts ranging from the classic to the innovative, Bridge appeals both to the web developer who needs a solid and reliable base for building out unique websites, as well as to the do-it-yourself novice looking to build their own site. The theme provides over 376 stunning demos to get you inspired and provides a series of step-by-step video tutorials on how to install, update, and customise the theme.

Bridge - Creative Multi-Purpose WordPress Theme

10. The Grid

Discover another great WordPress plugin for showing off your portfolio, photos, videos, blog posts and any other content in grid form. The Grid is perfect for novice users who want to add the feature to a page on their site, but it’s also great for developers as there are several filters included to help you in adding new skins, animations, navigations, animations, and more.

The Grid

11. Real3D FlipBook jQuery Plugin

Create realistic 3D magazines, catalogs, brochures and flip-books with the Real3D FlipBook jQuery Plugin. Using a bit of code, this plugin works by transforming your PDFs or images into web-friendly animated files that fit into any theme and are fully customisable. You can change menu and button colours, control page flip speed, page flip sound, camera angle, and much more. Best of all, Real3D FlipBook works well on desktop and mobile platforms alike.


12. Aurum

If you’re in the market for a WooCommerce theme for your WordPress site and your taste tends towards the minimalist, Aurum might just be the site you’re looking for. With its very clean white and black aesthetic, the whole raison d’être of Aurum is to create a pared-back, uncluttered backdrop so your products can shine. Aurum offers 30 well-crafted pages to choose from and delivers all the features we’ve come to expect from a contemporary e-commerce theme.


13. Trawell

It seems lately that everyone has a bit of wanderlust and is looking to develop a travel website to tell their story or support their dream. Well, if that’s you or a client of yours, check out Trawell. This beautifully designed WordPress theme is designed with travellers in mind and creates great pages for showing off photos, stories, and whatever else you have in mind.


14. Ultimate Addons for WPBakery Page Builder

Without a doubt, WPBakery Page Builder is the go-to page builder for WordPress themes, but it’s Ultimate Addons for WPBakery Page Builder that makes the page builder really shine. With 20 updates since its inception, Ultimate Addons for WPBakery Page Builder works consistently to stay ahead of the competition and deliver a product that meets the needs of a wide range of designers. Flexibility and reliability, along with stand-out features like parallax and video backgrounds, over 40 unique elements, 15 demo pages for inspiration, and excellent video tutorials, have all earned Ultimate Addons one of the highest ratings at CodeCanyon.

Ultimate Addons for WPBakery Page Builder

15. Drag & Drop Email Template Builder for PHP

The Drag & Drop Email Template Builder for PHP helps you create your own unique email template that you can then integrate into any web project. The builder offers a wide range of elements and options to help you create one-of-a-kind templates.

Email Template Builder

16. Kastell

Kastell is another dedicated WordPress theme. This one focuses on delivering everything you need for creating property websites. Designed to showcase all kinds of properties, be it real estate, house, building complexes or business spaces, Kastell offers six homepage examples, is responsive and retina ready, and is highly customisable.


17. Fuse

Fuse is an admin template built with React and Redux that offers a number of built-in page templates, along with routing and authentication features. It includes 5 example apps, over 20 pages, and lots of reusable React components.


18. Improved Product Options for WooCommerce

If you want to attract more customers to your e-commerce page, try Improved Product Options for WooCommerce. The plugin helps you add and display extra options for products in your WooCommerce store. You can use text, HTML, images and colour to show customers product variations, keeping them engaged and exposed to more of your merchandise.

Improved Product Options for WooCommerce copy

19. TheGem

With 40 unique and flexible layouts, 150 demo pages, and eight navigation settings with over 20 styles, TheGem is a WordPress theme that certainly lives up to its name. If you find all this choice just a bit overwhelming, TheGem has organised its demos into categories like photography, business, landing page, restaurant, etc., which will make it far easier for you to focus and conceive how you could use the theme to create a great site of your own.


Don’t Miss Out

Remember, this offer ends on 27th November. After that, the prices go back to normal. So head over to our Cyber Monday Sale and take advantage of this great opportunity today.

The post Cyber Monday: Get 50% Off on Premium Themes and Plugins for Your Website Project appeared first on Envato.

Cyber Monday: Get 50% Off on Selected Music, Footage & Templates for Your Video Project https://envato.com/blog/cyber-monday-get-50-off-on-selected-music-footage-templates-for-your-video-project/ Tue, 20 Nov 2018 05:15:25 +0000 https://envato.com/?p=74016 We all know that video editing is a time-consuming process. So why not save yourself some time and take advantage of all the great pre-made templates, transitions, graphics, etc. available on the market today. Happily, we’re celebrating Cyber Monday, with an irresistible 50% off specially selected items in our sale. The sale starts today and […]

The post Cyber Monday: Get 50% Off on Selected Music, Footage & Templates for Your Video Project appeared first on Envato.

We all know that video editing is a time-consuming process. So why not save yourself some time and take advantage of all the great pre-made templates, transitions, graphics, etc. available on the market today.

Happily, we’re celebrating Cyber Monday, with an irresistible 50% off specially selected items in our sale. The sale starts today and runs all week until the 27th of November, so don’t delay! To give you a taste of the kind of great deals we have on offer, here’s a selection of 15 of the best items for videographers—all half price this week!

Cyber Monday Video Templates Blog

1. Instagram Stories

No one likes boring stories, and this Instagram Stories templates pack will take you a long way to creating stories your followers can’t wait to watch. The pack contains 30 amazing Adobe After Effects templates. All you need to do is add your own photos and/or videos, replace the text, and you’re ready to rake in the likes. If you’re a business trying to get eyes on the page, these templates will definitely do the trick.

Instagram Stories

2. Simple Infographics

Presenting statistical data in an engaging way is always a challenge. But Simple Infographics contain beautiful and professional templates that manage to do just that. The templates are created in Adobe After Effects and saved as .mogrt files, which makes it easy to integrate them into your Adobe Premiere Pro projects. Using the pre-made animated pie charts, timelines, call outs, lower thirds, social media icons, etc., is easy. Just add your data, choose your colour scheme, intro and outro duration time, opacity, and more with just a couple of clicks.

Simple Infographics

3. 10 Mosaic Logo Reveals

Want an arresting way to open up your vlog or video project? Check out 10 Mosaic Logo Reveals. Each of the 10 clips starts with a full screen image that then zooms away from the screen to become just one image in a large mosaic of other images. This mosaic then transitions in one of 10 ways to reveal your logo. The placeholder images can all be replaced with any digital elements you want: icons, photos, videos, text, etc.


4. Slideshow

If you need help creating a great promotional video, teaser or intro for your next video project, Slideshow is just the thing for you. This amazing Adobe After Effects template has a very cool, modern feel and comes in five versions of varying lengths and speeds. It’s modular in structure, which makes it easy to shorten, lengthen, or reorder segments of the template.


5. Light Leaks and Bokeh Vol 1

Give your video footage a vintage look with Light Leaks and Bokeh Vol 1. This popular pack of 15 overlays brings the feel of film to your video footage by adding light leaks, colour shifts, and bokeh. It’s very simple to use—just drop your chosen overlay over the footage you want to affect, and apply the Add or Screen blend modes. The overlays can be used alone or combined with each other in Adobe Premier Pro, Vegas Pro, Final Cut Pro, etc.

Light Leaks and Bokehs Vol 1

6. Cooking Intro

Video openers whet the viewers appetite for what’s to come and set the tone for your entire video. If you’re looking for just the right intro for a cooking show, check out Cooking Intro. This great Adobe After Effects opener also includes extras like a timer transition card, recipe card, lower thirds, and an outro. All food and appliances images are included, but of course you can replace any or all of them with your own images.

Cooking Intro

7. Book and Magazine Promo

Book and Magazine Promo is certainly a cool and impressive way to advertise a new book, launch a magazine, or show off your portfolio or photos. Just replace the placeholders with your images, add your text, and voila—you’ve got a beautiful, attention-grabbing way to present your work. A detailed video tutorial is included with the Adobe After Effects project.


8. Photo Slideshow

Photo Slideshow is a sweet and sentimental movie template created in Adobe After Effects that can be used to tell stories using photos and text. It is best suited for celebrating a wedding, anniversary, birthday, or any other event where you want to show a series of photos that tell the story of the people being honoured. The template uses filters, light leaks, and the sprocket holes from film stock to create a vintage look.

Photo Slideshow

9. Transitions

If you’re looking for a go-to collection of amazing transitions you can dip into whenever you need to add some visual interest to your video projects, you can’t go wrong with the bestseller, Transitions. With over 1,500 dynamic After Effects transitions, this package is the perfect addition to any videographer’s resource library.


10. TypoKing

TypoKing is another great addition to any videographer’s resource library. The pack offers over 500 animated titles, all of which are customisable so that they fit in with the look of your project. Once downloaded, the package uses a simple drag-and-drop installation and is compatible with both Adobe After Effects and Premier Pro. With TypoKing, you never have to rack your brain to come up with ideas of what to do with text.


11. Awards Show

For those times when you need an intro, an outro, a promo, a lower third, or a transition with a big dose of glitz and glamour, there’s Awards Show. This Adobe After Effects collection contains several elements of varying lengths, with the longer pieces being modular in structure so that you can lengthen, shorten, or move them around as needed.

Awards Show

12. Typography | FCPX & Apple Motion

If you use Final Cut Pro, you’ll be interested in this great package. Typography is an Apple Motion template featuring 40 unique text animations which would work well with a wide variety of projects, from corporate to creative. What’s more, the template also offers 40 unique animated background images that’ll add a lot of character to any creative project.


13. History Timeline Opener

History Timeline Opener is a beautifully constructed one-minute intro which uses time and history as its inspiration. It has a nostalgic vintage style and would work well as an opener for a documentary or any other project that’s focused on telling a story about past events. For example, you could use it on a corporate video for a brief recap of the company’s founding and major milestones in its history.

History Timeline Opener

14. Graphics Pack

Yet another very useful collection for every videographer’s resource library is Graphics Pack, a collection of over 750 beautifully executed graphic elements of every description. There are icons, overlays, various kinds of transitions, logo reveals, shapes, backgrounds, callouts, lower thirds, titles, infographics, typography, and so much more. A videographer’s dream.


15. Event Promo

Need help building a promotional video for an event? You can’t go wrong with Event Promo. The 50-second Adobe After Effects template features quick cuts, dynamic transitions, and lots of cool animated graphics. All you need to do is replace the placeholders with your own images and/or videos, edit the text, and add audio. The template is modular in structure, so you can easily make the changes you need to the duration. There’s also a video tutorial to get you up and running in no time.

Event Promo

Get Started Now

Remember, prices go back to normal on the 27th November, so don’t miss out. Take advantage of this great opportunity today in our Cyber Monday Sale.

The post Cyber Monday: Get 50% Off on Selected Music, Footage & Templates for Your Video Project appeared first on Envato.

Top Audio on Elements Picks: Curated by Specialists https://envato.com/blog/audio-on-elements-curated-picks/ Tue, 13 Nov 2018 01:01:14 +0000 https://envato.com/?p=73590 By now, you know that Envato Elements offers a ton of creative possibilities to bring your projects to the next level. Today, we’re delighted to announce that we’re expanding those possibilities even further. More than 80,000 audio files have today been added to Envato Elements. Included in the initial offering are royalty-free music tracks covering a […]

The post Top Audio on Elements Picks: Curated by Specialists appeared first on Envato.

By now, you know that Envato Elements offers a ton of creative possibilities to bring your projects to the next level. Today, we’re delighted to announce that we’re expanding those possibilities even further.

More than 80,000 audio files have today been added to Envato Elements. Included in the initial offering are royalty-free music tracks covering a full range of popular genres – from hip-hop and pop, to cinematic and corporate – as well as a host of sound effect files available for everything from feature films to video games.  

Still, if this makes you wonder what the absolute top royalty-free tracks in Envato Elements are, wonder no more! This post brings together the top audio picks on Elements. The best thing about this is that you don’t have to take my word for it. Real, professional audio specialists at Envato picked their favorites; so you know you can trust their selection.

royalty-free music

Royalty Free Music

First, let’s start with what makes the world go round: music. These tracks will have you grooving, feeling good, and getting emotional. Take a listen to find out the best one for your project.

Pickin’ on the Porch

To start off this list, here’s a music track that’s easygoing and cheerful. Its carefree guitar and lively piano will make you feel as if you really were sitting on the porch on a Sunday afternoon.

Ukulele Blues

For a tune that mixes jazz elements with a fun ukulele, try the ‘Ukulele Blues’. It’s sure to inject a bunch of energy and feel-good vibes for its listeners.

Late Summer Dancing

And if you feel like enjoying a late summer dancing session, this royalty-free music track will get you on your feet. It combines the rhythm of a guitar with the ease of the ukulele.

Last Chance

If you want to convey the passage of time, this dramatic tune can help you out. With a dark piano, strings, and a relentless beat, this music track will help you achieve just that.

Rise of the Dragon

As you would expect from a song called ‘Rise of the Dragon’, this song is powerful, emotional, and very dramatic, which would work great for a cinematic masterpiece.

Action Trailer

The trailer for an action movie would benefit greatly from this music track, as it has a distorted bass line, an energetic beat, and electronic elements to it.

Hybrid Cinematic Inspiration

To motivate and inspire your audience, use this ‘Hybrid Cinematic Inspiration’ music track. It will fit in nicely in an ad, a corporate video, or a cinematic trailer.

Go Go Go

‘Go Go Go’ is the perfect name for this song. It’s upbeat, joyful, and has an electrifying rhythm that will have you tapping your foot to it.

Exciting Funky Inspiration

You can never have too much funk in your life. This funky song is catchy, exciting, and has a feel-good vibe that you can definitely dance to.

Uplifting Indie Rock

If alternative indie rock is more your thing, give this royalty-free music track a listen. It has a recognizable guitar riff and dynamic drums to keep your energy up.

Purple Autumn Soft Documentary Atmosphere

To bring it back down again, this is an atmospheric, calm, beautiful tune. It’ll be the perfect background music for a stunning audiovisual project.

Cinematic Orchestra Studio Opener

Now, if you’re on a quest for an ident that is epic and has a big impact, hit ‘play’ on this ‘Cinematic Orchestra Studio Opener’.

Crystal Glitch Pretty Ident

‘Serenity’, ‘tranquility’ and ‘charm’ are some of the words that will come to mind when you hear this ident. It’s clear, crisp, and has a beautiful, soothing sound to it.

Corporate Technology Logo

If you want your audiovisual branding project to portray brighter, more upbeat and modern sensations, opt for this corporate ident track.

Soul Logo

Few things are as soulful as 70s funk. Use this music ident to introduce a happy, positive sentiment to your corporate video.

Sound Effects

Sound effects can make or break your audiovisual projects. Continue listening so you can discover royalty-free sound effects picked out by our specialists.

Epic Swish Pack

Is your multimedia project in need of aggressive air swishes and strong gusts of wind? If that’s the case, this royalty-free sound effect has you covered.

Inspirational Success

This next sound effect is ideal for any app or game. Its bright bells are also elegant and charming, which adds extra oomph to your projects.

Comical Mix

Anytime a character slips on a banana, falls or does something clumsy and silly, you’ll hear this comical royalty-free sound effect going off in the background.

Cartoon Character Voice Expressions Pack

Have a need for high-pitched cartoon voices saying things like ‘eww’, ‘hey’, and ‘great’? Look no further than this packed expressions pack that’s fun and cute.


Envato’s specialists put together this list that goes over music, idents, sound effects, and more. If you don’t find the right option here, browse through our audio library on Envato Elements or our marketplace, Envato Market.

The post Top Audio on Elements Picks: Curated by Specialists appeared first on Envato.

Learn How to Animate CSS in a Free YouTube Course https://envato.com/blog/how-to-animate-css/ Fri, 09 Nov 2018 12:44:47 +0000 https://envato.com/?p=73805 Our latest free course, 6 Handy CSS3 Animation Projects, will teach you everything you need to know about CSS animation.

The post Learn How to Animate CSS in a Free YouTube Course appeared first on Envato.

Hey, web designers! You probably already know that CSS3 gives you lots of great animation options to help you create engaging, interactive websites. But do you know all the tricks and techniques to animate CSS in the best possible way?

If not, don’t worry! Our free course, 6 Handy CSS3 Animation Projects, will teach you everything you need to know.

What You’ll Learn

Using motion in your web project and adding an extra degree of interactivity can really improve the user experience. In this short course, you’ll build six small but useful projects that use CSS animations.

For example, one of the projects helps you create an elegant SVG “Page Loading” icon made up several arcs rotating around the same point.

See the Pen Project 2: SVG Page Loader by Envato Tuts+ (@tutsplus) on CodePen.

In another project, you’ll create a card notification that slides in from the right side, stays on screen for a few seconds, and then slides back out again.

See the Pen Project 3: Card Notification by Envato Tuts+ (@tutsplus) on CodePen.

Or how about creating a full-screen navigation overlay? That’s the popular effect you’ve probably seen on mobile sites, where you click on the menu icon and a full-screen menu pops up to help you navigate easily on a small screen.

See the Pen Project 6: Full Screen Navigation Overlay by Envato Tuts+ (@tutsplus) on CodePen.

All of these animation effects are easy to create with pure CSS, so follow the course and learn how to do it!

Start to Animate CSS Today!

Creating web animations with CSS instead of JavaScript is such a useful skill for web designers. This free course gets you up and running really quickly. By the end of it, you’ll be confident in creating CSS animations for all your future projects.

So get ready to animate CSS, either by watching the video above or by clicking through to watch 6 Handy CSS3 Animation Projects over on YouTube.

The post Learn How to Animate CSS in a Free YouTube Course appeared first on Envato.

How Metallics Became Basic https://envato.com/blog/how-metallics-became-basic-and-the-golden-rule-to-avoiding-tackiness/ Thu, 08 Nov 2018 04:15:32 +0000 https://envato.com/?p=73740 Explore the usage of metallics in design and discover the ground rules for navigating the trend.

The post How Metallics Became Basic appeared first on Envato.

(And the golden rule to avoiding tackiness)

It’s become blindingly obvious. From rose-gold shoelaces to cutlery that looks like it belongs in the backside of a magical egg-laying goose, metallic colouring is back in vogue. But before we leap to turn our branding, homewares and wardrobes into oversized pieces of fishing tackle, let’s spend a moment exploring the usage and abusage of this shiny new trend and lay some ground rules for navigating its risky terrain.

close up of white and gold eggs in egg box

[Envato Elements]

The rise of shine.

It’s impossible to talk about the rise of metallic colours without exploring the obvious catalyst: the technology industry’s prominent use of them on their products. “The design language of Silicon Valley (influences) other design sectors,” says Fast Company, describing the sector’s use of metallic colours as “the ultimate sign of the times”.

Looking back at phones of the early 2000s, the attention paid to the design of gadgets like phones has gotten significantly more sophisticated. No longer are cheap, recyclable plastic frames and rubber keyboards the standard. Instead, glass and aluminium finishes are preferred, making these devices feel more like jewels than portable computers.

Far from being an afterthought, for companies like Apple the design of the device has become a central element to the business strategy. Ben Thompson, the blogger behind Stratechery, called out in 2016:

“The fact that smartphones are such an important part of people’s lives, combined with the fact that physical objects can have additional consumer benefits like status, enables Apple to sell each iPhone with a huge amount of margin.”

With metallic choices ranging from ‘Silver’ to ‘Coral’, everything about Apple’s current iPhone colour line-up seems designed to inject a status of luxury and timelessness into a product which, by design, refreshes every twelve months.

Despite this steady stream of newer models, consumers have embraced these lavish colourways, largely because the company has, for more than a decade now, gone to great pains to instill the phone’s interior with a story of cutting-edge innovation and craftsmanship. Apple is making a coherent symbolic statement; both its hardware and software are of a pristine standard.


It’s not always a silver bullet.

The etymology of the word “tacky” relates to the adhesive, sticky quality of the word “tack”. In essence it speaks to something literally stuck to something else, thoughtlessly. And with the rising prominence of metallics, not every brand’s use of the precious colourways is as thought-through as Apple’s.

A trip to a homewares store reveals a marketplace flooded by brands employing metallics to paint a facade of prestige to everyday consumer products. This tidal wave has brought with it everything from water bottles to throw pillows and even disposable birthday party supplies, all supposedly turned insta-aspirational with a simple addition of a splash of gold or bronze.

In response to the rising trend, colour empire Pantone recently unveiled a “collection of lustrous metallic and pearlescent tones” which comprise its new “metallic shimmers” range. In doing so, the number one ‘colour partner for design’ have armed many-a-brand with an arsenal of precious metallic colours with which to belie less-than-precious surfaces.

Just as it’s Pantone’s job to cater to the needs of designers, so too is it the job of a designer to use their colors responsibly.

Pantone metallic shimmers


A few Golden Rules.

So how does one leverage the precious metallic trend and avoid the inherent pitfalls of tackiness that come with it? The answer is to take a leaf from Apple’s playbook and be guided by the meanings behind the colours themselves.

All precious metallics (bronzes, silvers, and golds) are weighted with meaning; they convey with status, prestige, and scarcity. In short, they communicate quality. Furthermore, their immediate association with the raw elements of their namesakes also means they carry within them a sense of timelessness.

With this in mind, the golden rule for employing precious metallic colours is as follows: is the item you’re coloring and the message it’s sending both worthy of a precious metallic colorway?

A rose-like bronze, used sparingly, can make a festive season invitation feel special, warm and traditional. It doesn’t, however, give off the same effect on, say, a spatula. Silver can instill corporate logo with a sense of understated class. But it’s far from home on a throw pillow bearing an inspirational Pinterest quote. A drop of gold might just be the thing to give your wedding invitation a sense of luxury and distinction. But unless you intend to make a piece of satirical commentary, it’s a questionable color for the handle of a toilet brush.

It should go without saying that less is always more. That said, here I am writing this article. So remember, using metallic colors when the occasion calls for it can help a design connect with its intended audience and fit the right occasion. Using it on everything makes you look, well, kind of basic.

The post How Metallics Became Basic appeared first on Envato.

Top 10 Wedding After Effects Slideshow Templates https://envato.com/blog/top-10-wedding-after-effects-slideshow-templates/ Mon, 29 Oct 2018 00:56:13 +0000 https://envato.com/?p=73570 Slideshow videos are a great way to show off beautiful moments from a special event. Here’s our list of the best wedding After Effects slideshow templates.

The post Top 10 Wedding After Effects Slideshow Templates appeared first on Envato.


Slideshow videos are a great way to show off beautiful photography and footage from special events. And what event is more special than a wedding? Wedding slideshows are fantastic, shareable pieces of content that can allow a bride and groom to share their sentimental day with friends, family and, potentially, people that couldn’t make the day itself. And After Effects slideshow templates make them easy to put together. Here’s our list of the best wedding After Effects slideshow templates our subscription service, Envato Elements, has to offer.

10. Romantic Slideshow by Media_stock

  • 3840×2160 RESOLUTION
  • Color control
  • Classy Look
  • Petal animation

9. Royal Wedding 4 by Miseld

  • Full HD resolution
  • 1920 x 1080
  • Dynamic transitions
  • Very traditional looking

8. Collage Photo by Vidnoa Design

  • Full HD resolution
  • 1920 x 1080
  • Easily customized
  • Non traditional scrap book looking design
  • Different and cute

7. Vintage Frame by Bank 508

  • After Effects Template
  • No Plug-ins Required
  • Full HD
  • 12 images or video placeholder
  • Classic design

6. Photo Cloud by Motion Revolver

  • Easy to edit template
  • No AE experience necessary
  • 4K resolution
  • Great for little or lots of images
  • Lets the images shine

5. Slideshow by Super-8

  • Individual projects for 25, 55 & 100 photos
  • Fully narrated video tutorial series
  • Drag & drop photos or videos
  • Clean and elegant design
  • Fun and different way to show off wedding photos

4. Shiny slideshow by Royal FX

  • Modular Structure (Ease change duration)
  • No Plugins Required
  • 1920×1080 Full HD Resolution
  • Classy Design and smooth transitions

3. Happy Life Moments by Nullifer

  • Full Resolution
  • SHORT version 1:26 (17 placeholders)
  • LONG version 2:41 (32 placeholders)
  • Free font
  • Create your own reveals
  • Realistic animations of brushes and reveals

2. Sunshine Slideshow by Royal FX

  • Smooth animation
  • Easy customization.
  • No plugins required
  • 3 versions (15, 30 & 45 placeholders)
  • Unique stylish design

1. Ink Fantasy by Media Stock

  • Full HD resolution
  • No plug-ins required
  • Easy to understand video tutorial included
  • Elegant and moody, very visually appealing
  • Great transitions with the ink spots


The post Top 10 Wedding After Effects Slideshow Templates appeared first on Envato.