Friday, March 28, 2008

Using Greasemonkey to "fix" a webpage

Do you use a webpage that doesn't quite get the job done? Is there just something missing? Greasmonkey to the rescue. Greasemonkey is an addon for Firefox that allows you to "fix/hack" web pages. You add different scripts to Greasemonkey that hack the page you are visiting. When the page loads, the Greasemonkey script that goes with that page is run. The script doesn't actually hack the web page on the server, it alters the way you see the web page on your computer. You can find Greasemonkey scripts here. These scripts do such varied things as adding a currency converter to eBay, a auto save for web text boxes, a bunch of stuff for Facebook (get rid of adds/spam all your friends/change page colors/make peoples profile pictures larger), etc. Heres a good run down of some good scripts.Lifehacker lists some good ones too.

Heidi likes the scripts that allow you to change the Facebook colors that you see. She really liked the Easter theme that changes the logo into an Easter basket.

I like the ability to create my own Greasemonkey scripts. One thing I've fixed with Greasmonkey is those stupid photographer's sites that don't allow you to right click (yeah like its a big deal that I grab a 360 by 240 picture of myself). Heres the code:

// ==UserScript==
// @name RightClick
// @namespace *
// @description ReEnable Right Click
// @include *
// ==/UserScript==
var eltHead=document.getElementsByTagName('head')[0];
var eltScript=document.createElement('script');
eltScript.setAttribute("type","text/javascript");
eltScript.innerHTML="document.oncontextmenu=null;"
eltHead.parentNode.insertBefore(eltScript, eltHead.nextSibling);

Monday, March 17, 2008

Testing ScribeFire


I've been searching for a blog editor that is compatible with blogspot blogs for a while now. GoogleDocs has been the best but has some annoyances - especially with images. This post is a test of the ScribeFire plugin for Firefox. ScribeFire installs in the lower right hand of Firefox . Configuring ScribeFire was really easy. I simply added this blog into the tabs on the right of the program

The Toolbar


As you can see the toolbar has all the basics. One thing I would like to see is the ability to use styles - this would be complex because I embed my styles in my Blogger template, you could also post a css file somewhere on the web and use that.

Pictures

Uploading pictures was also really easy. ScribeFire gives you a choice of whether to upload via FTP (file transfer protocol) or Blogger's API (application programming interface). The API method is what Blogger uses natively so thats what I want to use.



The Blogger editor has a nice feature that lets you link to a bigger version of an image you uploaded. ScribeFire doesn't do this but I was able to by copying the URL of the image I uploaded in the HTML window (click the tab) and then clicking on the image and adding the URL as a link () - NOTE: I have an issue with this that I'll solve later.

Comparison with other blog editors


I've tried Blogger, Adobe Contribute, Word, and GoogleDocs as blog editors. Blogger is just clunky - for one - its in such a tiny window that it is infuriating. For another, inserting pictures always puts them at the top of the post - ScribeFire puts them where ever the cursor is. Contribute is just messy. Word wont do images. GoogleDocs has poor integration with Blogger (a Google product). GoogleDocs also substitutes its own context menu when the right mouse button is clicked - this interrupts the Firefox spellcheck feature which places suggested spellings in the context menu. ScribeFire solves all of these problems and only leaves a few items on my wish list.

Bugs
Biggest bug - ScribeFire returns an error when trying to embed YouTube video in Blogger and strips the video when editing posts with video embedded with Blogger's editor.

Ahead of the curve - Using Songbird to discover indie music

Songbird Get Songbird is what might be known as a website mashup application. Songbird combines a web browser (based on the Mozilla core) with an itunes like music playing interface. When pointed at a website containing video and music, Songbird creates a list of available media and displays the files at the bottom of the screen. Songbird then allows users to demo the music and add it to playlists if its any good.

I use Songbird to cruise the indie music blogs and check out new music that artists have released for free in the hopes of obtaining some free publicity. Joel showed me SixEyes, which is where I've discovered cool artists like Basia Bulat and Hymns.


Songbird has the potential to far exceed iTunes in terms of innovative solutions because of its Mozilla based plugin model. There is a plugin that will look up artists on Wikipedia as well as the ability to search for other songs by the artist and for lyrics.

__________
Fav This Post!

Sunday, March 16, 2008

Getting artistic ideas from GfxArtist.com


I dabble in digital art a bit and as far as I'm concerned, there is only one site out there for digital art, GfxArtist. Its a really good place to get good ideas or just to see what people are doing. I mess with 3Ds Max/Photoshop/etc. but thats more about mastering techniques for me than art. With photography though, I use GfxArtist as a resource to study angles, lighting, etc. Photography that works always has that special something, a confluence of all the variables, that just clicks. GfxArtist is a place to find art that "clicks" and to try to find out why. I feel that, whether I can isolate the effective variables or not, by just studying the art, my eye becomes more attuned to capturing the right perspective. GfxArtist's photo section is found here
__________
Fav This Post!

Monday, March 10, 2008

Cutting out people and objects in Photoshop

I'm writing this for Candy in the hopes that art can help her find some catharsis in self expression and because I didn't do a very good job of helping her when she was at my house.
One of the coolest techniques I've found for photo manipulation in photo shop is the pen tool. The pen tool allows me to accurately, isolate, outline, and cut objects out of photos.

Getting Started With The Pen Tool

There are two types of pen tools, the ordinary and the free form . The ordinary Pen Tool allows you to place points to create lines and curves, the Freeform allows you to just draw you lines and curves. The Freeform is more natural but unless you have a Wacom tablet and are proficient, the ordinary Pen Tool is far more precise. You can find these tools on the Tool Palette (pictured at right). You can switch between the different pen tools by holding down the left mouse button on the Pen Tool on the Tool Palette to bring up a Tool Flyout (pictured at left) or you can type Shift + P to switch between the tools.

First, lets open a picture. Go to the File menu and select Open (or hit Ctrl+O), then select a picture you would like to cut a person/ thing out of. Once your picture is open, select the ordinary Pen Tool. At the top of the Photoshop window, you will see these symbols For isolating objects in a photo, we want to create a Path, rather than a Shape Layer or Fill Pixels. Select Paths.

Creating Lines And Curves

Now we will trace the object we want to cut out by placing points with the pen tool. Place a point on the boundry of the object you want to cut out. You can continue to place points and straight lines will "connect the dots." However, if your object is curvy, straight lines wont do much good. You can create curves by holding down the left mouse button and dragging when you place another point. Don't worry about matching the contours of your object perfectly at this point. I'll cover precision next.

After you have gotten at least three points down we can start to attempt to perfect the curves. You can do this selecting the Direct Selection tool (get this from the Tool Palette or by holding down Ctrl), clicking on one of your points and
then manipulating the grabber lines that pop up (these are the lines sticking out of the point in the image above, they have a grabber point on each end). As you try this, note that the handles are attached to each other like a seesaw, move one side up and the other moves down. This can be corrected by grabbing the grabber point with the Convert Point Tool (get this from the Tool Palette or by holding down Alt while hovering over a grabber point) - see the example at right. The Convert Point tool can also be used to convert straight lines to curves. Just click and drag a point with the Convert Point tool. To get back to placing points, use the Direct Selection tool to click your last point (it will go from an empty circle to a filled in one).

When working with these points, it may be helpful to zoom in. Do this with the Zoom Tool (get it from the Tool Palette or type Z). Also it may be nice to move around the image quickly while placing points. Use the Hand Tool (get it from the Tool Palette or hold down the Space Bar while left clicking). If you need to add points in the middle of a line, use the Add Anchor Point tool

When you are ready to complete you path by connecting your first and last points, you can hover over the first point and the pen tool will display a circle symbol. My result is below:

Convert The Path Into A Selection

First open the Paths Palette by clicking on the Paths tab on the Layers Palette (see right - squared in red). At the bottom of the Paths Palette, there is a bar with six symbols on it Select Load Path As Selection (circled in red). Your object should now be selected.
Once selected, the object can be cut out and pasted somewhere else, or the background can be cut out. To cut out the background, the selection needs to be inverted. Go to the menu Select -> Inverse or type Shift+Ctrl+I. Next delete the background by hitting the delete button. The end result is shown below: