Tutorials

How Designers and Developers Can Collaborate Using Sketch and Zeplin

Collaboration between designers and developers is essential to the success of a web project, and it’s a measure of a team’s success. Whilst sharing the same workspace is invaluable, having an online source of truth that helps with this collaboration is incredibly helpful. In this article we’re going to look at Zeplin and how it… Continue reading How Designers and Developers Can Collaborate Using Sketch and Zeplin

SpriteKit From Scratch: Fundamentals

Introduction SpriteKit, available on iOS, tvOS, and OS X, is a framework that allows developers to create high quality 2D games without worrying about the complexities of graphics APIs, such as OpenGL and Metal. In addition to handling all of the graphics for developers, SpriteKit also offers a wide range of extra functionality, including physics simulation, audio/video playback, and… Continue reading SpriteKit From Scratch: Fundamentals

How to Create a Seder Plate for Passover in Adobe Illustrator

What You’ll Be Creating Whether or not you observe Passover, this is a great time to create and learn about the Seder plate and what it means during this Jewish holiday season. Celebrated this year from sunset on 22 April to 30 April (or nightfall of the 29th if you’re in Israel), Passover celebrates the… Continue reading How to Create a Seder Plate for Passover in Adobe Illustrator

How to Make Pixel Characters

What You’ll Be Creating If you’ve ever thought about creating pixel art, here’s a very quick and easy introduction to one of the most fundamental aspects of it: characters. We’ll be creating an extremely simple character, but although it will be simple, it will still allow a decent amount of detail, so it will work… Continue reading How to Make Pixel Characters

Quick Tip: Using CSS Counters to Style Incremental Elements

In this quick tip, we’ll cover the very basics of CSS counters; a useful, yet not so well-known CSS feature. When we’re done building our demo, we’ll take a look at some real world examples of sites which take advantage of CSS counters. The Goal: Styling an Ordered List As a first step, let’s look at the… Continue reading Quick Tip: Using CSS Counters to Style Incremental Elements

How to Code Multiple Loops While Only Querying the Database Once

I’m a big fan of the WP_Query class: I use it in many of my client sites to query and output content in custom ways. If you want to run multiple loops on a page, the easiest way to do it is to run WP_Query each time you need to run a loop. But there… Continue reading How to Code Multiple Loops While Only Querying the Database Once

Testing and Dependency Injection With Model View Presenter on Android

We explored the concepts of the Model View Presenter pattern in the first part of this series and we implemented our own version of the pattern in the second part. It’s now time to dig a little deeper. In this tutorial, we focus on the following topics: setting up the test environment and writing unit tests for the… Continue reading Testing and Dependency Injection With Model View Presenter on Android

How to Prepare a Cool 3D Card for Post-Print Effects

What You’ll Be Creating In this tutorial you’ll learn how to create a laser-cut pop up card, perfect for showcasing retail offers or adapting for events. We’ll break down into simple steps some of the essential techniques for preparing your artwork for post-print processes, including laser-cutting and accommodating for folds. Suitable for beginner-to-intermediate users of… Continue reading How to Prepare a Cool 3D Card for Post-Print Effects

WP REST API: Internals and Customization

In the previous part of the series, we learned about creating, updating, and deleting content remotely through the WP REST API. It allows us to create platform-independent applications that work seamlessly with a WordPress powered back-end, providing a rich experience to the user. In the current part of the series, we will take a look at… Continue reading WP REST API: Internals and Customization

New Course: Advanced Animation With GSAP Plugins

What You’ll Be Creating The GreenSock Animation Platform is a powerful JavaScript library for animating HTML elements in the browser. In our new course, Advanced Animation With GSAP Plugins, you will learn how to take your GSAP animations to the next level using the plugins that come with the platform. What You’ll Learn Our recent GreenSock Animation… Continue reading New Course: Advanced Animation With GSAP Plugins

20 Useful WordPress Gallery Plugins

Several WordPress versions ago, putting together an image gallery wasn’t the easiest thing to do, let alone a gallery of videos or products for sale. Today, however, there are many WordPress gallery plugins that are creative, powerful, and highly configurable. Sure, the Jetpack gallery is great in comparison to the early days of WordPress, but… Continue reading 20 Useful WordPress Gallery Plugins

Better CSS Drop Caps With “initial-letter”

Drop caps are a form of decoration sometimes used at the beginning of a block of text; the initial letter running several lines deep and indenting the body text within these lines. Drop cap example, as found on The Walrus Drop cap example, as found on Nautilus It’s a typographic tradition as old as the… Continue reading Better CSS Drop Caps With “initial-letter”

Android From Scratch: How to Run Your Application on a Physical Device

Most Android phones and tablets can be connected to a computer using a USB cable. However, by default, the USB connection established between an Android device and a computer is limited to file transfer only. Therefore, if you want to use your device for Android application development, you have to make a few configuration changes… Continue reading Android From Scratch: How to Run Your Application on a Physical Device

New Course: Productivity Tips for Your Web Design Business

If you’re struggling to stay on top of your business and its demands, try our new Coffee Break Course, Productivity Tips for Your Web Design Business. You’ll be in the company of Paul Boag, founder of UK Web design agency Headscape, as he shares the productivity tips that have enabled him to work less while at the same time… Continue reading New Course: Productivity Tips for Your Web Design Business

How to Adopt Model View Presenter on Android

In the previous tutorial, we talked about the Model View Presenter pattern, how it is applied on Android, and what its most important advantages are. In this tutorial, we explore the Model View Presenter pattern in more detail by implementing it in an Android application. In this tutorial: we build a simple application using the MVP… Continue reading How to Adopt Model View Presenter on Android

Advanced JavaScript Fundamentals

Without a doubt, JavaScript is the most popular programming language in the world. While the web development industry is chock full of frameworks and libraries that simplify some aspects of JavaScript development, there’s something to be said about having the skills to write pure JavaScript. Frameworks, libraries and transpilers may come and go, but JavaScript… Continue reading Advanced JavaScript Fundamentals

Animated Animals in CSS and SVG

Learn some interesting animation techniques involving Sass and SVG filters for realistic motion effects on the example of animated animals. View demo Download source Today we want to show you how the clever use of HTML, CSS sequenced animations, and SVG filters can bring to life one of the most unlikely (yet adorable) things to… Continue reading Animated Animals in CSS and SVG

Ink Transition Effect Powered by CSS Animations

This is a great tutorial to create ink transition effect using CSS animations.It’s been developed by Codyhouse inspired from the website Sevenhills. A PNG sprite and steps() timing function in CSS has been used to create video effects and use them as transitions.The process to create these effects is simple Demo Tutorial

Weekly Inspiration: Comments, Discussion, and Feedback

In this age of content saturation on the web, one opportunity for online publishers to stand out is through their respective communities. The communities which surround and make use of websites are massively important, and how they interact with those websites, and each other, is equally important. We’re used to seeing comment threads on websites;… Continue reading Weekly Inspiration: Comments, Discussion, and Feedback

How to Create Flat Weather Icons in Adobe Photoshop

What You’ll Be Creating April showers bring May flowers! It is traditionally known that April is quite a rainy period, when the weather changes unexpectedly from the sun shining in a clear sky to raining cats and dogs. However, any weather has its own beauty, so let’s get inspired and prepare for springtime with this… Continue reading How to Create Flat Weather Icons in Adobe Photoshop

How to Work With WordPress Term Meta: Term Metadata API

The first post in this series laid the groundwork for understanding taxonomies, terms, and their relationship within the context of WordPress. If you haven’t read it yet and you’re brand new to WordPress development, then I highly recommend reading through it as this post is going to build on top of everything covered in that… Continue reading How to Work With WordPress Term Meta: Term Metadata API

Set Up Google reCAPTCHA in OpenCart

Whether you’re a pro or a fresher in the world of website development, the word CAPTCHA should not sound alien to you. It is an important and widely used technique to determine if the user is a bot or an actual human. There are lots of third-party scripts that allow you to set up CAPTCHA… Continue reading Set Up Google reCAPTCHA in OpenCart

Weekly Inspiration: Full-on Full Screen Home Pages

The full screen splash is one of the most familiar patterns on the web at the moment. Some love it, some loath it, but whatever your feelings let’s take a look at some noteworthy examples and talk about best practices while we’re at it. A Note on Design Convergence The term “design convergence” refers to… Continue reading Weekly Inspiration: Full-on Full Screen Home Pages

WP REST API: Creating, Updating, and Deleting Data

In the previous part of the series, we looked at how we can use the WP REST API to retrieve content from the server. We learned to retrieve content for different resources including posts, post meta, tags, categories, etc. This is a powerful feature since this content can be used anywhere inside or outside WordPress.… Continue reading WP REST API: Creating, Updating, and Deleting Data