design-art Archive

2010年モデルのiPod nanoをリストウォッチにできる！ やわらかく肌触りのよいシリコンベルトと 高級感あふれる本革を使用したレザーベルトを発売
これ欲しいなー。iPod nanoもってないけど。

Mac でデザインをやってると必ず直面する問題。Web デザインでは、このテキストは画像部分、このテキストはプレインテキスト部分なんて区別をつけるために（もちろんそうじゃない時もある）プレインテキスト部分は MS P ゴシックなんかのアンチエイリアスをきった物で表現する事が多い。

でも OSX では OS レベルでエイリアスがかかりまくりんぐで、Osaka フォントやヒラギノフォントもそのせいか、アンチエイリアスを切るとグジャーとなって綺麗に表示されない。

そこで多くの場合は以下のURLの最後に出てくる方法で回避してきた人がほとんどだと思う。

Mac OS XでPhotoshopを使った場合、テキストをアンチエイリアスなしで文字をきれいに表示させたい〜

bq. ■Photoshop 7.0(MacOS X 10.4.6)で確認しました。72dpiで、フォントはOsaka-UIを選択して、サイズは12pt/14ptで縦か横を101%にすれば、Osakaフォントがビットマップで見られました。なつかしいです。

ところがどっこい。これが OSX Leopard では、使えないちゃんなのだ。長い事コーディングやオーサリングや FLASH やサウンド制作がメインでデザインする事が気づいたらなかったもので、Leopard にしてからこんな事になっているとは気づいていなかったー。

でも、うちの環境では"101%"ではなくて"99%"にすることで解決できたよ（写真下）。よいこの皆たちには常識だったのかな？ただスクリーンショットをとって見比べたら何故かフォント幅が101%の方が横が詰まってるように見えてるんだ。


なにかバグってるのかなー。ひとまず Osaka でつくってみる。MS P ゴシックも似たような方法で回避できたっぽいんだけど、Leopard で90%から110%の間でいじってみたけど駄目だったー。MS P ゴシックつかえるのが一番安定なんだけどなー。

追記：
この方法で制作を進めていったら、99%じゃ駄目な所が出て来た。こんどは101%にしたら大丈夫になった。しかも同じテキストボックスのなかで99%と101%の場所が混在する事もある。何がおきとんじゃー。

iVideosongs: We'll teach you how to play a complete song

これはすごい。ちょー凄い人々が楽器プレイテクニックを惜しみなく動画で教えてくれるというか、というか本人出演なだけでも凄い。というか本人に「あの曲のあそこはこう弾くんだ。（そしてすげー早弾きスイープどう見ても真似できない）な、簡単だろ？」とかいっていたポールギルバート先生の教則ビデオが脳裏をよぎり、ほとんどの人は実行できないんじゃとか思いました。

でも昔見たビリーシーン（笑）先生の教則ビデオは凄くためになった。そのまま忠実に実行していたら、音楽専門学校時代に先生に「○○くん、ベース弾いて？ベースの役目知ってる？」とか言われたのは内緒です。だって・・・ビリー先生はギターに煙たがれるくらい弾きまくれって・・・・っ！

そんな思い出話はさておき、一番驚いたのは Erik Mongrain の動画があったこと（Previw から少し見れます。どういう曲で有名になったかはそれを見れば一目で・・・）、あんなトリッキーなの練習しようなんて気はさらさら起きないけど、自分にしては久々に追っかけている楽器プレイヤーなので単純に動画が欲しいです。つかイケメンすぎ。基本スペックから違い過ぎ。少年アシベの中華料理屋店長の王さんや、押井 守、犬、忍空の風助、ねこじるに似てるとか言われてる自分はいくらがんばっても、こうはなれない気がしました。

それと何気にやっぱ本人がでてる動画はすくないのかなー？あんま見てないけど。

Websites as graphs - an HTML DOM Visualizer Applet

WEBサイトのソースコードを視覚的に表現するDOMビューワ（という表現があってるのかしら）。尚かつ色付けて綺麗にみせてくれるよーという、前にも似た様なの有りましたね的なサービスだけどFlickr!でお祭りしてたから参加してみた。ぼくのはこれ。

青がaタグ、ピンクがimgタグとか色々あるんだけど忘れてしまった。結果のページ下部に説明が書いてあります。興味の有る人はどうぞ。

それと、これをアップロードするのに、前に紹介したSnipShotを使ったのだけど、便利すぎました。直接Flickr!に投稿出来るのはかなり便利かも。

それと、これの開発はProcessingでやってるらしい。

Snipshot: Edit pictures online

オンラインでプチPhotoshopみたいな事ができちゃう画像エディタサイト。トップに書いてある機能を適当に訳すと以下

* 10MB 5000×5000ピクセルの画像までいじれる
* PDF（１ページ目だけ）、EPS、SVGが読み込める
* ブックマークレットで色んなサイトから簡単読み込み（CSSで読み込んでる画像は認識しない模様、imgタグ限定かしら）
* 拡大縮小、回転、トリミング、その他は今作ってんぜ
* undo、redoも無限にできちゃう（Ctrl+Z/Ctrl+Y、林檎+Z/林檎+Y）
* 非破壊編集だぜ（元のファイルはいじらない）
* 画質補正だってできちゃう（ベータだけどね）

もちろん保存も可能で、読み込みもURLからとローカルのファイルを指定して編集が出来ます。リンク先左の"Open a sample"って書いてある所の写真をクリックするとどんなもんか試せます。

Photoshop立ち上げる程でもないブログ用の画像作成なんかの時には重宝しそう。

Flickr: Creative Commons

フリーランスデザイナーには特に嬉しいCreativeCommons（以下CC）ライセンスな写真の山。ありがたく使わせて頂きましょう。ただ商用での仕様はダメーー！などCCライセンスにも種類があるので注意。

それと、撮影者が好きなようにつかってー！って言ってても被写体がデザイン建築だったりアート作品だったりすると、そっちの方からお声がかかったりするので、その辺も注意してつかいましょう。

CCライセンスとはなんぞやという人は、はてなの記事やWikipediaの記事でどうぞ（これらのWEB百科事典系の物は誰かさんが親切で説明を書いてくれた物なので、当然公式な物ではなく間違ってる事もあるから注意です、と一応いって見るテスト。でもとっても便利です）。

iTune Icon

なんか前に書いた様な気がするんだけど、Jacolog検索しても出てこないのでのっけておきます。OSX風のツヤツヤクリアーなアイコンづくりの参考にづぞ。細かいことを言うとiTuneじゃなくてiTunesな！

それと全く関係ないのだけど、deli.cio.usをちゃんと使おうとタグとかエディットしまくってたらこれってRSS登録してる人は更新されまくっちゃいますね。ごめんよぅ。がまんしておくれ。

未来派図画工作
Quartz Composer入門
Quartz Composerによるビジュアルフロープログラミング

OSX Tigerで追加された機能Quartz Composerをつかっての動画づくり。こ、こんな物が入っていたとはー！！チョウおもしろそう。これだからMacは辞められないよね！（妄信者）。上のリンクの未来派図画工作さんで"Quartz Composer Smaple"というページをみて、ファイルフォーマットが"qtz"だったのが気になって調べて知りました。

Developer toolsフォルダの中に入ってるって言う事は、買ったMacにプリインストールされてるOSX Tigerの人には入ってないのかな？Developer Toolsはパッケージ版OSX Tigerにはインストールディスクがついてたけど。当方パッケージ版を入れて使ってしまってるので確認がとれません。情報求む。

イラレで便利 for Adobe Illustrator

Yahooのおすすめで出てたイラレで便利なスクリプトを配布しているサイト。OSX TigerのAutomatorでOSレベルの操作も自動化して、さらにイラレ、フォトショも自動化して単純作業にはいっさい手を触れたく無いという一見Googleの様な思想を持っている方はどうぞ。デザイン関係で便利なスクリプトと言えばものかのさんもどうでしょう。

Font @village.com

AjaxなWEBフォントビューワは色々あったけど、ナウでヤングなフォントクリエイターがあつまって出来たフォント消費者組合（超直訳の超意訳）のVillageでAjaxなフォントショップ。サンプルテキストのプレビューから書体バリエーションの確認までスムージー。villageのトップページはこちら。

Creating Mac OS X looking desktops @Veerlre's blog

MacOSXっぽい壁紙の作り方。これでさらに所々でエッジを太くすると抑揚が着いてよりOSXライクになりそう。どうやってるのか分からんけど。

ひとまず多数の曲線グラデーションを重ねたい時はどうぞ。壁紙だけとは言わずバナーなんかでも。

Output dictionaries. Turkey can generate dummy texts in Your native language!

TypeDesign.eu Directory
TypeDesign.eu（Toppage）

ヨーロピアンの間でナウでヤングなフォント関連なアレ集。良くわかんないけどリンク集です。

FAKE MODEL PHOTOGRAPHY @Receding Hairline

グラデーションマスクをうまくつかって、接写っぽいピンぼけ具合を再現。そのエフェクトを駆使した写真ギャラリーがFlickrにもアップされてました。

Tiny Tokyo Collection @Flickr!

Computer Love

趣味と言えばゲームと音楽と漫画のみだったオタク全快の管理人にとって唯一のコジャレ情報源であったComputer Love。突如として閉鎖し、いつからなのか忘れるほどに長い事リニューアルという建前の沈黙を保っていた訳ですが、ようやく更新再会したようです。

あいかわらずコジャレた作品のリンクが多数のってて面白いです。こんな感じのものがバンバンアップされて行くサイトだったので、今後の更新が楽しみです。とりあえず、今見た時点で掲載されていたさ作品は以下の二つ。

* Clestial Mechanics
* UVA - Interactive Installation Prototype

ちなみに、上記の様なおもしろげな物のリンクだけではなく、グラフィックデザイナー募集！なんかの記事も見受けられます。（もちろん海外なので手出しはできませんが）リニューアル前はこういうシステムは無かったと思うので、新機能かな？正直パッとみただけでは、それくらいしかリニューアル前と変わってそうな所は見受けられませんが・・・。

デザインやアートに興味をもったのは本当につい最近で、人の写真みたり、作品みたりするのはどんな物でも大概楽しめる幸せな時期にまだ有る自分でございますが、お願いだから女性が自分の裸をただ鏡越しにトイカムで写した写真とか晒して（そして決まってフラッシュの反射光　とかで顔を隠している）アート！アート！私ってアートしてる！とかいう感じの物だけは、勘弁して下さいと思ってしまう私はナンセンスでしょうか。（なんか構図とかで凄いのかもしれないけど、ずぶの素人なもので！:P）

男ならば（そしてオタクを経験した事の有る物であれば尚更）メタリカやらHR/HMが例外無くすきであり、ConeliusやBlurを聞いてはこんな軟派野郎の音楽なんか聞いてられるか！！テンポ150以下の曲は音楽じゃねぇ！！！速ければ速いほど偉いんだ！かっこいいんだ！かっこいいんだーーーーッ！！とか思っていたような時期の存在した自分でも、今ではJazzやらUKPOPもラブソングもグループサウンズも許せるようになった事を思うと（むしろそっちの方が好きになった）、いつかあの写真も許せるようになる日がくるんでしょうか。

「もし相手が自分の趣味を理解出来るのならば、自分が相手の趣味が理解出来ない限り、お馬鹿なのは自分の方だ」とは芸術的センスで尊敬する友人の言葉ですが、まさに今自分がその立場にいるかと思うとキィィィィッ！悔しい！じゃこ悔しいッ！！あなたには私の見えない世界がみえてるのね！！！とハンカチを噛んでしまう勢いでございます。だれかアレの良さを教えてたも！！

あ、あと、少女をひたすら撮影しましたみたいな写真集も拒絶反応がでてしまいます。犬と猫をひたすら撮影してるのはOK。（もはやタダの好みですね！）

iTune Icon @nDesign Studio

OSXのあのアクアなアイコン群の作り方にやきもきしてる方は必読。aiファイルも落とせるのお勉強には最適です。

それにしても細かい事をいうと、iTuneではなくてiTunesなのですよ先生。僕もつい最近まで間違えてましたが:P

Adobe StoreでMacromedia製品


Adobe Creative Suite Premiu + Macromedia Studio8で28万円。Adobe Creative Suite + Flash8 Proで24万円。ひとまずStudioシリーズとCSシリーズを合体させたソフトを早く出して下さい先生。

Weather Icons


いろんなサイトの各種お天気アイコン。Weather Undergroundのアイコンは気合い入り過ぎというか怖いと思ふ！

EXIT CMムービー

PSP用ゲームEXITのネット限定バージョンのCMムービー。全然Jacologとは関係ないのだけど、ムービー見てたらどうもCGクリエイターの富岡聡くさい配色とテンポだと思って、調べてみたらそうでした。ただそれだけ！！

SiNK（潜水服のアレ）やコインランドリーXYZ（水泳の格好で男3人が異様な踊りをするアレ）やらジャスティスランナーズ（onedotzero収録作品）などあっちゃこっちゃで流れてたムービーを作ってた人なので、CG好きな人はどうぞ。

なんとなく誰がつくったのか分かる様な自分のスタイルをもつって大事っすね。

追記----------------------
と、yahooを見てたら、バイラルCMとして、このムービーが紹介されてた。まんまと企業戦略にハマってしまいました。

20 GOTO 10

百式さんでしったコマンドラインで閲覧する面白いWEBサイト。つくったのはウェブデザイナーさんだそうで。

何はともあれenterをクリックしてDOS窓ライクなウインドウが開いたら取りあえずhelpとタイプしてエンター。Aboutを始めとするコマンド一覧がでるので、あとはそのコマンドをいれてページを移動するだけ。

黒い背景（もしくは青い背景）に白文字の画面がでてきたら慌てて閉じてしまう人にはおすすめ出来ないサイト。

Sonny PSP Ad by Chris Cunningham @ BeamTV

このムービーのページのどこにも書いてないのだけど、John Hicks先生はRubber JohnyでおなじみのChris Cunninghamが作ったCMだと言っておられる。さすがにキ○タマみたいなのから毛が生えた様な生き物がつぶれたりとかはしない。

追記------------------
もの凄い誤字脱字でした！というか11月復活予定と言っていたけど、まだまだ先になりそうですわ。

EIGHT THE PROJECT

Macromedia Studio8 発売に会わせて公開されたプロモーションサイト。「私はエイト！14歳！！」とかしょっぱなから飛ばしてます。こないだの眞鍋かおりを採用してるFlash8向けのサイトといい8からはこういう方向に進んで行くんでしょうか！

看板のフォントですが、最近ではモリサワの書体もアウトラインをとれるので使っているのもありますが、少し前のだと確実に違います。ダイナフォントや専用の書体が多いです。（それ自体はどこかのOEMだとは思いますが）

FlykiteOSX

ゴイス。Ajax。

Typetester ? Compare fonts for the screen

フォントの設定をかなり細かく設定して、それらを並べて見比べる事が出来るサイト。フォントの種類はもちろん（自分のマシンに入ってる物と、サイト側であらかじめ用意されている物から選ぶ事が可能）で、フォントサイズやさらに背景や文字色、行間や文字間、単語間の距離、下線や打ち消しなどの文字装飾、はてはプレビュー用のテキスト文章まで細かく指定してブラウザ上で見比べる事が出来ます。フォント選びにお悩みの時は是非参考に。テキストを入れるとリアルタイムで反映される事からこれも流行のAjaxかしら。ちなみに日本語でもOKです。

a most extraordinary tour : Shobo Shobo @AudioMastermind


こんな格好で日本をツアーしてるらしい。文中にある「original people」のリンク先のムービーで実際にやってる様子が見れるけど、それよりも、そこで暴れてる女性が凄いです。

DIRECTORS LABEL 4+1枚組スペシャル・パック @Amazon

前作もAmazonで買った訳ですが、今回の新作もAmazonで予約しました。と書いただけでは只の報告にしかすぎませんが、これを取り上げたのには訳がーーー。

もうAmazonフリークの方にはおなじみになってると思いますが、Amazonでは洋書とDVDのBOXセット系商品がすこぶる安いです。前作も、私が買ったときは1万円ちょっと位で買えたと思います（4000円くらい安かった気がする）。今回の新作BOXセットも、予約の時点で20%引き（18,900円から15,120円）になってます。これと同じように、洋書等も大手の書店よりも安い場合がおおいので、DVDのBOXセットや洋書を買うときはAmazonを一度チェックしてから買うのがおすすめです。代引きで頼んでも、電車賃等を考慮すると十分安いと思います。これだけ安ければ代引き手数料を考慮しても安いと思いますが。おすすめです。

それと今気づいたんですが、Bloggerの投稿画面から画像をアップするボタンやら、太字にするボタンやらが全部無くなってるのは私だけでしょうか。日に日に機能が削減されて行ってます。

Paparazzi! (for OSX)

ブラウザを使わずにスクリーンショットを取るアプリケーション。なんと言っても特筆すべきは、ブラウザの枠を含まない+高さを"min height（最小の高さ）"で指定できる所。min heightで指定した値以上の高さがある場合は自動的に内容分の高さまで伸びてくれます。min heightで指定した値未満のばあいは、min heightの高さを保持してキャプチャしてくれます。WEBデザインのポートフォリオづくりや、気になったデザインをキャプチャする時に重宝しまくり。

あとはこれで、OSX TigerのAutomatorに対応してくれるか、Apple Scriptで指定したブックマークフォルダのURLを自動でキャプチャできるようになったりすると無茶苦茶便利ですね。

色 盲の人にもわかるバリアフリープレゼンテーション法


こっち（英語版）で一生懸命よんでたら日本語版がありました・・・。JIS X 8341が制定されてからWEB制作者として色盲のユーザーを意識し始める方も増えたかと思います。色盲のしくみから、色盲の方でも問題なく見れるサイト（というよりは書類や論文）づくりに役立つ情報がかなりのっています。

Adobe photoshop上で色盲の見え具合をシミュレートするソフトやプラグインのリンクも乗っています。フォトショップでデザインする段階で、このプライグインでどういった具合にみえるのか試してみると良いかもしれないですね。

個人的には英語版ページでよんだ（日本語版だとどこに乗ってるのかな・・・）、グラフの話等がためになったかと。背景色やフォントの兼ね合いを意識する人は多いと思いますが。色別グラフなんかが、いかに色盲の方に分かりづらいかー、どうしたら良いかを解説しています。色だけじゃなくて形もねー！

Google Logo Maker-Logogle


入力した文字列を、Googleロゴ風の書体とカラーにしてくれるサイト。しかし、１文字ごとに画像を1枚１枚分割して吐き出すせいか、文字間隔が広く本家Googleロゴよりも間抜けな感じになるのが否めません。文字詰めは大事でございますね。

MS、「Windows Vista」で日本語フォントを一新--JIS X 0213:2004規格にも対応 @CnetJapan

一昨年ほどに制定された、視聴覚障害者向けWEBサイトを作る人にはかかせない規格となったJIS X 8341ですが、8341の由来は「やさしい」から来てるそうです（講演でいってたんだけどほんとうなんだろうか 笑）。それを鮮烈におぼえてて、JIS X 0213をみて"おにーさん"と読んだ人は少なくないはず。

っと、どうでも良い事はさておき（それが半分をしめますが！）、肝心のメイリオの外観ですがPC Watchのこちらの記事に詳しくスクリーンショット付きでのっています（via:singoさん）。

A Visit to Adobe @PhotoshopNews

Adobeの社内が写真で載ってます。うおー、スゲーー。Mac+Herman Millerの組み合わせは基本ですか。そうですか。こんな仕事場欲しいっす。それだけーー！！

arial or helvetica? | a quiz @iliveonyourvisits.com

このフォントは、ArialなのかHelveticaなのか当てるゲーム。ここで見分け方の基本を学んでからいくべし。

Optimus keyboard @Art. Lebedev Studio

各所で話題になってるのでご存知の方も多いと思いますが。キーボードのキートップがすべて液晶になってて、その時々によって配置をカスタマイズ?できてしまう物。しかもかっこいー。

ああーすごいほしー、けどすごい高そう。アップルのキーボードが3500円になったいまそっちに走ってしまいそう。

Stroke Options in Illustrator CS2 @Veerle's blog

立方体をイラレで作るときにいつもイライラしていた部分。仕方なく、エッジを丸くする事で妥協していたけれど。CS2からはストロークオプションで解決！！！地味な変更だけど以外と重宝する気もする。っていってもCS2を購入する予定は今の所無いですが。

Colour Contrast Check @snook.ca

RGBのスライダをいじるか、16進数で入力した2色のカラーを元にコントラストのチェックを自動でやってW3Cの提唱する色に関するアクセシビリティ的にOKかどうかを教えてくれるWEBツール。視聴覚障害者向けサイトやJIS-X8341規格準拠サイトを多く手がける方等に是非。

Romaji-Kana Converter on the Web

先にあげたHuginのOSX版を探していたら偶然見つけたサイト。おそらく日本人にはあまり需要がないであろう、ローマ字>かな文字のWEB上で動くコンバータ。近年の海外での漢字平仮名ブームを見る限り、海の向こうでは需要が有りそう。

Cassette DJ Player


タイトル通り、カセットテープでDJする人。なんかカセットテープのターンテーブルは、モールス信号の機械を見てるようで、メカニカルでカッコいい！！歯車の音とか聞こえてきそうだ。

リンク先のサイトが重たいので、Flickr!に機材ややっている様子の写真がアップされてるのでそれをみて待つのもいいかも。

Jager Di Paola Kemp Design

XBOX360のロゴデザインを手がけたところだそうで。ええ、それだけなんですが。ポートフォリオを見てもあまり日本になじみのある会社では無いようです。

Desert Island Fonts - Round 1 @Andy Budd Blogography

もしも6こしかフォントが使えないとしたら、あなたは何を選びますか？見たいなアンケートに、３人のデザイナーさんが答えています。それだけなら大してピックアップしませんが、時の人John Hicks先生がはいってたので一応。

Hicks先生は、やはりトップにHelvetica、次の方もまずFuturaが来てます。ありがちというか当たり前というか、この二つのフォントははずせないところでしょう、後は好みやサイトのテイストや自分のデザインの趣向によってかなり変わってくるかと・・・。日本語で言うところのモリサワみたいな物でしょうか。

Arialを誰もあげていないっすね。Helveticaが出れば要らないと思いますが。