{Carrer web log}

Blog about web design & development

Draw Shapes in Photoshop with JavaScript

Monday, October 24, 2011 { 4 Comments }

I was working on the Photoshop Wireframing Kit update and I wanted to optimize the drawing of some photoshop vector shapes. Few designers know that JavaScript, VBS and AppleScript can be used to optimize the Photoshop workflow. The cool thing about JavaScript in Photoshop is that will run on both PC and MAC.

I was googling and searching for solution for my scripting problem when I stumbled upon this forum post (look for Mike Hale answer) http://www.ps-scripts.com/bb/viewtopic.php?f=14&t=1802&start=15 . I did some small changes in the code - making it function that will accept multiple parameters (coordinates). All the credits for this code goes to Mike Hale he is the author of the code.

What this script does?

Basically what this script does is draws pixel precise shapes in Photoshop with the help of JavaScript.

You need to put Photoshop coordinates in clockwise order and Photoshop will draw the shape.

Example of Square:

// [X,Y], [X,Y] coordinates in clockwise order

DrawShape([100, 100], [100, 200], [200, 200], [200, 100]); // Square

DrawShape([512, 128], [600, 256], [684, 320], [600, 386], [686, 514], [512, 450],[340,512],[428,386],[340,320],[428,256]); // Star

Result in Photoshop:

You can also set the background color inside the script.

The script:

Gist on GitHub

Direct Download

For installing this script you need to download DrawShape.js script copy the script inside Photoshop > Presets > Scripts - Folder

For running this script you need to go to open Photoshop and than File > Scripts > Browse find the script (where you previously copied it) and click Open.

Change the coordinates inside DrawShape(); to personalize the script.

I only did some tests in Photoshop CS5 but should probably run in some previous versions.

Any comments?

Initiative - provide JSON and JSONP RSS Feeds

Monday, October 10, 2011 { 6 Comments }

JSON has won against XML. Because is lighter and simpler.

Many web services are giving priority to JSON over XML. But the all the blogs are still stuck with XML RSS.

So why give JSON and JSONP RSS support?

- JSON is Fat-Free Alternative to XML (save some bandwidth).
- JSON has been chosen like primary format in almost all major public web services.
- JSONP is easiest and fastest way to directly connect the browser with the web service.
- Growing need of building native web apps who can connect directly with the data source.
.. and probably many other reasons.

This initiative comes from my personal frustration … every time I want to build some web app who needs to talk with RSS and JavaScript I need to use some public proxy like YQL or some other server side XML to JSON solution. JavaScript and the browsers had grown much in the last couple of years, we could start using the browser JavaScript engine speed for some heavy lifting. Implementing JSON and JSONP like an alternative to XML(RSS) is very easy process.

I think if some of the major blog players like Blogger, Tumblr, WordPress, Posterous provide JSON RSS support everyone else will follow.

That doesn't mean that we should kill XML RSS it means just providing alternative JSON support.

If you agree with me help me spread the word. Thanks!

RSS IconTwitter icon Twitter icon Twitter icon

About Me <<<

Name: Vladimir Carrer
vladocar [at] gmail.com
Location: Verona, Italy
I'm a web designer, developer, teacher, speaker, generally web addicted ...

My projects <<<

§§Previous Posts <<<

Hand Drawn Icons

§Archives <<<

Other Profiles <<<

View Vladimir Carrer's profile on LinkedIn

Content is licensed under a Creative Commons Public Domain License