Category: Tutorials

You learn something everyday if you pay attention

20 Outstanding Free Photoshop Text Effects

Photoshop is an amazing tool designers can use to create outstanding effects! Even for 3D effects, you can use it an enhance your designs! Let’s say you have to design a poster, a logo, or any other kind of design, and you need an amazing text effect to go with it. We’ve got you covered!… Continue reading 20 Outstanding Free Photoshop Text Effects

Create inline help tips for your site with a bit of CSS

When creating a web app, you often need to present people with friendly help prompts that explain parts of your interface. One of the ways to do it is to have separate pages with help topics that you link to. However, this causes people to lose context of what they are doing and is not… Continue reading Create inline help tips for your site with a bit of CSS

Responsive, Fluid-Width, Variable-Item Navigation with CSS

Around six months ago I was asked to develop a single row navigation bar that could contain a variable number of menu items while filling the entire width of the container. The amount of navigational items was dictated elsewhere and likely to change in future.Thinking ahead, it would have been impractical to change the CSS… Continue reading Responsive, Fluid-Width, Variable-Item Navigation with CSS

Make Shapes with CSS: How to Create Different Shapes in CSS

One of best cool features of CSS3 is that it reduces the use of images in web designs and allows you to create different shapes in CSS. Commonforms that you usually see in Photoshop or Illustrator can now be done using CSS3. New CSS properties like transform and border-radius add complexity with shapes instead of creating… Continue reading Make Shapes with CSS: How to Create Different Shapes in CSS

Free Swift Tutorials for Apple’s New Programming Language

Unveiled only a month ago, the new programming language Swift that was created by Apple for iOS developers shook up Xcode lovers a bit. It aims to provide programmers with an alternative that slowly should replace Objective-C, which is not so resilient against erroneous code. Swift includes slightly revised basic Objective-C features and new advanced… Continue reading Free Swift Tutorials for Apple’s New Programming Language

Notification Styles with CSS Animations for Inspirations

There are some simple ideas and effects for unobtrusive website notifications. There are a lot of ways to show an unobtrusive message to a user: from the classic growl-like notification to a bar at the top of the viewport. There’s really no limit to making creative notification styles and effects but you should keep in… Continue reading Notification Styles with CSS Animations for Inspirations

How to Create Photo-filled Text with Photoshop

Designing for the web has always been a fast-developing field where a professional has to skillfully combine visual information design, aesthetics and composition priciples with the most relevant current ideas and trends to satisfy the expectations of his client. A good web designer has a clear vision of the main aim of the website they… Continue reading How to Create Photo-filled Text with Photoshop

Beginner’s Tips & Tricks for Learning Icon Design

Aside from regular web & graphics design, the process of designing icons is vast and complex. Iconography can be created with a sketch or from a blank document in digital software. Digital icons can be created using either pixels or vectors. There are many options and the outcome is heavily reliant on the medium, such… Continue reading Beginner’s Tips & Tricks for Learning Icon Design

Understanding The Phase of Website Design

Design phase consists of all the activities that ensure that page elements, colors and graphics all work together to provide an enjoyable experience for the customers while projecting a professional image for the business. Design of a Web project is the next most important and popular Web development phase. The focus of the design phase… Continue reading Understanding The Phase of Website Design

9 Web Based Solution to Create Stunning Slideshows Presentation

When it comes to presentation, we always think of PowerPoint or Keynote. Do you know you can create stunning presentation slideshow using web based technologies as well? What can be done on those presentation applications can also be done on browsers. We have HTML5, CSS3 and Javascript. Just like building websites, we can integrate multimedia… Continue reading 9 Web Based Solution to Create Stunning Slideshows Presentation

The Problems With Flat Design and How to Solve Them

Flat design has made a huge name in the designing world by completely taking over the graphic design in a short period of time. The biggest interface to go flat was Windows 8 but, it was also left behind when Apple released its iOS 7 in summer 2013. With the launch of Apple’s iOS 7,… Continue reading The Problems With Flat Design and How to Solve Them

18 Best jQuery Lightbox Plugins: Free and Premium

jQuery is one of the interesting language to ease the work of designers. It is capable of bringing out something interesting from your code and eases the coding by adding libraries. jQuery lightbox plugins are best to showcase the photos in an elegant manner. It can even add responsiveness to pop ups, signup forms, and… Continue reading 18 Best jQuery Lightbox Plugins: Free and Premium

Fenix – A Simple Static Desktop Web Server

Web server is an essential tool for web developer. It’s an essential tool to save times and bandwidth. By developing or updating a website locally, we can skip the file upload and download tasks completely. We can do it once everything is ready. Depend on what platform you’re using, you can install either IIS, Apache… Continue reading Fenix – A Simple Static Desktop Web Server

Create fashion-inspired digital collage in Adobe Photosop CS6

Today, you’ll learn how to use a variety of tools in Adobe Photoshop CS6 to mix fashion photography with abstract shapes, and how to use adjustment layers and masks to unite the colour palette and composition of an illustration. Layered PSD file included. Let’s get started! Final Image Preview Start working by creating a new… Continue reading Create fashion-inspired digital collage in Adobe Photosop CS6

Designing a Simple Instagram Based Portfolio in Photoshop

What You’ll Be Creating In this tutorial I’ll guide you through the process of creating a simple and clean Instagram-based portfolio. We’ll use some striking imagery, a clean color palette and smooth typefaces. We’ll start off by creating a web version and then I’ll show you how to quickly adapt it for mobile view. Tutorial… Continue reading Designing a Simple Instagram Based Portfolio in Photoshop

Streamlining Web Development Workflow with Yeoman

There are many tools for building web-apps yet putting them all together and making them fit in our workflow could be real cumbersome. We also tend to do repetitive tasks when building web apps such as creating files, creating folders, installing a number of front-end libraries. Wouldn’t it better if we can streamline this task… Continue reading Streamlining Web Development Workflow with Yeoman

Tips for Getting a Web Design from Illustrator into the Browser

Scenario: someone hands you an Illustrator document with their latest web layout and it’s your job to convert it into working HTML and CSS. Let’s take a look how you can do that. Note: The aim of this tutorial is not to perfectly recreate the design for web use. Instead, we’re going to use it… Continue reading Tips for Getting a Web Design from Illustrator into the Browser

How to hyperlink in Photoshop

As we all know, hyperlink is that which links image/text to another place either in the same document or different document or address. It’s pretty useful when you want to show more information. Follow the steps provided in this tutorial to create hyperlinks in Photoshop. Steps to hyperlink in Photoshop: 1. First of all, open… Continue reading How to hyperlink in Photoshop

Learning to Code is Fun and Easy with Code Avengers

Learning to code is fun and easy with Code Avengers. Whether this is your first time coding, or you have tried it before – their courses guide you each step of the way. Scripted by educators, they offer practical coding skills to help you learn at your own pace. Their lessons are designed to be… Continue reading Learning to Code is Fun and Easy with Code Avengers

How to Easily Use Google Fonts in WordPress

The CSS3 @font-face rule and services like Google Fonts have really opened up the doors for people to be more creative with web typography. Google Fonts has over 630 fonts available to choose from, and in this article, I’m going to show you an extremely easy way to use them in your WordPress site –… Continue reading How to Easily Use Google Fonts in WordPress

How to Effectively Validate a WordPress Website

Validation is undoubtedly one of the most important aspects of good web design. And in a content management system like WordPress, you need to be careful about your HTML & CSS both in your theme and your content. In this tutorial, we’re going to talk about validating a WordPress website. Why Validate a Website? Or,… Continue reading How to Effectively Validate a WordPress Website

Rapid Prototyping for Web Design: Basic Tips and Resources

If you’ve never heard about rapid prototyping it can be defined by the two individual terms. “Rapid” means a speedy action taking place over a short period of time, and a prototype is typically the first model of a project. This process requires fast iterations of design to implement features, test how they work, and… Continue reading Rapid Prototyping for Web Design: Basic Tips and Resources

Quick Tip: Converting Photoshop Files to Code With Project Parfait

Project Parfait is a new tool from Adobe, currently in beta, which lets you open up any PSD directly in the browser to extract CSS, text and image assets from it. At the moment it only works on Chrome but Adobe plan to roll it out across all browsers as development moves on. Drag &… Continue reading Quick Tip: Converting Photoshop Files to Code With Project Parfait