Tipsの最近のブログ記事

日本語の入力に使っていたegbridge universalが開発中止されて久しい。
Snow Leopardでもegbridgeは動作するものの、突然ハングアップするので代わりになるものを探していたが、自作したユニバーサルパレットの「クリップボードのURLからリンクタグを作るスクリプト」がブログを書くのに便利すぎて、他の入力ソフトを使うことができなかった。

http://chinoken.net/blog/images/2009/20091126_01.png
(リンクタグclipbpardってやつ。今スペルを間違えていることに気づいた)

ユニバーサルパレットの代わりになるものがしばらくなかったが、Snow Leopardになって「サービス」で代用できることがわかった。

作り方は、
Automatorを起動して新規 > サービスを選ぶ。
 ↓
"サービス"は、次の選択項目を受け取ります:テキスト 
検索対象:すべてのアプリケーション
選択されたテキストを置き換えるにチェック
 ↓
Automatorの「AppleScriptを実行」を追加する
 ↓
AppleScriptを書く
(Universal Palette Plug-InsのAppleScriptを少し改造するだけで動く)
 ↓
サービスに保存
例として「クリップボードからリンクタグ」と名付けて保存。

これで、任意のテキストを選んでCtrl + クリックするとサービスの中に「クリップボードからリンクタグ」が現れて使うことができる。

http://chinoken.net/blog/images/2009/20091126_02.png


ぐだぐだと能書きをたれましたが、「クリップボードからリンクタグ」のスクリプトをダウンロードできるようにしました。

  ダウンロード:「クリップボードからリンクタグ」(clipboard_link.zip)

解凍して
(ユーザ):ライブラリ:Services
に放り込めば使えるようになるはずです。

紹介、改造、配布は自由です。使ってやってください。
紹介していただけたら一言いただけるとうれしいですが、必須ではありません。

++++

もちろん物書堂の「かわせみ」に移行するつもりです。

DTP計算機

DTPに関した計算を行う「DTP計算機」というDashboardウィジェットをリリースしました。

http://chinoken.net/blog/images/2009/20090131_01.png

・級・ミリメートル・ポイント・インチの単位換算
・文字サイズ・字間・行間・文字数・行数による文字ボックスのサイズを計算
をします。

詳しい説明とダウンロードはこちらから。
 DTP計算機

++++

以下、雑感。

作ったのは良いんだけど、文字ボックスの計算ってInDesignだったらレイアウトグリッドがあるからやらないんだよね。使う人あんまりいないかもしれないけど、もうひとつ実装しようと思っている機能に必要なのです。予告です。

AppleのDashboardウィジェットページにも掲載申請。何日ぐらいで載るんだろう、これ。

JavaScriptにまだ慣れないなー。本屋で解説本を立ち読みしたが、どれも中身がハデハデなのはなぜなんだろう。リファレンス本もなんかいまいちな本が多い気がする。慣れですかねぇ。

次はなに作ろうかなー。

画像を軽くする

「デジカメで撮った画像をブログに載せたいが、重すぎて載せられない。画像を簡単に縮小して軽くする方法はないか」
と友達に相談された。他の人に相談したときはPhotoshopかGraphicConverterを使えと言われたが、使うのが難しいとのこと。

それでは、ということで640px72dpiと直感的な名前のAutomatorワークフローを作りました。
iPhotoに入っている画像を指定すると、長手方向のサイズを640ピクセル、解像度を72dpi、ファイルサイズを100KB以下にしてデスクトップに保存します。Macでロリポブログを使う人は便利だと思います。

ダウンロードはこちらから。
Mac OS X 10.4 Tigerの人→ 640px72dpi for Tiger
Mac OS X 10.5 Leopardの人→ 640px72dpi

インストールがちと複雑です。
詳しくは解凍したファイルに入っているRead meをご覧ください。

【追記】
インストールが面倒くさくないものも作りました。
640pxにはしますが、72dpiには変更しません。Mac OS X 10.6で動作します。10.5は未検証です。
640pxSL

昨年末に卓上の良いカレンダーをもらうことなく年を越してしまった。買おうかと思って「数字のみ」「小型の卓上」「月曜始まり」を条件にして探したが、気に入ったものが見つからなかった。
じゃあ作ってしまおう。IllustratorとJavaScriptで。

さて、まずはググってみる。「Illustrator カレンダー」などと検索するとJavaScriptで作ったよ! とか、数字データあるよ! などと先人によるありがたいモノが出てくる。ここはJavaScriptでやってみたい。
JavaScriptは「クリエイター手抜きプロジェクト[105]Illustrator CS/CS2編 一年分のカレンダーを自動生成する(1)」のものを(勝手に)使わせていただいた。ありがとうございます。

これをそのまま実行すると日曜始まり・RGBカラーながら、すぐにカレンダーができあがる。すごいなー。

http://chinoken.net/blog/images/2009/20090105_01.jpg

これを月曜始まり・CMYKカラーになるよう小細工を加えて再実行。できあがったものは以下の通り。

http://chinoken.net/blog/images/2009/20090105_02.jpg

このJavaScriptは振替休日を判定しないので注意。処理がちょいと面倒なことになるのだろう。2009年で言うと5月6日と9月22日だ。できあがったカレンダーは暦要項を見て確認しよう。
上の画像にはないけど、英語の月も入る。

日曜始まりでCMYKカラーのカレンダーを作りたい人は、ファイルをテキストエディタで開き、
kMondayStart = true;

kMondayStart = false;
と変更して保存、実行すると日曜始まりで生成される。

ダウンロードはこちら。
MonStartCalender.zip

解凍すると、月曜始まりカレンダー作成.jsx というファイルができるので、これをIllustrator CS3 > プリセット > スクリプト の中に入れてください。Illustratorを起動してたときは、再起動してください。
ファイルメニューのスクリプトから使えるようになります。
動作環境はCS2、CS3では動きましたが、CSがないので未確認。CS以降で動くと思います。

++++

免責とか
・許可なしで再配布OK。
・お金をとってはダメ。
・改造OK。「こうしたほうがいいよ」「改良したよ」などありましたら、ぜひご連絡ください。
・「オレが作った」って自慢したら呪う。
・元のJavaScriptを作った古籏一浩さんに感謝すること。
・このプログラムを使って損害・障害が起きても責任はとりません。

++++

自分のカレンダーはまだできていません。

SillyBalls イラレ版

今回は覚え書きです。

++++

Macのプログラミングをやっていたころ、プログラムの参考として「SillyBalls」というサンプルアプリケーションがあった。直訳すると「バカ玉」ってところでしょうか。
ウインドウの中にランダムの位置にランダムの色で円を描き、その中に「Bob」と書いていくだけのアプリで、プログラミングの練習として何度かお世話になった。

前からこの「SillyBalls」をIllustratorに移植したら面白いんじゃないかと思っていたが、どうやって作るか迷っていた。プラグインで作るのがベストだが、かなり大変になりそう。試しにプラグインのサンプルコードをコンパイルしてみたが、プラグインが生成されずよくわからん。とっととあきらめ、JavaScriptで書くことにした。

IllustratorをJavaScriptで動かす方法はOpenSpaceというサイトが大変参考になる。使えそうなコードを見ていたら、ほとんどそのもののプログラムがあった。これをベースにして自分なりに改造したらプログラムが完成。すぐできたわ。

実行するとこんな感じのタマが

http://chinoken.net/blog/images/2008/20081125_01.png

ズドドドドとドキュメント全体に描画されるのであります。

http://chinoken.net/blog/images/2008/20081125_02.png

1回の実行で40個のタマを描く。上のは4回実行したのでタマは160個あるはず。
手打ち設定ながらも、タマの大きさ・数、CMYK各色の最大値を設定しやすくした。色をすべてMaxで設定すると400%になることもあるので要注意だ。プラグインなら設定ウインドウで値を設定して実行!できるんだけど・・・・。

タマがところどころ固まってるように見えるのは、疑似乱数ってやつなのでしょうがないのかな。色も似たような色あいになるときもある。
余談だけど、疑似乱数を発生させる方法で「メルセンヌ・ツイスタ」って必殺技ぽいのがあった。竜巻出るね。

ぱっと見は役に立たなさそうだけど、応用は効きそう。円じゃなくて★や四角もできるし、「色をランダムで設定」てのがスプレーツールじゃできないようなので、それだけでも使えるかも。

営団地下鉄のフォント

「帝都高速度交通営団」という男前な名前から「東京メトロ」になってしばらく経ったが、「営団地下鉄」時代に設置された駅名表示に使われているフォントが気になっていた。よく紹介されているゴシック4550ではなく、このフォントのこと。

http://chinoken.net/blog/images/2008/20080424_01.jpg

http://chinoken.net/blog/images/2008/20080424_02.jpg

すっきりしっかりした印象と読みやすさとがあって気に入っていたが、特に調べず。

先日ふと思い出して、ちょこちょこっと調べてみたら「タイプバンクゴシック」だとわかった。
ウエイトは駅名の漢字がDBでひらがなはMのような気がする。ちょっと平体がかかってるぽい。欧文はAkzidenz-Grotesk。

駅の中をよくよく見ていたら、いろいろなところに使われていた。

http://chinoken.net/blog/images/2008/20080424_03.jpg

さっきの駅名表示はまわりに人がいる中、コソコソ撮ったよ。

東京メトロになってからは新ゴ&Frutiger、Z14などの駅番号はFutura Bold。
Frutigerは良いが、新ゴはサインに使うフォントとしては向いていないと思う。「都会的」「親しみやすさ」を重視して肝心の「読みやすさ」が犠牲になっている。

ゴナ vs 新ゴ

「ゴナ」と「新ゴ」といえば、アレな書体だ。

街中で氾濫している書体だけど、どっちがどっちだかわからない。
そんなアナタにゴナと新ゴの見分け方をちょっと紹介。ゴナを見つけたときは、ギザギザの10円玉をもらったときのような感覚になります。

ゴナD[DNAG]
http://chinoken.net/blog/images/2007/gona.gif


新ゴR
http://chinoken.net/blog/images/2007/shingo.gif

漢字は見分けづらいのでかなで見分けます。

・ま 横棒の上が短いのがゴナ。長いのが新ゴ。
・た 最後の入筆がクルっとなっているのが新ゴ。
・あ、か まるっこいのが新ゴ。
・る 上側が左に寄って見えるのが新ゴ。
・な 右上の点が直線なのがゴナ。やや丸みがあるのが新ゴ。
・全体的には、新ゴの方がまるっこい。

それと、例文に他意はありません。
(「愛のあるユニークで豊かな書体」と「名前はまだ無い」から取った)

PDFにちょっとした修正を入れたり、EPSファイルにして印刷に使いたいときなど、体裁そのままにアウトライン化したいことがある。
フォントが埋め込まれたPDFをアウトライン化するにはAcrobat Professionalを使う方法があるが、透明のオブジェクトを作って云々と少し手間がかかる。そこでIllustratorを使用した方が簡単にできるが、あまり紹介されていないようなのでその方法を書いておきます。バージョンはCS以降で可能。

QuarkXPressのファイルをInDesignで読み込むと、テキストフレームの文字が少し上にズレてしまう。

060907_1.gif060907_2.gif

左 Quark  右 InDesign

これは、InDesignのテキストフレームに変換したときに「テキストフレーム設定>ベースラインオプション>先頭ベースライン位置>オフセット」が「アセント」などに設定されてしまうため発生する。
この設定を自分で「仮想ボディの高さ」に直せば問題は解決するが、数個のテキストフレームならまだしも、何ページもあるドキュメントでは修正する手間がかかりすぎる。
小技で回避できそうにないので、InDesign用にスクリプトを書いた。

このスクリプトを実行すると、ドキュメントのなかにある、すべてのテキストフレームの先頭ベースライン位置を「仮想ボディの高さ」に直してくれる。テキストフレームの中に埋め込まれたテキストフレームも修正する。

注意点としては、
・マスターページにあるテキストフレームは直さない。
・「アセント」以外に設定されていても、すべて「仮想ボディの高さ」に設定される。
・QuarkXPressのファイルをInDesignで読み込んだ直後にこのスクリプトを実行するのがよいと思う。

ダウンロードは↓から。Zipで圧縮してあります。

to_emboxHeight.jsx.zip

Mac OS Xなら勝手に解凍されるか、ダブルクリックで解凍できるはずです。
解凍すると、
to_emboxHeight.jsx
というファイルができるので、アプリケーションフォルダのInDesign CS2_J:Presets:Scriptsの中にコピーしてください。

InDesign CS2用としてつくってありますが、拡張子を「.jsx」から「.js」にするとInDesign CSでも動いた。Windowsで動くかは未確認。

(9/9 追記)
このスクリプトでは、グループ化されているテキストフレームの設定は変更されないことがわかった。
グループ化を解除してから実行すればOKだけど、それもナニですね。解除されていなくても変更できるように改造してますのでしばらくお待ちを。

(9/11 追記)
グループ化されてても「仮想ボディの高さ」に設定されるようにしましたー。
ちなみに、ロックされているテキストフレームでも変更されます。


--- 免責とか ---

・許可なしで再配布OK。
・お金をとってはダメ。
・改造OK。「こうしたほうがいいよ」「改良したよ」などありましたら、ぜひご連絡ください。
・「オレが作った」って自慢したら呪う。
・このプログラムを使って障害が起きても責任はとりません。

おにぎり型の描き方

会社の昼ごはんはおにぎりをむすんでいって食べています。
おにぎりを食べながらYahoo!ニュースを見ていてふと思った。Illustratorでおにぎり(三角)ってどう描くんだ?

060630_2.gif

家に帰ってからIllustrator本を見ていたらおにぎり形の描き方が載っていたが、それっぽく適当に角丸めてね、といった説明だった。ダメだそんなの。

簡単に描けそうだと思っていたが、いろいろ試してみてもうまく描けない。
あきらめてフロに入ったら思いついた。というわけで、おにぎりを描く方法です。

ウズウズ

蚊は飛んでいないが、蚊取り線香を思い描いていた。
あのウズウズを描くにはどうしたらよいのだろう。
ネットで探してみたら簡単な描き方は見つけたが、すこし形が崩れて見えてしまうのだ。

ぼんやり考えているうちに、きれいにできそうなやり方を思いついた。

1)楕円ツールで適当な、小さめの正円を描く。線の太さは適当に(例では15pt)。
2)ダイレクト選択ツールで上のポイントだけ選択してカット(要するに上半分をカット)。前面へペーストする。
3)変形パレットを出し、支点(というのか?)を左下に。
4)ペーストした半円を、変形パレットで縦横比率を固定してWかHに「+32pt」を入力してリターン。この数値は、線の太さx2と線の左右の余白分として1ptずつの2ptを足した数。
5)拡大した半円を、リフレクトツールで水平を軸にしてコピー。
6)右側のポイントを合わせる。
7)変形パレットで、今度は支点を右上に。4)と同様に拡大。

・・・とやっていくと、こうなる。

katori3.gif

あとは順次、3)〜7)を繰り返していけばよいわけだ。出来上がったらパスを連結して、パスのアウトラインをとる。あとは中心部分を適当に作ればできあがり。
このようになります。どうでしょうか。

katori1.gif

とはいうものの、蚊取り線香は2本が組み合わさって箱に入っているもの。中心部分がぞんざいだとちゃんと組み合わない。
ここはうまいやり方が思い浮かばないので地道に修正。
ウズウズを180度回転コピーして組み合わせ、隣り合う曲線が均一になるように修正、また回転コピーして修正、を繰り返していく。

で、ちゃんと2個が組み合うようになった。

katori2.gif

ふう。
みんなついてきてるでしょうか。心配です。

できあがりのEPSファイルをダウンロードできるようにしておきました。適当に使ってやってください。
蚊取り線香ファイル(katorisenko.eps:約770KB)

久しぶりに見た

このマーク見たことある人、手を挙げて。

ba_90.gif

名前は写植の「記号BA-90」といいます。
Illustratorのデータないかなと思って探してみたけど見つからず。ならばトレースだ。描いた。
欲しい方はここをクリック。EPSファイルです。

携帯のサブディスプレイにしてみたよ。

ReplaceMe

<このブログに書いておいた方が便利っぽいので再掲載します。>

Illlustratorで、スポーツ紙の見出しのような効果ができないか考えてみた。
こんなの。

michel.gif

それっぽくできたでしょ。

で、スポーツ紙の見出しの作り方(3D使うからIllustrator CSでないとダメかな)

1.見出しにしたい字を打つ(72ptでやってみた)
2.文字/アウトラインを作成し、グループ解除しておく(解除しないで3D効果をくわえたときに、行が傾くのを防ぐ)
3.適当に色をつけておく
4.文字を全て選択し、効果/3D/押し出し・ベベルでX軸とY軸の回転角を5度、Z軸は0度にする
5.アピアランスの分割をする
6.ダイレクト選択ツールで文字や押し出し部分を選択し、適当な色をつける
7.全体を選択し、背面にコピーする
--ここから背面にコピーしたオブジェクトの作業--
8.パスファインダで分割
9. パスファインダでoption押しながら形状エリアに追加
10.オブジェクト/パス/パスのオフセット、または効果/パス/パスのオフセットで0.5mm/ラウンド/角の比率4で作成
11.適当に色を付けて完成!

-ちゅうい-
・背面にコピーしたら、レイヤーに分けるとやりやすいよね。
・文字によってはパスのオフセットをとったときにちょっと乱れるときがあるので、作ったら確認しておこう。ちなみに、8、9のようにやるのは、いきなり形状エリアに追加するとパスの乱れがでるため。「人面魚」で作ったら「人」という字で発生したよ。
・8、9をやると文字によってはパスのポイントが異常に増えることがある。そうなったらスムーズツールで削ろう。ポイントが増えた部分を一気にやると形が変わってしまうので、アウトラインをとった文字を見ながらポイントからポイントまでやるようにするときれいにできる。
・「アクション」でできるかも。

東スポ 、さすが。

コルクをつくる

cork.jpg

仕事でいじっていたら、こんなのができるようになってしまったのでやり方を大公開。Photoshop 6.0でつくりました。
ヒマなら試してみてくれ。

Photoshopでコルク風画像をつくる

・新規画像をRGBモードで適当につくる。最初からあるレイヤーを「レイヤーA」とする。
・レイヤーAを「寒色系うす茶色(R203, G185, B157)」で塗りつぶす。
・フィルタ>テクスチャライザ... を選択し、「テクスチャの読み込み」でPhotoshopのフォルダ:プリセット:テクスチャにある「曇りガラス.psd」を選択する。
・レイヤーAをコピーする(レイヤーBとする)。レイヤーBは乗算にしておく。
・レイヤーBをトーンカーブで適当に明るくする。

【Photoshop 7.0では】
・レイヤーBをコピーする(レイヤーCとする)し、レイヤーCは中間に置く(AとBに挟まれている)。レイヤーCはオーバーレイにする。
・レイヤーCに、フィルタ>描画>テクスチャ効果... でPhotoshopのフォルダ:プリセット:テクスチャにある「さび.psd」を選択する。

【Photoshop CSでは】
・パターンメーカーを使う。
・「さび.psd」を開いてすべて選択&コピー。
・一番上に新規レイヤーを作成、描画モードをソフトライトにする。。フィルタ>パターンメーカー...を選択。タイルの生成の「クリップボードからサンプル」にチェック、画像サイズを使用をクリック。他はデフォルトのまま(オフセットなし、滑らかさ:1、サンプルサイズ:5px)生成をクリックしてOK。


以上でコルク風画像ができあがり。
あとは自分の好みで加工してください。

ちなみに。
・「曇りガラス.psd」をテクスチャで貼るのは立体感を出すため。なくてもできる。
・レイヤーCをBの上に持っていくと、コントラストの強いコルクになる。
・「曇りガラス.psd」を適用すると、画像の上の部分に横筋が入ってしまうので、横筋を消した画像を作るとよいかも。
・で、切り抜きツールで横筋をなくした画像を作って適用してみたら、はっきり継ぎ目が現れた。パターンブラシで消した。
・切り抜きツールじゃなくて、最初からパターンブラシで消せばいいじゃん。
・「写真を貼りつけたコルクボード」を描きたかったんです。

January 2012

1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31        

Twitter

(twitter)

Photo

アーカイブ

ウェブページ

Powered by
Movable Type 4.25