Sunday, July 12, 2009

Tie Your Shoelaces a new Way

Easy Knot
Ian Knot animation I tie my shoelaces with an "Ian Knot", the World's Fastest Shoelace Knot: Make a loop with both ends and simultaneously pull them through each other to form an almost instant knot. Don't confuse this with the very similar looking Two Loop Knot - the technique is quite different and much faster. It's a truly revolutionary way to tie your shoelaces!

Please don't be put off by these detailed instructions - even the Standard Shoelace Knot looks tricky when illustrated! Give it a try; you'll find it's easier than it looks.
Step 1:
Ian Knot diagram 1 Ian Knot picture 1

Tie a Starting Knot as shown, then hold the laces as pictured. The right (blue) lace is held between the right thumb and forefinger whilst the left (yellow) lace is held around the left thumb and forefinger, using the other fingers of the left hand to hold the lace taut.
Step 2:
Ian Knot diagram 2 Ian Knot picture 2

This move creates two loops, one with the loose end behind, the other with the loose end in front. Use the middle finger of the right hand to push the loose end of the right lace behind, whilst the left hand simply rotates forwards to swing its loop across to the right.
Step 3:
Ian Knot diagram 3 Ian Knot picture 3

This next move crosses the two loops over each other. Use the left thumb to push its loose end over to the right, whilst the right middle finger continues to push its loose end all the way between the left thumb and forefinger to end up inside the left loop.

Note that the diagram at left shows somewhat exaggerated crossed loops.
They are really more "alongside" each other, which is difficult to illustrate.
Step 4:
Ian Knot diagram 4 Ian Knot picture 4

This tricky move requires each hand to use the two fingers inside its own loop to grab the loose end of the other hand's loop. Use the left thumb and forefinger to grab the loose right end, then the right thumb and middle finger can grab the loose left end.
Step 5:
Ian Knot diagram 5 Ian Knot picture 5

This move sees each hand releasing its own loop and pulling the loose end of the opposite loop through its own. Take care not to pull the ends all the way through, as this will form a "knot" instead of a "bow". In fact, this is a quick way to tie a starting knot (though the finger movements must be reversed left to right or else it forms a Granny Knot).
Step 6:
Ian Knot diagram 6 Ian Knot picture 6

This final step simply completes the knot by pulling the loops tight. With practice, I can now tie my laces in about one third of the time of a conventional knot!

Finished Knot
Finished Ian Knot picture The finished "Ian Knot" is identical to either the Standard Shoelace Knot or the Two Loop Shoelace Knot. Because it was tied much more quickly and symmetrically, the laces suffer less wear and tear and thus last longer.

Wednesday, July 08, 2009

AppleScripts

Mac Hacks: 11 Excellent AppleScripts to Speed up Your Daily Tasks


1. The DesignerGeeks Free List

Designer Geek


Coming in first on our list of excellent AppleScripts is the wide array of free scripts available at DesignerGeek. Just take a look at the list and functions of some of these scripts! With features and scripts ranging from backups, iCal, Fonts, Drop box alerts, Growl and Wiki apps, the list just goes on and on! If you're looking for some quality free AppleScripts, look no further.


2. Convert an Image

Convert Image


How many times have you gone through the following process? Download an image(s), find the image, open up PhotoShop, wait, select the image and open it, and then finally save the image as a different type of file by converting it. I know I have done it more times than I could count and this is exactly the scenario where AppleScript is meant to help. Download the script above, and all you need to do is drag the images you wish to convert, select the new file type you wish, and you're done!


3. NetNewsWire to FriendFeed

NetNewsWire to FriendFeed


FriendFeed has really blown up in the past year or so, with more and more end users taking advantage of its services and capabilities. This AppleScript aims to bring NetNewsWire and FriendFeed together, which will end up saving you some time in the long run. To quote the script author:

This applescript allows you to post an article to FriendFeed from NetNewsWire. This script based in large part on the "blog selection" script that comes with NetNewsWire.
The script is completely free and is available to download via GitHub.

4. Rampage!

Rampage


Another big time saver here. Imagine you need to know every detail and all of the information about a certain image. You could locate the photo, open up PhotoShop, open the image, find the settings to view all the details etc. Or, you could just download the rampage script for free, select the image and be done with it. Rampage will tell you everything you wanted (and didn't want) to know about the current image you have selected.



5. Doug's iTunes Scripts

iTunes Scripts


Here is a resource of scripts that will be extremely useful to any iTunes user or music fan. Good ol' Doug has setup a page with, at the time of writing, 454 AppleScripts that deal with making iTunes work for you. Some of the scripts range from organizing songs in advanced fashions, to joining certain tracks together with a few clicks of your mouse. Later on we will look at a particularly great script from Doug's website.


6. iCal Duplicate Script

iCal Script


iCal is a wonderful Mac software program that functions as a day planner/calendar/event organizer etc. It can really help you to keep track of daily (or monthly) tasks and what you need to get done on any given day. It is, however, not without it's flaws. If you use iCal frequently, you might have noticed it is somewhat easy to accidentally add or create duplicate/multiple entries. These can really start to clog up your calendar. By downloading and installing the iCal duplicate script, you can clean up your calendar in about three seconds!


7. iTunes Library Manager

iTunes Library Manager


Earlier, I stated we would have a look at another one of Doug's excellent iTunes script and the time has come to do so (oh joy!). If you are anything like me, you have a lot of iTunes music and libraries setup. The iTunes Library Manager allows you to maintain multiple libraries, all with different customizable settings. Features you ask? The author answers:

Additionally, because each library is saved and loaded with its associated preferences, you can create many different configurations for different uses. For instance, you can assign each library its own designated iTunes Music folder, and keep a directory of audio files on your computer and another distinct directory of audio files on another volume, network drive or external drive; different libraries can have different Sharing, Burning or Importing settings, too.

8. iTunes Music Alarm Clock

iTunes Music Alarm Clock


This script is a must have for myself and many others. If you happen to be more of a night owl rather than a morning bird, you may have just found your answer to those getting ups for those horribly early mornings. The iTunes music alarm clock allows you to set all of your preferences for when and how long the alarm should go off. You choose the tracks or albums, the libraries, whatever you want really. Better to wake up to some of your favorite music than a horribly annoying buzzing sound!


9. TinyURL AppleScript

TinyURL script


Website owners and bloggers will probably find this script most helpful. With the popularity of services like Twitter came the need for short and simple URL's, and services like TinyURL. Problem is, if you need to create a bunch of different URLs, it can be sort of a mind numbing process of copying and pasting, and navigating to certain sites. The TinyURL AppleScript takes the current url of the page in Safari, and adds it to your clipboard for easy pasting. Sweet and simple.


Developing Your Own!

So far we have looked at pre made AppleScripts to help you speed up your daily tasks and procedures. That is all fine and dandy if you can find the script you are looking for, but what if you can't? What if you need a script specialized to your exact needs? Well, you could hire a programmer to do it for you, or you could look at the resources below and build it yourself! It's not too difficult, I promise!

10. The AppleScript Beginners Tutorial

Beginners Tutorial


If you have never worked with AppleScript before, start here. No, seriously, this is one of the best resources you will find on the topic and is straight from the Apple Developers themselves. This tutorial, takes you through everything you need to know before getting started, and then how exactly you get started. You'll be writing your own scripts shortly after reading this!



11. Automating iPhoto and Photoshop

iPhot and Photoshop


Now that you have read through the beginners tutorial above, you are ready to get your hands a little more dirty. In this series by the O'reilly Mac Dev Center, you will learn exactly how to use iPhoto and Photoshop with AppleScript to speed up all kinds of daily tasks.



Conclusion

Hopefully, you can see how helpful and time saving AppleScripts can be. By taking a few seconds to download a script, or a few minutes to hours to write one, you can drastically cut back on the time you spend doing everyday tasks on the computer. Did we miss any of your favorite AppleScripts? If so, please let us know in the comments below!

Get Clipmarks - The easiest way to email text, images and videos you find on the web.
Sent with Clipmarks

Sunday, July 05, 2009

Five Best Online Image Editors

Five Best Online Image Editors

Editing your images on a desktop image editor might be ideal, but sometimes you're away from your home workstation and need to do some impromptu editing. Check out these five options favored by Lifehacker readers.

Photo by karlfrankowski.

Earlier this week we asked you to share your favorite tools for editing images online, independent of any downloaded or portable software.

You responded and we rounded up the top five nominees for best online image editor. All of the editors are free so don't hesitate to jump into any editor that catches your eye and give it a test drive.

Sumo Paint

If you're expecting online image editors to be anemic, you'll be surprised by the extensive features of many of the nominees like Sumo Paint. Sporting a toolbar, image navigator, swatches, and layers, Sumo Paint does more than just crop and rotate images. In addition to having layers, as some other editors do, Sumo Paint has support for blending modes and other advanced layering magic like drop shadow and outer glow. The brushes and ink tools offer a wide variety of shapes and textures. If you like some of the paint-centric features of Sumo Paint, you'll definitely want to check out the Gravity tool, which creates some pretty interesting abstract paint effects. Sumo Paint also supports drag and drop image opening for pictures you have stored in your Sumo Paint account. Sumo Paint doesn't require a login for use, but if you sign up for a free account you can store images online and participate in the Sumo Paint community by submitting your work and ranking the work of others. Photo by Randy Son of Robert.

Adobe Photoshop Express

Photoshop Express is Adobe's offering in the online editing arena. One of the first things you'll notice, and if you're an avid Photoshop user it's sure to elicit at least a chuckle, is that out of all the online image editors in the world, the one that looks the least like Photoshop is the actual legitimate Photoshop offering from Adobe. Nonetheless, the interface is easy to use and covers the basics nicely. One of the best features of Photoshop Express is the film strip view provided along the bottom of the editor when using a variety of the adjustment tools. Instead of just giving you a slider to adjust the saturation, white balance, and other subjective photo tweaks, Photoshop Express displays the changes incrementally, letting you pick your favorite from the gradient of choices. It's much faster for quick tweaks than fiddling with sliders. If you want to use a slider, however they haven't removed the feature; the more granular slider is underneath the pictures, allowing you to fine tune to your heart's content. Under the advanced feature set, you'll find tools like tinting, sketching, and distortion. Adobe Photoshop Express is free but, unlike all the other nominees in the Hive Five, it requires an account for you to use your own photos. If you just want to play around with it, the demo account contains sets of pictures for you to play with. Photo by pasotraspaso.

Pixlr

Pixlr takes a two-prong approach to image editing. When you visit Pixlr, you can opt to use Pixlr Express or Pixlr Editor—seen here—depending on your needs. Pixlr Express is a simple image editor with a right hand toolbar which covers basic tasks like cropping, rotating, applying basic correction filters, and so on. Pixlr Editor looks like a more traditional photo-editing application, complete with a toolbar, menu bar, and even navigator, layers, and history panels. If you're familiar with desktop applications like Photoshop and GIMP, it won't take you very long to find the location of tools like the clone stamp, selection wand, and gradient map. The Pixlr Firefox extension allows you to grab images and screenshots from your browser and send them to Pixlr.

Picnik

Picnik doesn't seek to emulate desktop editors with its simple toolbar design, instead opting to make the most popular tools as high profile and easily accessible as possible. Picnik has no Photoshop-esque sidebars, palettes, or other advanced features in the main editing window. The features it provides, however, are extremely intuitive and easy to use with tool tips that pop up to help you use the various tools. If you want to tweak your photo beyond basic cropping and color correction, you can find over 30 image filters and a variety of tools (like a blemish touch-up wand) under the Create tab. A premium version of Picnik is available for $25 a year and gives you access to more advanced tools, special effects, and other perks like bulk uploading. Photo by jurvetson.

Aviary Phoenix

Aviary Phoenix is an image editor that is part of the Aviary Suite of online editing tools, which—on top of image editing—boasts a vector and filter editor, among other tools. Aviary Phoenix has an advanced interface and plenty of options to help you edit your images, like layers, blending, and magic wand selection. You can use Aviary without signing up for an account, but with an account you can save your creations, collaborate with other users, and otherwise participate in the Aviary community. The Aviary Phoenix Firefox extension, called Talon, adds in an assortment of functionality like screen capture, quick editing of images you find online, and—unique among the Hive Five candidates this week—it adds support for pressure sensitive input devices. The premium version of Aviary Phoenix is available for $25 a year and unlocks advanced features and the ability to save your work to your Aviary account without adding it to the public area of the Aviary community. Photo by tinyfroglet.

Wednesday, July 01, 2009

Essentials for 'About Me' Page

The "about me"-page is one of the most overlooked pages in development and one of the highest ranked pages on many websites. In a world that's becoming increasingly connected through the Web, it's important that you engage your audience in a personal and friendly way, otherwise you risk just being another faceless web designer among a sea of websites.

We had to go through hundreds of sites to come up with the following list. It seems most designers and developers run out of steam by the time they got around to developing their about pages. Most designers we came across simply threw up a few hastily written words about themselves instead of treating the page as an important asset. Others, however, have truly taken the time to treat their about page as if it were important as the home page. In fact, some went as far as using their about pages as their home page.

We present 60 beautiful and effective about pages that engage users and neatly present their designers. We also examine the growing trend of Business Card Websites (BCW's).

Unique "About"-Pages

A great way to distinguish yourself from the crowd is to have a truly unique about page.

Dustin Curtis has taken a truly unique approach to the about page. What he has created is a death clock of sorts; a timeline of his life up until now and to beyond. It's an about page that truly speaks to the designer's capabilities and creativity. It accomplishes the most important thing about a website and a great about page - it's something you won't soon forget.

Screenshot

While the content is slight, the "Floating Asian Kid" gag below is cute. Move your mouse around the graphic to see why. It is both memorable and unique

Screenshot

Quomo has taken a very unique approach to the about page - a series of full-body action shots on a horizontal carousel.

Screenshot

Jared has taken a very clever approach to the self portrait (quite literally).

Screenshot

Mark has put his face on Mount Rushmore.

Screenshot

Guðmundur has used big typography and an interesting perspective for his portrait.

Screenshot

Big Photograph

A large photograph of yourself can leave a lasting impression in your users minds if it's done well.

The more we use computers to communicate, the less face-to-face interaction we get. This is why David DeSandro's about page is so effective. His headshot is as big as any I've seen on an about page makes you really feel as thought you're meeting a real person rather than some web designer on some website. Once the introduction is made, you can easily connect up with David via his social networking presence or the handy contact form below his picture. It's worth noting his about page is well organized as well.

Screenshot

Janis' about page is short on copy but big on artistic design. You get a good impression in short order.

Screenshot

Subtraction.com, in addition to being one of the coolest domain names ever, is a picture perfect study in minimalism. Khoi chose an incredible picture for his about page and organized his biography into an easily digested format. It doesn't hurt that he threw his adorable black lab in there for good measure.

Screenshot

Screenshot

Aside from having an incredibly awesome domain name (unstoppablerobotninja.com), Ethan has a great about page too.

Screenshot

Well Organized

The best about pages we found were the ones that had a lot of information but were excellently organized, making them easily digestible. When faced with the task of creating an about page, it's easy to get overwhelmed and put it off indefinitely because the subject you are dealing with is yourself. It is a subject we know more about than anything else and it can be difficult to know just how much and how little we should tell the world about ourselves. A good about page must be informative without being too wordy.

Jason is Creative Director for A List Apart and it's clear why. He has pioneered the idea of the "fast design direction" approach to updating websites, a method where instead of doing a major re-design of a site after a long period of time, each article or update gets its own unique design. David and Dustin from above use the same sort of system. Jason's about page is clean, organized, and personable. We can see at a glance what he has written elsewhere, what he's about, and what he's capable of.

Screenshot

Joseph makes sure to give thanks and credit where it's due on his about page.

Screenshot

The 2-column layout used by Travis neatly encapsulates everything about who he is and what he does. You can easily scan for the information you need.

Screenshot

SimpleBits has always been an inspiration to many web designers and it's no surprise Dan Cederholm's about page is one of the best organized and informative out there.

Screenshot

Jon Tangerine is a master of typography. The first time I visited his site I was amazed at what he was able to accomplish without the help of sIFR or other font rendering engines. His about page is a joy to view. Every section is deliberate, informative, and attractive.

Screenshot

Douglas Bowman is a creative director for Twitter and has been working on the web for as long as its been around. His about page is succinct and entertaining. We as graphic designers get exactly what we want in the section devoted to previous design iterations of his website over the years. Check out his footer when you're on the about page, too, for a bit of cleverness.

Screenshot

Screenshot

Screenshot

Screenshot

Screenshot

Bubs has quite a lot of information but it's neatly categorized and amusing.

Screenshot

Screenshot

Screenshot

Screenshot

Screenshot

Screenshot

Front and Center

Some designers have gone as far as making their about pages their home pages.

Toby's about page is actually his home page, which for a personal website (and formal name as his domain name) is a great idea. After all, if we're visitng Toby's site for the first time it'd be nice to know who the designer is. He also flips the large portrait concept on its head by giving us a large silhouette where it's supposed to be.

Screenshot

Jason Reed uses an excellent hand drawn illustration portrait as his about page centerpiece, and his about page in turn is his website's centerpiece and the first thing you see when you land on jasonreedwebdesign.com. His professional details are neatly organized into a horizontal accordian and there's no fluff - just the most important information one might want to know when considering Jason for a freelance project.

Screenshot

This website is hard to ignore not only because of its striking yellow background, but Bjørn's organization of information.

Screenshot

Vlad has a very distinct goal in mind with his site and he accomplishes it with great typography and layout.

Screenshot

Kyle pokes fun at the traditional folio site with his one-page offering. You can easily find out all about him and his internet presence.

Screenshot

Direct

A few of the about pages had very deliberate goals.

Jonny gets straight to the point with a mission statement and a brief summary of who he is.

Screenshot

Nick has created an extremely professional about page, complete with testemonials, great portrait, and a press kit to boot.

Screenshot

Suzy sums up herself up well in one sentence, goes into depth for those who are interested, and gives straightforward information about her capabilities and availability.

Screenshot

Dan has a clever portrait and a great succinct description of his talents and abilities complete with his resume and a link to contact him.

Screenshot

Screenshot

Screenshot

Screenshot

Minimalist

A minimalist approach can be a great way to convey important information about yourself without distracting the user.

Screenshot

Screenshot

Screenshot

Screenshot

Screenshot

Garret actually acknowledges the fact that his about page is more popular than he first thought it would be, citing this as the reason for giving it more attention.

Screenshot

Screenshot

Screenshot

Screenshot

Drop-Down

A few of the about pages we found were actually accessible not from a traditional page but an ajax driven drop-down modal. It's a great way to make the information about yourself easily accessible to anyone from any page without forcing users to navigate away from the page their currently reading.

Brynn's about page is always easily accessible via a drop down effect. This also doubles as her contact form.

Screenshot

Screenshot

Business Card Websites (BCW)

Made By Elephant's Tim Van Damme recently started a trend he coined Business Card Websites (BCW), or specialized contact/about pages for individuals that are heavy on ajax and great design. Once Tim got his BCW online other designers started following suit. BCW's are a great place to send people if they want to get an overview of your social networking presence, portfolio and capabilities, contact information, etc. We have a feeling we're going to start seeing more of these pop up in the near future. Here are a few of the best we've found so far:

Tim has three tabs on this BCW which tell you how to find him on the net, who he is, and how to get in touch with him.

Screenshot

Rogie King runs Komodo Media, and his BCW retains some of the design elements he uses there. Great consistency.

Screenshot

Michael's BCW has a stunning underwater effect with appealing organic treatments.

Screenshot

Matthias blogs over at kremalicious.com and has also chosen to keep his design consistent across his BCW.

Screenshot

Daniel has taken a minimalistic approach that works quite well. It's clean, simple, to-the-point, and friendly.

Screenshot

Screenshot

Screenshot

Screenshot

Screenshot

Screenshot

There you have it: 60 beautiful and effective about pages from personal websites, blogs, and portfolios. Hopefully this will inspire you to revisit their about pages and come up with some unique and innovative ways of representing yourself on the web.