Posts categorized as: Tutorials

50 High-Quality Adobe InDesign Tutorials

by Steven Snell

August 28, 2013 in Tutorials

Adobe InDesign is a program used for creating print designs like album covers and books. A while back I wrote about some easy tutorials for beginners. But in this showcase I want to share 50 powerful InDesign tutorials which offer a whole lot more complicated solutions. The best part is that you don’t need to be an expert with InDesign to understand it all! Check out the gallery and see if any tutorials appear interesting. With a bit of work you can learn how to design this stuff quickly and effortlessly.

Image Reflection

adobe indesign cs5 image reflection technique

Read More

How To Make a Custom HTML5 Select Menu with Selectize.js

by Jake Rocheleau

August 22, 2013 in Tutorials

Detailed and customized input fields have been a great focus of modern web development. The jQuery library along with similar open source projects have provided a framework to build with. It has lead to numerous advances within the field of user interface design. Especially for customizing the typical “default” components in form elements.

In this tutorial I want to introduce the Selectize plugin for jQuery. It allows developers to greatly alter the presentation of input fields related to select menus and tag-formatted text fields. This can provide a tremendous benefit on projects where you need a cleaner, updated interface. It is a fairly straightforward process and shouldn’t take more than 60 minutes to create. Take a peek at my live demo to see what we are making.

jquery selectize custom select menus html5 demo

Read More

How To Build a Range Slider Input with jQuery UI

by Jake Rocheleau

August 6, 2013 in Tutorials

Looking at the HTML5 range input element you can see a number of advancements. Forms are able to take in restricted information from users sliding between number segments. But unfortunately these HTML5 inputs are only supported in modern browsers. So although there are a few limitations we can try to work around them.

I want to demonstrate how to build a more customized version of the range slider using jQuery UI. The slider widget is a part of the jQuery UI core library so it comes prepackaged with the script. This makes it really easy to play with because the documentation has been well-sourced and easy to consume. Check out the live copy of my sample demo to see what we are creating.

jquery ui sliders inputs form

Read More

Coding a Lazy-Load Website Interface using Unveil.js

by Jake Rocheleau

June 26, 2013 in Tutorials

There have been a number of recent open source plugins for lazing loading images. A popular choice is Unveil.js which was just recently published onto Github. It is meant to be a lightweight version of the original LazyLoad plugin built over jQuery. After testing out a number of different features I am a huge fan of Unveil.js.

Interface design is incredibly simple once you understand the basics. It will take some practice getting used to the code samples and writing your images properly. However the lazy load plugin can showcase tremendous support across all typical web browsers. Not to mention the popularity among users who are transferring data over slow Internet connections. The lazy load plugin will shave off latency times and still provides an exhilarating user experience.

designmag jquery tutorial preview lazyload images plugin

Read More
Page 4 of 23« First...23456...Last »