2011年年賀状

そろそろお正月気分から抜けださなきゃ、という時期ですが、年賀状をデザインしたので公開します。

といっても、誰かに出したものではなく学校に展示するために提出したもの。
そういえば今年いただいた年賀状は、お子さんにウサギの耳のついた帽子をかぶらせた写真が多かったなぁ…。

イラレでそれらしい線の感じを出すのが意外と手間でしたが、鳥獣戯画のウサギさん、改めてよく見ると可愛いカットがいっぱいで和みましたよ〜。

ちなみに鳥獣戯画の全体の絵は、Wikipediaの「鳥獣人物戯画」ページにある「外部リンク」の項目から見られます。

jQueryでFlickrのフォトギャラリー 作り方メモ

先日学校で「自分の写真を見せるフォトギャラリーサイトを作る」という課題が出ました。

その時ちょうどjQueryとAPIを使う練習をしたいと思っていたので、jQueryでFlickrのAPIを使って写真を表示するサイトを作りました。
初期表示では私が撮った写真が表示されますが、キーワードとタグで他の人の写真を検索して表示させることもできます。

以下、APIの使い方や参考にしたサイトなどのメモです。

Flickroll -Flickr photo gallery -

ブログのデザインを刷新

ブログのデザインを変更しました。

このブログはMovable Typeを開発しているシックス・アパートが提供するブログASP「Type Pad」を使っているのですが、以前はそこで用意されている既存のテンプレートを使ってました。
これです↓
 

以前のやつは建築物のスケッチっぽいデザインが気に入っていたのですが、前回書いたヒマナイヌバーのホームページがピンク色ベースでアナログっぽいデザインだったので、1ヶ月くらい毎日それと向きあっているうちに真逆のデザインをしたいという欲求がふつふつと湧いてきまして、その思いをブログにぶつけ、こんな寒色系かつデジタルちっくなのデザインになりました。
ヘッダ部分の背景はブログのタイトルにある"log"を意識し、かつ『マトリックス』へのオマージュのつもりですｗ

TypePadの場合、既存のテンプレートにちょっとCSSを追加する「カスタムCSS」という機能を使うか、HTMLもCSSも自由にできる「上級者テンプレート」という機能を使ってカスタマイズするのですが、今回は「上級者テンプレート」に挑戦しました。
でもこれ、ヘルプもあまりなく、ググってみても参考情報が少なくて、当初2日くらいでできるかな、と思ってたのですが、試行錯誤の連続で5日くらいかかりました。

デザインを自由にしたい場合、Type Padじゃなくてレンタルサーバーを借りてMovable Typeでブログを作ったほうが素直にできるんじゃないかと思いました。
サーバー代がかかるけど、Type Padも有料プランでないとデザインのカスタマイズができないようなので、もう少し出費して自由度や参考情報の豊富さを取るのもありですよね。サーバーは他のことにもつかえるし。

そんなわけで、いずれはブログを移転も検討中。
でもデザインもいろいろやってみたいことがあるので、ブログ移転と次のデザイン変更とどっちが先か…。

とりあえず、この後のブログにて、今回やったことを備忘録的に書き残しておこうかな、と思ってます。

「ヒマナイヌバー」ホームページをつくりました

4月からデジハリの本科Webクリエイティブ専攻という1年間のコースに通っていますが、7月・8月で中間課題の制作、というのがありました。

実在でも架空でも良いので、何か「お店のサイト」というものをひとりで作り切る、という課題です。

私は知り合いがマスターをしている「ヒマナイヌバー」さんのホームページを作らせていただき、先週無事、公開されました。昨日、頼まれたページ追加という更新作業も終え、ほっと一息ついたところなので、この中間課題について振り返ってみたいと思います。

デザインセンスを求めて…

しばらくデジハリでの勉強のことなどを書いていませんでしたが、学校には真面目に通って、いろいろ出される課題にも一生懸命取り組んでいます。

今までやってきた、および現在取り組み中の課題はこんな感じ。

• キャラクターイラストのトレース（Illustrator使用）
• 地図のトレース（Illustrator使用）
• ADカード（Illustrator、Photoshop使用）
• アニメーションGifのバナー（Fireworks、Illustrator、Photoshop使用）
• 自分の屋号のロゴデザイン（Illustrator使用）
• 自分の名刺デザイン（Illustrator使用）
• お店のWebサイト制作（Illustrator、Photoshop、Dreamweaverなど使用）

名刺がもうすぐ完了で、Webサイトはコンセプトやサイトの構成を考え始めたところ。
これらを通してソフトは大分使えるようになったし、HTMLやCSSもかなり理解した！

でもねぇ、そういうのは分かってもデザインのセンスって着々と身についていくものではないし、クラスの他の子がすごくかっこいいのを作ってきたり、全然思いつかなかったようなアイデアを盛りこんでたりすると、ガーン、と落ち込みます…。

そんなわけで、最近は「デザイン力を身につける」的なテーマの雑誌などを見るとついつい手が伸びる…。
こんなものを買い込んでおります。

印象に残ったのは『pen』の深澤直人さんのページ。
発想はトレーニングでできるようになるが、それを具体化するには経験値が必要、という話と、視覚的なものばかりに意識を向けるのではなく、デザインの役割としては「目で魅了して、近寄らせて、触らせて、満足させなければいけない」ということ。

あと、『ブレーン』は「クリエイターのマル秘プレゼン企画書」という特集なんだけど、日産自動車でずっと宣伝を担当してきた野口さんという方が、プレゼンを受けるクライアントの立場として、企画の良し悪しを見極めるポイント（翻って、プレゼンする側が気をつけるべきこと）を語っているページがスゴク良かったです。（『もうひとつのプレゼン―選ぶ側の論理 』という本も出されているみたい）

深澤さんの言われている、アイデアを具現化できるためには経験、習練が必要というのは本当に実感しているところで、「こういうものを作りたい」という思いとそれが作れそうなツールがあっても、実際に手を動かしてみると思った通りのものを作れないんですよね…。
まだこれらを全部読んでませんが、レイアウトとか色とかフォントのセオリー的なものは特に新しく学ぶことはなかった。
だから、誰かに教えを請うと いうよりは、たくさん試行錯誤すること、たくさん良いものを見ること、しかないのではないかと思いました。

ちなみに最近作ったものでこれは割と気にいっています。

ADカードの課題でテーマがいくつかあるうち、「自由テーマ」があったので、「そめけん！」というモチーフを使ってタイポグラフィでカッコいいやつを作ろう！と考えました。
この目標は自分なりには達成できたと思う。
ただ、もし目的が『そめけん！』という番組を知らない人に手にとってもらい、ぜひ観たいと思ってもらう、というものであったらこうは作らなかったし、もっと難しかったと予想…。

次の課題であるWebサイトは、実在の知り合いのバーのサイトを作らせてもらうことになったので、実用的でかつデザインのいいものを目指してがんばります。

名刺を作ってみた

デジハリの入学ガイダンスの時、自分で作れるものはどんどん作りなさいと言われたことと、初対面の人と会ったときに名刺がないと困るな、ということでとりあえず名刺を作ってみました。

いわゆるブロガー名刺、という感じですね。

Twitterのアイコンはぜひ入れたい！と思ったので、その雰囲気に合わせてポップな感じを出してみました。アイコンがなければ、どちらかというとシックな感じを狙ったと思うのですが…。

そんなに凝ったデザインでないのに、何時間もかかってしまった…。これくらい、手早く作れるようになりたいもんです。
たぶん後で見たら恥ずかしくなるんだろうなー、と思いつつ、これも練習なので恥をしのんで公開！

表はぼかしだらけですが、右下はQRコードを入れてます。