Archive for December 29th, 2009

As mentioned in our previous post, logos are indeed important since it creates the first impression to consumers and to viewers. Extra effort is needed when creating a logo to ensure that the output is exceptional. We were able to collect 30+ Useful Logo Design Tutorials for Photoshop and Illustrator for designers who ventures to logo creation. Not only are this tutorials educational but entertaining as well. Get as many techniques as you can for your advantage.

Hang on to your PC’s as we take you for a glimpse at the process of the creation of some of the logos of infamous products and organizations today. Be inspired by these designers, as they share some of their experience in putting together and tips to come up a branding.

The print version of Digging Into WordPress the book is now available here. It’s been an awesome journey, taking this from idea to final product and having 100% control over everything. That is a story for another post, for now let’s take a look at the book!

How much is it?

It’s $67, and automatically comes with the PDF version (more on that later). We realize that is toward the high end of the scale. There are a variety of reasons for this.

This is 400 pages of full-color printing.

We aren’t printing in massive quantities. In printing, the less you run the more you pay per-piece.

It has been a ton of work getting this all together. Aside from some very helpful folks who helped us find errors after the PDF went out, every inch of it has been done by myself, Jeff, or our friends and family. We don’t have the efficiency of a company that does this day in and day out.

Believe me, our margins are fairly tight on this.

We are shipping internationally. But as you might suspect, it costs a good bit more. I asked the post office for the cheapest possible way to get it overseas, and places like the United Kingdom and Germany were around $28, so that’s what we need to charge.

In the United States, shipping is closer to $5.00. Illinois sales are subject to sales tax; international sales get VAT.

Already have the PDF?

First things first, as promised, if you already purchased the PDF and want a print copy of the book, you are entitled to a discount. Here is what you do:

Email us at sales@digwp.com (or use the contact form). Either forward us your receipt or just provide us with the full name and email used when buying the book.

We’ll send you a discount code you can use during checkout.

The code will be valued at whatever you paid for the book plus $5 off. So if you paid the full $27 for the PDF, we’ll send you a code worth $32. So you’ll end up paying $35. This helps us keep our margins intact and not lose money on these print books.

Features

My favorite… it’s spiral bound! For once, a tech book that will lay flat next to your keyboard.

Every page is full color!

And of course the slew of stuff we talk about. Perhaps most importantly, free updates to the PDF version for life. We already have plans in the works for updates. As a buyer, you’ll be emailed a free download link when those new versions go out.

How it affects the affiliate program

Our affiliate program for the book pays (a rocking) 50% for sales of the PDF. That part doesn’t change. But we obviously can’t afford to pay 50% for book sales. For book sales we are going to give 20%. What that works out to is basically the same exact payout for either purchase: $13.50 for a PDF sale, $13.40 for a book sale. Pretty damn good if you ask me. I’ve literally PayPal’d out thousands of dollars to affiliates.

Much love

Networking has certainly become important to our daily life. Whether light-hearted interaction with friends or communicating with business clients the world over, socializing is integral to our personal and professional relationships. Facebook has gotten most of the buzz in the past few years, allowing members to easily stay connected with friends, family members and business associates.

Adding friends, sending messages, chatting, joining causes and networks for your institution or workplace, you can do it all here. Here, we’ll introduce you to 20 scripts that are typical for the Facebook user experience. Web designers and developers who want to integrate Facebook-like features into their websites and applications are in for a treat.

1. Post-To-Wall Application Using jQuery and PHP

A lot of information is made available on Facebook’s wall message board, including message content, users, senders, comments, dates, times and other relevant details. Though this may seem like complicated work, this tutorial by Antonio of woork.blogspot.com makes it easy for you to implement a similar post-to-wall feature on your own website. Use the few lines of Javascript and PHP code from the tutorial and watch your website flourish like never before. To make it easy for beginners, the tutorial deals with only one piece of information on the wall: the message content.

2. Lightbox

A lot of lightboxes are out there, but why not make the perfect one, like the one on Facebook? This great lightbox script was created by famspam. Writing code for even routine tasks can be cumbersome. But with the simplicity of JQuery, you can have a lightweight Facebook-style lightbox for your website. Capable of displaying DIVs, images and even entire remote pages, the lightbox creates pop-ups that are visually appealing and easy to use. You can get started here.

3. Auto-Suggest Search With jQuery

Automatically suggesting potential search results based on just a few letters entered by the user, this Facebook-style auto-suggest search engine is a true time- and effort-saver for users and enhances their experience of the website. For example, typing the letters “Fra” could bring up “France” or the user’s friend “Frank” as suggestions. This stylish search engine makes use of BSN Autosuggest libs and employs jQuery for the AJAX framework. Some of the features of this Facebook-style search are:

AJAX and auto-suggest support;

Renders support for search plug-ins;

Provides support across different browsers (Firefox, IE 5.5 and above, Opera, Safari);

4. Modal Box Using MooTools

Stylish, lightweight and subtle, Facebook’s modal box is the best and most coveted of all current modal boxes. This JavaScript creates modal dialogues and wizards — i.e. dialogue sequences — without resorting to conventional page reloads and pop-ups. These are also sometimes used to display large versions of small images. The tutorial here takes the CSS and imagery from Facebook and combines it with the amazing functionality of MooTools in order to create the Facebook effect.

5. Elastic Plug-In

A major hit on Facebook, this jQuery plug-in is now counted among the most functional UI effects on the Internet. This elastic plug-in automatically shrinks or expands text areas according to the amount of text inputted by the user. The weight of this plug-in is what gives it its edge over competitors. Now, you can recreate this impressive Facebook-style effect of an elastic text area by simply following this tutorial.

6.Tipsy Plug-In

Wondering how to make a relevant tooltip pop up as users move their cursor over the title attribute of an anchored tag? Facebook provides inspiration for this jQuery plug-in, and you can implement this cool tipsy plug-in on your own website now. Aside from being a neat trick, the plug-in is easy to configure and lightweight. Read the tutorial to learn how to incorporate the Tipsy plug-in on your website.

7. Activity Stream

This innovative plug-in for Movable Type 4.1 allows you to share, control and aggregate all of your activities around the Internet, along with several of your profiles from different services. The plug-in emulates the Facebook streams that adorn your wall. So, if you have a Movable Type blog and wish to exercise complete control of your activities on the ‘net, including showing or hiding certain activities, this tutorial on Facebook-like activity streams is sure to be a great help. To keep you from being locks in to any particular service, this plug-in can also publish your stream with the hAtom microformat and Atom.

8. Icons

Chatting with friends online is fun, but words are sometimes not enough to convey our feelings. Icons come in handy because they’re a cute, simple way to express emotion. Of course, saying “I love you” has a powerful effect, but an icon of a little heart pumping is so much more stylish. Facebook icons are a hit among users, and you can download 28 of them here, for free. They are available in SVG and high-resolution PNG format.

9. Sliders Using CSS And MooTools

Website developers are constantly looking out for great ideas with which to enhance their websites. The slider controls on Facebook have caught the eye of many professionals. To implement similar-looking sliders for your project, read the tutorial here. It explains how to create them and how to control the height, width and opacity of images. The credit for this easy three-slider tutorial goes to David Walsh, a successful Web developer in his own right. Hats off!

10. JBolo

Having to switch between two websites every few seconds — or even few minutes — can be annoying: for example, to chat with a friend on Gmail and browse photos on Facebook. With that in mind, Facebook took social networking to the next level when it integrated chat functionality. And now you can integrate a similar feature on your Joomla website using this tutorial. The distinctive name of this application is taken from the Hindi word “bolo,” which means to talk. So, get to work and let your visitors start talking!

11. Boxy

Styled like the dialogue box on Facebook, this flexible box supports size tweening and dragging. What distinguishes Boxy from several other overlays is the availability of an object interface to control dialogues after creating them. To make usage even simpler, it also provides you with a jQuery plugin that allows you to include forms and links automatically, along with the “Ask helper” to present the user with an array of choices. Read the tutorial to implement the Boxy dialogue box on your website.

12. Gmail- And Facebook-Style jQuery Chat

Everyone loves Facebook’s chat module. And this jQuery module lets you seamlessly integrate Gmail- and Facebook-style chat into your website. This chat script has many features, such as keeping chat boxes open and preserving a box’s state (and data) even when the page has been refreshed, just like on Facebook. Also, this chat is extremely simple to integrate. Learn more about this Facebook-style jQuery chat.

13. Alert Confirmation Box Using CSS And jQuery

It happens often enough that while performing a particular action, we lose focus and mess up the task. Alert confirmation boxes can be a great help here. In asking for your confirmation of an action, the box makes you think through your request before finalizing it. For instance, to remove a friend from your friend’s list on Facebook, you need to click on the “X” button, which brings up an alert confirmation box asking you, “Are you sure you want to delete so-and-so from your list?” You are given the option of “Yes” or “No,” which finalizes the action. Alert boxes can help visitors to your website complete important actions, such as deleting items from a shopping cart. This tutorial shows you how to make an alert confirmation box like the one seen on Facebook.

14. AJAX Pagination Using jQuery

Designing Facebook-style pagination to break up a long list of search results into several pages is no longer a difficult task. Though page numbers are not displayed at the top of Facebook, you are given the option at the end of the page to see more results. To create a similarly subtle yet helpful feature on your website, go through the tutorial here.

15. Cometchat

This is the best script for inline chat similar to the kind seen on Facebook. Get the script to give your visitors a chat environment to interact in while they browse your website. They can also update their status, like “Available,” “Busy,” etc. Facebook-style AJAXification ensures the feature does not reload every time a visitor clicks to another page. Hash URLs and notifications in the footer are some of the other features integrated in Cometchat.

16. Image Cropping

The crop tool hides unseemly parts of a photograph and brings focus to the subject. Facebook introduced such a tool that members can easily use before uploading and sharing their pictures. To achieve this nifty combination of Javascript and PHP, check out this amazing tutorial.

17. Input Box

Integrated with the auto-complete function, the input box on Facebook allows you to search for and send messages to your friends. To include a flexible Facebook-inspired input box for your website, just grab this MooTools 1.2-compatible script and get started.

18. Chat Room And Instant Messenger

Does the instant messenger and chat room on Facebook make you green with envy? Give your website the same with this Joomla module. Visitors can sign in to the messenger with their Facebook ID and password and use their friends list from Facebook. It really is as simple as that.

19. vBStatus (Status Display)

Isn’t it great that you can share what’s on your mind with all your friends in an instant, and vice versa. These status updates are one of the main features of Facebook. And below them is room for your friends’ comments and a option to “Like” your status. This feature is referred to as “vBStatus,” and you can include the same on your website by downloading ithere. Users will have the flexibility to quickly change their status whenever they want using AJAX.

20. Facebox

Facebox is lightbox script that gives you the look of Facebook pop-up message windows. It can contain images, Flash movies, HTML and more. Facebox is a MooTools alternative to the original Facebox jQuery script. Read more about Facebox here.

The conservative web designer can design a dark web site or a light web site, and will design everything in between as gray. Are you this type of designer? Or, are you bold enough and brave enough to let your creativity rein free and allow bright and vibrant colors to shine through in your next design project? What does the level of color on your web site say about you? (I must be a conservative).
The 50 web designs below do not only show no fear of bright and dominant colors, they are also beautiful designed. They demonstrate that color, from skilled hands, can be successful achieved within web design and in mostsome cases can be very powerful and memorable.

View more from the Web Design Styles series

On Monday past we published the post 49 Most Creative Photoshop Tutorials of 2009, a collection of the best artistic tutorials for Photoshop from this year. As a follow up to that post, today we have The Best 40 Photoshop Text Effects from 2009, a collection of diverse and unique effects and type treatments that will add a little extra to your next design.

You might also like…

There are many elements of blogging that are essential, the most important is the ability to share your posts and information with a wider audience, and we accomplish this via the many social bookmarking services (digg, delicious, twitter…) that are available. Finding a bookmarking iconset that fits into your theme can be difficult or maybe you don’t want the boring or the bland, but you want an iconset that has been designed by a high quality designer and has something distinctive and original. Below you will find such iconsets.