Articles tagged as ‘Tools’

How to Take Back Your Time & Increase Your Productivity — Plus 11 Great Productivity Tools

Did you ever finish a day of hard work and feel like you got nothing done?

Believe me, you’re not the only one. Time management is a challenge for many professionals, and web designers are no exception.

If you’re also a freelancer, how well you manage your time may also affect how much you earn. So, it’s important maximize your productivity whenever you can.

Unfortunately, we all have many demands on our time. Often, it’s the little things that slow us down the most–things we might not even think about.

productivity
Image Source: lett -/=

In this post, I’ll show you how to increase your productivity by identifying three common problems that keep us from being as productive as we should be. I’ll also share 11 productivity tools to help you get better control of your time.

Read More ».

50 Bootstrap Themes for Responsive Websites

Twitter’s Bootstrap framework has become incredibly popular since it was initially released in 2011. If you’re looking for a way to quickly build and deploy responsive websites, Bootstrap is a great option. While using any of the popular frameworks will involve a little bit of a learning curve, once you have adapted your process it can be much quicker for you to complete web design projects with the help of Bootstrap.

Another good thing about using Bootstrap is that there are loads of tools and resources available thanks to a growing community around the open-source project. You can purchase a great-looking template or theme built on Bootstrap for less than $20. Here we’ll take a look at 50 well-designed, and affordable, templates for Bootstrap.

Myway – $13

Myway

Read More ».

13 Resources to Design for Bootstrap

Twitter’s Bootstrap has rapidly grown into one of the most popular frameworks for web designers and developers. Bootstrap aims to make web development faster and easier, and a growing number of designers and developers are working with Bootstrap.

There are a lot of benefits to using a framework like Bootstrap, most of them focusing on the increased efficiency for building modern and responsive websites. If you’re a Bootstrap user, or if you are interested in giving it a shot, there are several resources that can help with the visual design aspect of working with Bootstrap, and we’ll look at them in this article. There are far more resources that useful for working with Bootstrap in one way or another, but in this collection we are focusing on those resources that help with creating a visual design.

Bootstrap 2.0 Photoshop Template
This free PSD file includes loads of elements that can be used to create your own Bootstrap-based designs in Photoshop. It come with things like buttons, form elements, typography, navigation elements, tables, and much more. It’s also available for Fireworks.

Bootstrap 2.0 Photoshop Template

Read More ».

Analyzing Your Conversion Funnel

So you’re a great designer, right? You create amazing sites that your clients fall in love with. But let me ask you something…what’s the conversion rate of the last website you created? I’m sure not many designers would be able to answer that question.

“We’re designers. That’s not a part of our job,” some of you might be thinking. Okay. But you do understand that people do not make websites just for the heck of it. Right? I mean, except for the reputation management clients who care no more than aesthetic appeal of the site, almost every website has a purpose. They want profits.

This purpose or conversion goal of the website can be anything from lead generation through form-filling, free-trial signups, and download brochure to direct sales from a website, like in the case of eCommerce websites.

The point is – if your design is in any way not doing a good job of helping people accomplish this conversion goal, no matter how beautifully designed your website might be, its value to your client decreases.

Read More ».

15 jQuery Carousel Plugins

A common challenge during a web design project involves finding a way to display the relevant content in an attractive and usable manner. Carousels are often used for displaying images, text, and sometimes videos. If you’d prefer to save some time during the coding of the site you can use an existing jQuery plugin to create your carousel.

There are a lot of good scripts and plugins available, and in this article we’ll highlight 15 of them. Most of them are available for free download, but some of them are premium and must be purchased. Each comes with different features and options for customization. Hopefully you will find one that will be right for your next project.

iCarousel

iCarousel
iCarousel is a premium option (cost is $8 for a regular license) that supports touch gestures. It is highly flexible and customizable to allow you to create something unique. Both 2D and 3D options are available.

Read More ».

7 Awesome HTML5 Website Development Tools by Adobe

PCMag recently spoke with Danny Winokur, Adobe’s vice president and general manager of Interactive Development, who said the point of today’s releases is to “advance what’s possible with HTML5 and associated technologies that have become instrumental to the modern Web.”

Adobe’s tools for HTML5 website development have brought the power of multiple technology features to build creative website designs. It aims to revolutionize the way the web is dealt with going forward. Adobe hopes to surprise web developers with a rather convenient and simpler creative process. These comprehensive tools are smart, flexible, and highly interactive in their use, style and performance.

Let’s take a look at the latest Adobe’s HTML5 website development tools re-invented for 2013:

Edge Reflow

This is a completely new, responsive web design tool by Adobe, available only for Adobe Creative Cloud members. The tool can create layouts and visual designs with CSS and is totally free in Adobe’s creative Cloud. It has a smart and intuitive design surface which can be easily resized. This surface gives an idea as to how layouts and visuals will adapt to different screen sizes.

It allows users to preview their designs in the browser, and check their designs in real-time with Edge Inspect extension. The design CSS can be transported to Dreamweaver, Edge Code or any other code editor for further modifications.

What it has in-store for Developers?

The primary purpose of Adobe’s Edge Reflow is to simplify the multi-screen design process, making it much more efficient and time-bound. Used for creating UX prototypes and visual designs followed by quick mock-ups.

Edge Reflow works on 2 design regions – design canvas for WYSIWYG layout and the property inspector (for single element styling). Breakpoints create new media query regions that can be easily tweaked to edit visual elements such as boxes, layouts and much more.

Edge Reflow

Read More ».

20 Awesome jQuery Sliders

Image and content sliders are an extremely common element in modern web design. Coding your own slider from scratch is always an option, but if you’re looking to save some time or if you’re not sure how to code your own slider there are plenty of options. In some cases, working with an existing jQuery plugin will give you the chance to observe the code that is being used, and learn things that can be used in situations where you do want to code from scratch.

In this post we’ll look at 20 different options for sliders. Many of them allow you to create responsive sliders, and some are optimized for mobile users as well. Most of these options are free. The last two listed are premium, and one is free with options to pay for a WordPress plugin version.

Slider Revolution
Slider Revolution is a premium WordPress plugin ($15) that allows you to easily create and customize responsive sliders. It comes with 20 different transitions, it’s touch enabled, and you can include just about any content you want within your slider.

Slider Revolution

Read More ».

12 Options for Easily Creating Web Forms

Creating web forms can be one of the most time consuming and sometimes frustrating parts of creating a website. It becomes especially challenging when you need an advanced form that involves things like conditional logic, multi-page forms, support for file uploads or attachments, and payment integration. Fortunately, there are a number of tools, resources, and apps that are available to make the process much less time consuming.

In this post we’ll take a look at several options for creating web forms, both basic and advanced, quickly and easily.

Wufoo

Wufoo

Read More ».

How to Migrate from Google Reader to Feedly

If you’re a user of Google Reader you probably know by now that Google has decided to shut down the service as of July 1, 2013. Many people, myself included, use Google Reader on a daily basis and have found it to be the best RSS reader available. The good news is that other viable options have started to get more exposure in the past week since Google made the announcement as people look for alternatives. Feedly is an excellent alternative, and you may even find it to be better than Google Reader. The best part is that Feedly has capitalized on the opportunity by making it super easy to import all of your feeds from Google Reader, so you can continue to follow your favorite websites and blogs without interruption. In this post we’ll look at this process.

How to Migrate from Google Reader to Feedly

Read More ».
Page 2 of 612345...Last »