デザインのヒント Archive

Balsamiq Mockups For Desktop
どこかでサイトのリニューアルとブログやサーバーの再設定を行いたいと思いつつ、ある程度まとまった時間が取れないと作業もはじめられないので、更新も少しにぶりぎみ。

合間をみて、ちょこちょこと仕様や方向性を描いているのですが、そんなときに便利なのがこのソフト。

まさにノートに手書きでサイト画面設計のラフを起こすような形で、パーツを組み合わせながら、仕様構築ができます。

この「手書き風」というのがミソで、味のあるラフスケッチには妙な魅力があります。

実際に手を動かして描くことで、脳も活性化しますが、実は手を動かすことだけではなくて、線が揺れていることも、ひらめきや活性化に寄与しているのかもしれませんね。

youtubeがHDに対応してから、次なる映像体験の世界が開けたのですが、HDビデオカメラが無くても、写真をインターバル撮影をして、映像編集ソフトで映像化する。というシンプルな手もありましたね。

流れ星がたくさん出てくるので願いごとがある方は、どうぞ。

これは是非、HDモードでご覧ください。

この映像も綺麗です。

音楽制作ソフトAbleton Live 7 って、音声ファイルだけでなくて、映像まで扱えるようになっていたのは知っていたのですが、今回はじめて映像編集に使ってみました。

映像編集というと語弊があるのですが、音声ファイルと同様の扱いで映像もマルチトラックに配置して編集することができます。

細かいトランジションや映像の調整はできませんが、ある程度できあがった映像ファイルを簡単に切り貼りし構成を考えながら、別録音した音声ファイルや効果音などを調整するような用途にはすばらしく使えます。

今回は、幼なじみの結婚式で想い出ビデオを作成したのですが、こんな感じの流れで編集してみました。

1. 想い出の写真を同窓生から集める
2. Keynoteを使って紙芝居風に作成する
3. 同窓生を集めて紙芝居を観ながらアテレコをし、ボイスレコーダーに録音
4. Keynoteでの紙芝居も同時にiShowUで録画
5. 録画された映像と音声ファイルをAbleton Liveに貼り付けて構成検討
6. Ableton Liveで音声バランスやBGM,SEなど調整して音声ファイルだけをはき出す
7. 音声ファイルにあわせてiMovieを使って映像の再編集しながら、iDVDで焼く。

という流れ。

アテレコ一発録りでOKなら、（４）の段階で、紙芝居の映像と同時にiShowUで外部マイク録音もできてしまうので、そのまま完パケで終了。なのですが、今回は細かくこだわったので、（５）以下の流れがあります。

普段はWinのEDIUS 4 Pro という映像編集 ソフトを使っているのですが、今回は出先で作業をしないといけなかったので、Macのノートパソコン一つで作ってみよう！と挑戦。

アテレコ録音したあと、どうしても複数トラックで細かく「間」を編集したかったので、ふと思い立ちAbleton Liveに映像を放り込んでみたら、なんのストレスもなく、快適に作業できたので、予想以上に効率的に編集ができました。

このソフト、音楽のPVなんかをつくるのには、とてもいい気がしますね。

ただ、Keynoteから映像ファイルをはき出す段階でトランジションや高速なアクションを行うとブレがでるのと、タイミングが均一化してしまうのので、強引ですが、プレゼンの映像をそのままiShowUという動画画面キャプチャーソフトで録画。

若干劣化しますが、ほぼ問題なく準備完了。

自分で言うのもなんですが、かなり面白い作品ができました。あとは、披露宴を待つのみ。。。

ちなみにデスノートじゃありません。
VISUAL EASE NOTEという名前の黒いノートです。
視覚障害者自立支援施設「栄光園」が作っているもので、弱視の方や字が識別しずらい人向けなのですが、ノートの表紙もテイストもおしゃれで、普段使いで全然いけます。むしろシックで他のノートよりもセンスいいです。

このノートに白いペン（SAKURAのスフレホワイト）で、書いてみると、少ない情報がぐっと引き立ち、さらっと描いただけでも、センス良くみえるから不思議です。

走り書きというよりは、二軍ノートからちょっと整理して、一筆書きのように、間違いをおそれず清書してみると、効果がより発揮されます。

無地の黒い紙の中央に小さくぽつんとイラストを描くだけで、その絵の存在感がぐっと増して贅沢な気がしてしまうのはなぜだろう。ぜひ、やってみてください。

東急ハンズで３１５円でした。ペンは１２6円。

いま密かに流行している、フェルトを使った人形づくりに挑戦。

処女作がコレ。

作品No.01「レッドヘアーメン」と名付けられた作品。これは身の回りのプチ不幸な出来事を身代わりに吸収してくれると言い伝えられているらしい（いま書きながら思いついた）。

この作品のいいところは、部屋の片隅に転がっていても、たとえ、もしそのまま掃除機に吸い込まれたとしても（大きさ小指の先くらい）、その御利益は変わらないということ。

一度創ったら、それだけで、その効用が永遠に続くという（かなりよくできた設定）最初にして最強なキャラ。

だから人にあげても構わないので、ちかいうち、僕が出会った誰かにこれは譲り受けられる予定。（拒否されなければ・・・）

かわいい子には旅させよ。

ひさびさにNodeBoxでヘアラインのアート。（参照スクリプト）

数学で偶然に描かれる曲線を眺めていると、どこか自分に似た部分が見つかる。

Season's Greetings

Phun
子供のころを思えば夢のようなソフトです。
先日ご紹介したOE-CAKE!同様、描いたものが様々な物理法則にしたがって動き出します。
創造力をかきたてられるソフト。

プロメテックソフトウェア株式会社さんのホームページからダウンロードできる、無料体験版お絵描きソフト"OE-CAKE!"がかなり面白くて、はまります。

youtubeにあるそのほかの作例

LineRiderもそのうちこんな風になるのかも。（作例）

「はい。カプチーノおまたせいたしました。」

ヘタウマだと逆に飲めない・・。

Created with Admarket's flickrSLiDR.
さて、写真でも撮りに行きたいなぁと思ったら、flickrなどでお気に入りの写真を探してイメージトレーニング。
このlomokevさんの写真。構図もアングルもアイデアもなんだか観ているだけで楽しい気分になるものが多く、刺激的です。

日常にこんな目線をもてたら、世界ももっと楽しく写るんだろうなぁ。写真っていいなぁと思わせてくれる作品ばかりです。

画家が絵を描く前に、何も考えず手元も見ずにただ見たまま描くような手遊びをする。という話を読んだことがあるんですが、それって試合前の準備運動だったり、歌う前のリハーサルに似ていて、どんな作業にもそうした時間が大切なんだと思います。

仕事や原稿もきっと、いきなりはじめるのではなくて、ちょっとした手遊びのつもりで、関係のないことでも手を動かしていると、エンジンのかかりがきっといいはず。

急いでいても、突然走りださず、ちょっと暖機して頭をやわらかくしてから、徐々にスピードをあげていきましょう。

■プリントアウト

まず、デジカメのディスクに入っている写真から適当にピックアップ。

今回はInDesign CS3でレイアウト。
大きさは5cmｘ5cmの外枠に内枠4cm x 4cmで白縁をつける。縁をカッターの入れやすいように黒線で太めに引く。
（アルバムの台紙が黒なので、縁を黒に）

貼ってみて思ったのは、縁はなくして、写真を5cm x5xmに断ち落としたほうがよかったかも。次回。

■カッターで切り取り貼り付け

カッターで切り取る際に力を要れず、３～４回軽くなぞるように、すーっと引くことがポイント。

一気に切ろうとすると、線が乱れます。

切り離した写真をアルバムに貼っていくのが一番の難所。

バランスをとりながら貼り付ける。

まぁ、そのあたりは適当に。とりあえず完成。

厚手のプロフォトペーパーを使ったので、アルバム全体が膨らんで、だらしなく半開きな感じは愛嬌。

写真に白文字なんかで、一言、ことばをいれてみたり、片方のページに写真でもう一方にメッセージや、押し花のような写真以外のものをいれてもいいかも。

アルバムの厚みが出やすいので薄手の用紙のほうが、このアルバムにはオススメ。

Created with Admarket's flickrSLiDR.
Moleskineは普段のメモ帳というよりは、ちょっとした旅にキャンバス代わりにもっていくのにいい。

空港やカフェなんかでちょっとした時間、目線にMoleskineをもって、目線の先にあるものをチラ見しながら、一筆で描いてみる。
線の間違いやゆれなんて気にせず、どんどん描き進めているだけで緩やかな時間をすごすことができます。

カメラの向けにくい場所もあるから、そんなときもMoleskineでキャプチャー。

flickrにあるMoleskine写真のスライドショー。

via モレスキンで雑誌のようなレイアウトのコラージュアート「Moleskine 」: DesignWorks

Moleskineに貼り付け

早速マルチラベル用紙で撮った写真を印刷して貼り付け。

手間かけないためにも、フォルダに9枚好きな写真をいれて、そのまま「画像を印刷」でXP付属の印刷機能を使って、Ａ４一枚に9面割付で印刷。

勝手にトリミングされたりするので、厳密にする場合はレイアウトソフトあたりで配置して印刷するほうがいいかも。

適当にコラージュ

適当に貼りつけて、適当にぐちゃぐちゃとペンを入れて、思ったことをただ書く。

途中で、あぁ失敗だなぁと気がついても、Moleskine手帳、結構いい値段なので、引き返せないことを肝に銘じながら、最後までやりぬく。

どんな風に描いても、後で見直してみると、そこに絶対「味」がついているので、あまり吟味しすぎず、適当なところで、手帳を閉じる。

しばらく寝かして、また見直したり、あたらしいページに挑戦していくと、きっと愛着ある一冊になります。いや、なるはずです。

光を使ったグラフィティアート。
これなら街中に塗りたくれる。

tutorialを参考にPhotoshopで紙を破ってみる。

実際にやってみると、全然違うプロセスになってしまう。
このチュートリアルの５倍くらい手数を使ってもまだ破けず。
ノリがはり付いてとりあえずちぎれた感じ。

レイヤーの構造はこちら。

誰かに手紙でも書こう。

Continue reading

押し合いへし合い帰ってきます。

ビーズのカーテンの向こう側

不規則に調和。

しずくにもてあそばれる。

溶ける。

記憶の断片をあつめておく。

無地の背景に雄弁な言葉も、ビジュアルの上には言葉数が少なくなる

雨の日も楽しい

七色の竹藪。

時に冷たく。熱く語れ。

KC3A0027.jpg, originally uploaded by hirosh.

トタンは従来、鉄板が錆びないように亜鉛鍍金（メッキ）されているものをさすようなのですが、もともとメッキされていないのか、それでも錆びたのか、この古びた感じがなんともいえず、ぐっときます。

NodeBoxのサンプルファイルから。

北海道の写真は全部このカメラで撮りました。

今回は仕事も半分あったので身軽な装備をめざしつつ、アサラト（そのうちで詳しく書きます）や、一五一会の奏生といった楽器を旅芸人のように背負っていったので、なおさらそれ以外の装備は減らさざる得なかった。という理由もあります。

Continue reading

生臭くなく、ほんのり甘いスイーツのようで、ふわっととろけるような舌触り。いやぁ、思い返すだけで、胃がきゅるるるるる～としてきた。

でも、かな～り高いノートなので、一筆入れるたびにいちいち気合が入ります・・。そこで、Moleskineを写真で撮ってフォトショップ上でシミュレーション。

色々試行錯誤して、リアルMoleskineに帰って行きたいと思います。（うっ、小心者←）

とはいえ、この手帳とても頑丈なので、ちょっとくらい乱暴に扱っても大丈夫。逆にそのくらいのほうが味と雰囲気ででます。車もぶつけたあたりから、開き直って上手になりますからね。

ちなみに使っているのは、ポケットサイズの「Sketch-Book」というタイプのもの。厚口紙なので、水彩ペンで描いても紙がよれないタイプです。

Continue reading

参考サイト
Photoshop Tips - 風景写真をミニチュア写真に加工するには　- by StudioGraphics

PowerPointに特化したテンプレート、ツールサイト。

メールの本文にPowerPointを貼り付けて、どれくらい視聴されたかトラッキングできるツールなんかも。（これはスパムぽいなぁ。）

大学の遠隔授業なんかには、いいかもしれない。

PRESENTATION　PRO - experts for Microsoft PowerPoint

■参考サイト
PowerPoint テンプレートGET術

Macromedia Flashにある「修正」－＞「シェイプ」－＞「滑らかに」もしくは「スムースボタン」を使って描いた線を修正していくとどんどん簡素な形に変わっていきます。この機能を利用して、さっとラフに書いた文字をロゴっぽくしてみます。

ちなみにこの線をブラシではなく鉛筆で描いて、同様に線を減らしていくと、こんな風なタッチに。→

目が勝手に足りない線を補完してくれるぎりぎりまで形を簡素化していると、ぽくなってきます。

だから、名前のないものは存在しないのかもしれない。

Continue reading

仕事の量をはかるのに、まずタスクを書き出して、数を把握するだけでも漠然とした不安は少なくなります。
ただ、数がわかってもひとつひとつのタスクが何を意味しているか？そして、そのタスクに対してどんな対処が必要かは文字だけではつかみきれないもの。

とはいえ、ビジュアルで表現するために写真を撮ったり貼り付けたりする作業が負荷となっては、仕事を増やすばかり。

Continue reading

Continue reading

ひさびさにコラージュ。

これはフリーの画像管理ソフトpicasa2のコラージュ機能を使ったもの。

Continue reading

■手紙というメタファー。最近、デザインやインターフェイスで「あぁこう来たか～！」 と新鮮に驚けるサイトに出会いたい欲求にかられていて、飢えた目でネットサーフィンしてます。 このサイト。派手ではないですが、 コメントフォームがポストカード風。 それだけで嬉しくて、思わず記入したくなるのが不思議。 やる気になるインターフェイス。 メタファーの使いかた。ヒントになります。

Continue reading

Asif R Naqvi Dot Com

デザインや配色に便利なサイトをアーカイブしておきます。（随時

[ws] Color Scheme Generator 2

でも、意を決しないと手を洗えなので不衛生。

好きになれない過去に囚われすぎても、前に向きずらい。
いいことだって、後生大事にして守っていても、結局は後ろ向きだったりする。

これからを大切に思うなら、とりあえず過去をゴミ箱にぽいっ。

その矢印は誰のために指されたものなのか？少し疑ってみることも必要。

誰かに迷わされるなら、自分で進んで迷うこと。きっと抜けられる。

そこに描かれた壁のペイントに誰かが気づけばそれでいいのかもしれない。
気づかれなければ存在しないのだから。

リクエストにお応えして！！壁紙サイズアップしました。

船の後方デッキに立って海面にできた軌跡を眺めていると、色々ないやなことも、海風とともにすべてを過去に流してくれるような気分になって、気持ちいい。

ColorMatch 5K配色に悩んだときはコレ。とっても素晴らしいです。

シンプルなスクリプトなんだけど、調和配色のアルゴリズムというかアイデアはお見事。
エレガントな5k。