あとで編集！
土曜日, 11月 29, 2008
木曜日, 11月 27, 2008
水曜日, 11月 26, 2008
Lunascape 3種類のレンダリングエンジンを使い分け
Lunascape 5 α
Trident + Gecko1.9 + Webkit の３つのレンダリングエンジンを持っているブラウザ。
試してみる。
いろいろと不安定なところもあるが、
キャプチャはいい！他のWebキャプチャよりスマートにきれいにキャプチャできる。
火曜日, 11月 25, 2008
金曜日, 11月 21, 2008
フォームをかっこいいデザインにしてくれる『Niceforms』
フォームをかっこいいデザインにしてくれる『Niceforms』
フォームをかっこよくデザインしたい。
そんなときにおすすめなのが、『Niceforms』。フォームをかっこいいデザインにしてくれるスクリプトだ。
『Niceforms』を使えば、↑のようにフォームをデザインすることができる。
デモはこちら↓。
フォームをかっこいいデザインにしてくれるスクリプト、チェックしてぜひ使ってみてはいかがだろうか。
木曜日, 11月 20, 2008
広告文の表現方法
バランスよく五感に訴える工夫
人は、視覚（Visual）、聴覚（Auditory）、触覚（Kinesthetic）、嗅覚（Olfactory）、味覚（Gustatory）の5つの感覚で物事を認知し、想像し、表現しています。
ですから、人に何かを伝えるにはこの５つの感覚を使う表現が含まれるのが理想です。
この感覚を使った表現は、それぞれの英語での頭文字をとって、VAKOGモデルなどと言われたり、触覚、嗅覚、味覚の３つの感覚をすべて体感覚（Kinesthetic）におきかえて、VAKモデルと言われることもあります。
丁寧に作られた広告には、このVAKを刺激する要素がちりばめられており、それらにはより臨場感のある見せ方、実感をともなって受け取ってもらう工夫がされているのです。
例えばビールの宣伝。
今にもこぼれ落ちそうなしずくをグラスいっぱいにつけた映像（V）は、とてもよく冷えた（K）ビールだと分かります。
そして、プシュッ、シュワーッと泡の出る音、焼肉のジュウッっという音（A）、ゴクッと飲み干す音（A）、そしてビールを飲んだ後には「あーっ」という声（A）と共に、満足そうにしている表情（V）、「うまい！」の一言（K）、こんな具合です。
車であれば、美しいスタイリングの映像（V）、エンジン音（A）やバタンと閉まる重厚感あふれるドアの音（A）（K）、滑らかな質感あふれるシート（K）など、やはりVAKがたくみに取り入れられています。
媒体による転換率比較
媒体による転換率比較
・新聞折込 約0.03%
・ポスティング 約0.2%
・ネット広告 約3.3～5.5%
・ティッシュ配り 約4.0%
ティッシュ配りが以外に高い。
【ネット広告の場合】
ページビュー（PV) × 転換率 × 平均客単価 ＝ 売上 となります。
ページビュー（PV）が10000PV、転換率1%、平均客単価5000円だったとすると、
10000PV × 1％ × 5000円＝500000、売上高50万円となります。
単純に転換率が0％だったとしたら、いくら広告費をかけてページビューを集めたとしても、売上高は0円です。
（転換率とは、訪問者数（PV）の内、購買に至った数の割合です。例えば、1000PVの内、10人が購買に至ったとすると、10/1000＝1%となります。）
AIBOの次は『Nao』：詳細なプログラムが可能な人型ロボット
仏Aldebaran Robotics社のロボット『Nao』が、人型ロボットによるサッカーの年次国際大会『Robocup』に参加するロボットファンの間で人気を集めている。
だが、一般のユーザーがNaoを入手できるようになるのは、まだかなり先のことだ。
Naoは完全にプログラム可能なロボットで、さまざまな機能を備えている。人間に似た外見で、多種多様なタスクをこなすことができる。米AMD社のクロック周波数500MHzのx86系CPU『Geode』、1GBのフラッシュメモリ、256MBのSDRAM、スピーカー2基、イーサネットポートを搭載し、視覚情報処理機能やWi-Fi接続機能も備える。
Naoは25の自由度を持つ。これは、頭部を傾けたり、左右を見たり、そろそろと歩行することのほかにも、たくさんの動作をこなせることを意味する。
この自由度により、白紙状態のロボットを入手してプログラムしたいと考える研究者やロボットファンにとって、Naoは非常に魅力的なマシンとなっていると、Aldebaran社のソフトウェア・エンジニアを務めるChris Kilner氏は語る。
Web 開発に便利なジェネレータ 50+
WebOS Goodies より
CSS レイアウトジェネレータ
CSS レイアウトジェネレータ
- CSS ez
- ビジュアルな CSS レイアウト作成ツール。 FC2, livedoor, Ameba など多数のブログサービス用のテンプレートを生成できる。
- templatr
- WordPress のテンプレートを作成するツール。基本レイアウトが多彩に用意されている。ただ、各要素は CSS パラメータを直接指定する感じなので、 CSS を理解していないと厳しいかも。
- CSS Menu Builder
- 水平（タブ）メニュー、垂直メニュー、ブレッドクラムの三種類のメニューを作成できる。いずれも多彩なテンプレートが用意されていて、なかなか実用的。
- IzzyMenu
- サブメニュー付きのメニューバーを作成できる。背景画像などのライブラリは無いが、他のユーザーが作ったメニューのカタログを参照することができる。サブメニューを作るのにログインが必要なのが難点。
- CSS Menu Generator
- ドロップダウンするサブメニュー付きのメニューバー、水平（タブ）メニュー、垂直メニューの三種類のメニューが作成できる。デザインの細かいカスタマイズはできず、プリセットされているものを選んで項目を編集するだけ。しかし、こちらはログインなしで使える。
- pForm
- インタラクティブに高機能なフォームがデザインできる。単純なフィールドだけでなく、日付・時刻ピッカーなどの高度なフィールドも用意されている。ただし、英語圏向けなのが玉に瑕。
- CSS Text Wrapper
- 自由形状に対してのテキストの回り込みを実現するツール。日本語でも大丈夫みたい。 Flash によるツールで左右の境界線を編集し、結果は style 属性、 CSS&XHTML 、 JavaScript の 3 つの形式で取得できる。
- CSS Type Set
- リアルタイムプレビューを見ながらフォント関連の CSS パラメータを調整できる。シンプルで使いやすい。
- TypeTester
- 3 つのフォント設定を比較しながら編集できる。 font-weight や font-style などの各設定の結果が一覧されているのが好みの分かれるところか。
- RoundedCornr
- 画像を使った丸角・グラデーション付きのボックスを作成する。結果は HTML, CSS, 画像x5 として取得できる。
画像加工
- Peacock
- モジュールを繋いで新たに画像を生成したり、元画像をさまざまに加工できるツール。使いこなすのは大変そうだけど、すごく強力なツールになりそう。
- dumpr
- 画像をアップロードするだけで、さまざまな加工を施すフィルター(?)をかけてくれるサービス。ユニークで癖の強いフィルターが多いので使いどころが難しいが、うまく使えば効果大。
- PhotoFunia
- 自分の顔写真などをアップロードすると、さまざまな風景に合成してくれる。ジェダイとか、スーパーマンとか、パイレーツ・カリビアンとか、いろいろなれる（笑）。
- BlurHighlight
- 画像をアップロードし、マウスドラッグで矩形領域を指定するだけで、その部分をハイライト表示してくれる。スクリーンショットの該当部分を目立たせたいときに便利。
- RoundPic
- 画像をアップロードするだけで丸角加工してくれる。角の丸み調整や、一部の角のみの加工も可能。
- Round My Corners
- 画像に丸角加工したのちにカバーフロー風のリフレクションも付加してくれる。
- WaveMyPic
- 画像に水面のようにアニメーションするリフレクションを付加してくれる。右下にサイトロゴが入ってしまうのが難点。
- 3D-box maker
- 前面、側面、上面の 3 つの画像を指定すると、ソフトウェアパッケージ風の 3D 画像を生成してくれます。オリジナルソフトの配布サイトなどで使うと良さそう。
- GIFMAKE
- 複数の画像ファイルをアップロードすると、それらをまとめて GIF アニメーションに変換してくれる。リピート回数や全体の画像サイズをどの画像にあわせるかが指定できる。
ボタンジェネレータ
- As Button Generator
- リアルタイムプレビューを見ながらインタラクティブにボタンが編集できる。機能的にも自由にテキストや画像を配置できたり、ベベルやドロップシャドウのエフェクトがかけられたりと非常に秀逸。
- Button Boost
- とても多彩なパラメータを持つボタンジェネレータ。多数のテンプレートが用意されており、それを元にカスタマイズして好みのボタンが作れる。
- Buttonator
- 比較的シンプルなボタンジェネレータ。ボタンタイプやアイコンが豊富に用意されているのが特徴。
- classy buttons
- さらにシンプルなボタンジェネレータ。フォントをアップロードできるのが凄い。
- Brilliant Button Maker
- 一時期よく使われていた、 80x15 サイズのバナーボタンのジェネレータ。アイコンもアップロードして表示できる。
- Button Maker
- こちらも 80x15 バナーボタンのジェネレータ。アイコンのアップロードがない分シンプルで使いやすい。
ローディングアニメーションジェネレータ
- Ajaxload
- 言わずと知れた、ローディングアニメーションジェネレータの代表格。ここで作成したアニメーションはいろいろなところで目にする。タイプと色を選択するだけのシンプルさがいい。
- Load Info
- Ajaxload よりもアニメーションの種類が多く、サイズも 3 種類から選べる。
ファビコンジェネレータ
- favikon
- アップロードした画像を .ico に変換してくれるサービス。変換する領域をブラウザ上で指定できるのが特徴。
- Favicon Generator
- 文字で構成されたシンプルなファビコンを生成する。Brilliant Button Maker のファビコン版といった感じ。
パターンジェネレータ
- Stripe Generator
- ストライプ模様と言えばこのサイト。色、角度、幅などを自由に指定して様々なストライプが作れる。どの角度でもタイル配置可能な画像になるのが素晴らしい。
- Online Tartan Designer
- 3 つの色と角度、サイズを指定するだけでタータンチェックのパターンが作れる。暖かそうな雰囲気を醸し出したいときに。
- Tiled backgrounds designer
- タイルパターンによる背景画像のジェネレータ。キャンバスの質感がいい感じで、リアルな壁紙風の背景パターンが簡単に作れる。模様となる画像も豊富に用意されている。
- Background Image Maker
- 縦・横・斜めのストライプ、それにグラデーションの 4 種類のパターンが作れます。ストライプの線幅が指定できないのが残念。
ロゴジェネレータ
- Logo Creator
- Flickr 風、 Google 風など、 5 種類のロゴタイプがプリセットされており、簡単に実用的なロゴが作れる。「Beta」マークの表示も可能。
- Web2.0 Logo Creator
- 表示テキストとリフレクション、「Beta」マークの有無を指定するだけの簡単ロゴジェネレータ。
- Logo Maker
- グラデーションとリフレクションを施したロゴが簡単に作れる。グラデーションは 2 種類（単純な線形グラデーションと、 Web 2.0 風のグラデーション）から選べる。
- Web 2.0 Logo Creator Online
- こちらもグラデーションとリフレクションを施したロゴのジェネレータ。ロゴの左上に付けるアイコンが多数用意されている。
- Cool Text
- 多数のフィルターからひとつを選び、そのパラメータを調整してロゴ画像が作れる。どのフィルターもちょっとごっつい・・・。
- Logo Maker
- 多数のロゴアイコンからひとつを選び、それとテキストを自由に配置できるロゴ編集ツールが使える。作ったロゴの利用は有料になるようですが、ロゴデザインのモックアップツールとして便利。
グラフジェネレータ
- FooPlot
- 数式を入力すると、それをグラフ化してくれる。最大で 5 つまでの数式を同時に表示でき、生成したグラフは SVG, PNG をはじめとしてさまざまな形式で出力可能。
- iCharts
- Excel シートをアップロードすることでグラフを生成し、他のユーザーと共有できるサービス。作成したグラフは Web ページに埋め込むことも可能。
- Online Charts Builder
- Google Charts API を使ったグラフをウィザード形式で簡単に作れる。
- JSChart
- JavaScript を使ったグラフが作成できる。マウスオーバーで数値を表示するなど、インタラクティブなグラフになるのが特徴。
その他のページ要素のジェネレータ
- Tabs Generator
- タブインターフェースの画像を生成するジェネレータ。タブの方向、幅、高さ、グラデーション、角の丸み、ボーダーの太さなど、あらゆるパラメータが指定できる。
- Warning Label Generator
- 枠のタイプ、アイコン、メッセージを入力して警告ラベルの画像が生成できるジェネレータ。 Web サイト以外でも使えそう。
- Web 2.0 Badges
- いわゆる「Web 2.0 風ギザギザバッジ」のジェネレータ。テンプレートが 20 種類ほど用意されており、そこにテキストを乗せるだけで簡単にそれっぽいバッジが作れる。
- WEBSITE RIBBON
- サイトの右上に配置するリボンを生成するジェネレータ。結果は JavaScript を読み込む HTML コードになり、それをサイトに埋め込むだけで適切に画像を配置してくれる。
- Fresh Generator
- 丸角のグラデーションボックスにテキストを乗せた画像を生成するジェネレータ。ボタンジェネレータとして使ってもいいかも。
- E-Mail Icon Generator
- メールアドレスを表示するための画像が作れる。各 Web メールサービスのアイコンをあしらった凝った画像になるのが特徴。
実用性は疑問だけど、面白いジェネレータ
- favicon2dots
- ファビコンを 3D のドット絵風に変換してくれる。
- 幕末古写真ジェネレータ
- 画像を風化した銀塩写真のように加工してくれる。
- 硝子の円錐
- 画像をアップロードすると、全身タイツの人や学生たちが人文字を作ってくれる。
- signbot
- テキストを入力すると、電光掲示板風の GIF アニメーションを作成してくれる。
- Superstickies
- テキストを入力すると、付箋紙に手書きしたような画像を生成してくれる。
- Morphases.com
- 実写の顔の目、眉、鼻、口を移動できる。デジタル福笑い(?)。
「何も選ばない」生き方のすすめ
ストレス対処への新たな視点、宗教人類学--植島啓司氏（前編）
・“脅迫”で動いている社会
・どこまでも選択しない生き方
・風に揺られるように生きるほかない
・山積課題はいちばん簡単なものから
植島：たとえば、重要な会議に出席することとか書類をコピーしなくてはいけないこととか仕事がいっぱい重なったら、いちばん簡単なことから始める。
これは口でいうと易しく聞こえますが、意外と難しい。それだけに本当に大事なことです。
切手を買いに行くような些細な用事でさえ、5つも6つも重なっていたら途端に重荷に感じます。人間は、内容の軽重でなく、用事の総量で大変かどうかを考えてしまうもの。雑用とか大事な用件とかが同じくらいに頭の中を占めて焦っているときは、まずいちばん簡単なことから手をつける。そうすると、あっという間に仕事は減っていきます。
水曜日, 11月 19, 2008
デザイン講義
いいものはテーマ以上のいろいろなことを感じさせる
他人の目になって客観的に見る一番簡単な方法は、離れて見ること
シンプルが一番難しい。シンプルができるとプロと言える。引くことができる力があるのかないのか
バランスは、安定・快い・美的な均衡
破調は、動き・変化・崩したポイント（に目がいく）・インパクト
バランスとは、重さの感覚。形（面積）と色（明度）に分けて考える
コントラストは、動き・刺激・メリハリ・変化
「何かしまらないな」と思ったら、形か色でコントラストをつけてみる
コントラストが強すぎると思ったら、間の要素（白と黒だったらグレー）を入れてみる
メリハリとは、強弱
1.色のトーン（色調）に差をつける（特に明度差）
2.陰影をつける
3.セパレート（引き離す） → 白のライン（袋文字）で文字と背景を区切るなど
無駄を省く（限界まで）
例：お茶室、たるみの芸術
動・・・エネルギー、生命、行動、躍動感、人の目を瞬時にとらえる
静・・・思考、落ち着き、安定、時間をかけた対話
・斜めを使う
・一つのパターンを繰り返す
水平・垂直を使う
1つの画面には3方向以内にするのが原則。主な方向は1つ
いいものには方向があることが多い
デザイン史を勉強すること
西洋美術史（縦の芸術）と東洋美術史（横の芸術）
縦・・・上に、ひたすら高く。神に近づきたい、ただそれだけ
横・・・地震が多い。神への方向がなかった
シドニーのオペラハウスは斜め（オレンジの割れたところからイメージした）
リズムとは、小刻みな動き（ダイナミックな動きではない）
生き生き、躍動感、ほどよい変化
同じ形、同じ色の繰り返し
シンメトリーには4つある
ちなみに西洋はシンメトリー、東洋はアシンメトリー
・反射（左右対称）
形がまとまる、安定、ロゴやマークを作るときに役立つ
・移動（並進）
1本の線上に繰り返す → メインを盛り立てる。背景的な役割（メインではない）
・回転（点対称）
1点を中心に回転、放射状に広がる
広がり、形がまとまる、神秘性（花や雪の結晶など）
・拡大と縮小
リズミカル、エネルギーの増大
まとめると、新しい形が形成される
ばらつきが修正できる
単一のものを繰り返す
グループ化したものを繰り返す
デザインはすべてコラージュ。素材を集めてレイアウト
CREAMUより
デザイン講義
強さを出したいときは暖色を選ぶ
過去を思い出すと、豊かな表現ができるようになる
彫刻家は、石ころ一つを見たときに物語を作ることができる
ものを見るフィルタを変える訓練をすることで、パパッと切り替えられるようになる
ただ、フィルタを切り替えすぎるととっちらかってしまう → 整理が必要
1.三位一体
ボリューム、重みを均等にする
3はバランスがとりやすい数字（キリスト教の三位一体、雪月花、松竹梅、心技体など）
2つでバランスが悪いとき、もう一つ中間の要素を入れてあげるとバランスがとれる
2.三間連結
ホップ・ステップ・ジャンプの発想（だんだん大きくなる）、序破急。例：卵、ヒヨコ、ニワトリ
3.一種合成
アイディアに困ったら、ピカソとゴッホの画風を合成して自分のものにしてしまう、など
アイディアに困ったらこれ！とても使える
4.二点分岐（分解）
一つから二つに枝分かれする。同じ重みで分解していく。重みが同じじゃないとばらばらになってしまう
切り口を同じにして発想していく
分岐した後に、最初の要素が自然に連想されないとだめ
5.二軸四方
二軸（縦横）、四方（上下左右）に分けて考える
色を選ぶときはこれ（西洋・東洋・神秘・科学にわけたときの色は？など）
対比的にするとわかりやすい
困ったら図解
盲目的にとにかく発想するのではなく、上記の5つに分けて考える
フォント = 文字の形・書体・コンピュータを使って印字されるもの
タイポグラフィ = 印刷文字を使ったグラフィックデザインの総称。タイポグラフィは文字をデザインとしてとらえている
書体（形）・・・テーマに合わせて自在にアレンジする
大きさ
文字間
配列
塊としてとらえる
形・文字 → 内容を伝える
色 → 雰囲気を伝える
押しじゃない案については悪く言い、一番押しのものはべたぼめする
一番押しの案は最後が鉄則
グーテンベルク → 印刷
ペーター・ベーレンス → タイポグラフィ（サンセリフ体）
未来派ダダ → 水平垂直の構成を解放
バウハウス → モホリ・ナギ（文字と写真のコラージュ）
→ ヘルベルトバイヤー
ヤンチョヒルト → 新しいタイポグラフィ。ロンドン、ペンギンブック社で活躍
CREAMUより
火曜日, 11月 18, 2008
木曜日, 11月 13, 2008
正規表現シュミレーター
http://www.ideaxidea.com/archives/2008/12/post_964.html より
strfriend PHP正規表現チェッカー Rubular: a Ruby regular expression editor and tester
正規表現が何を意味しているのかをグラフィカルに表示。わかりやすい。
↑ メアドの正規表現だと。
↑ こういう意味です。
これが定番かな。ちょっとチェックするのに最適ですね。横にレファレンスがあるのが素晴らしい。
これはRuby専用かな。他の言語でももちろん大抵OKだと思いますが。デザインが綺麗でわかりやすい。
火曜日, 11月 11, 2008
まじで使えるJavascriptライブラリ75選
» Lightview
スムーズに画像を拡大してくれる
» FancyUpload
アップロード中のプログレスを表示してくれる
» SWFObject
Javascriptを使ったFlashプレーヤ
» JavaScript tabifier
簡単にJavascriptで切り替えられるタブインターフェースが作れる
» FancyZoom 1.1
簡単なエンベッドでスムーズに画像を拡大してくれる
» SimpleModal
オーバーレイするクールなモーダルダイアログ
» A Mac OS X-style Dock In JavaScript
Mac OS XのDockの動きを実現するJavascript。↑のキャプチャはこちら
» Build An Incredible Login Form With jQuery
アニメーションで表示・非表示を切り替えられるログインフォーム
» Create a Slick Tabbed Content Area using CSS & jQuery
Javascriptによるタブ切り替えのチュートリアル
その他のリストは以下から。
» 75 (Really) Useful JavaScript Techniques
素晴らしいロゴをデザインするための45の法則
- 3つ以上の色を使わない。
- 絶対に必要というわけでないものはすべて除外する。
- 文字はあなたの祖母でも簡単に読めなければならない。
- ロゴとはっきり認識できなければならない。
- ロゴにユニークな形やレイアウトを取り入れる。
- あなたの親や配偶者がデザインについて思うことを徹底的に無視する。
- 3人以上の人にロゴが魅力的に見えるかを確認する。
- 有名なロゴの要素を使ってオリジナルだと主張しない。
- どんな場合でもイラスト集を使わない。
- ロゴは白黒でもかっこよく見えるべき。
- 逆さにしても認識できること。
- リサイズしても認識できること。
- ロゴがアイコンやシンボル、テキストを含む場合、それぞれ良さが引き立つように配置する。
- 最近のロゴデザインのトレンドを避け、時を超えていいデザインにしよう。
- 特別なエフェクトを使わない。
- 可能ならロゴを正方形の中におさめる。あいまいなレイアウトを避ける。
- ディテールが複雑にならないようにする。
- ロゴが違う場所や方法で掲載された場合を考える。
- 大胆で信頼の持てるデザインにする。退屈で弱々しくなってはいけない。
- 完璧なロゴを作ろうとしない。
- シャープなビジネスにはシャープなラインを、やわらかいビジネスにはやわらかいラインを。
- ロゴは表現するものと何らかの関係を持っていなければならない。
- ロゴに写真を使わない。
- プレゼンでクライアントを驚かさなければならない。
- 2つ以上のフォントを使わない。
- ロゴの要素は左・中央・右・トップ・ボトムのどこかに揃っていなければならない。
- ロゴはかっちりしているべき。要素を引きずってはならない。
- ロゴのアイディアを考える前に、誰がロゴを見るのかを知ること。
- 新しいものよりも、常に機能的なものを選択する。
- ブランド名が覚えやすいなら、ブランド名をロゴにすべき。
- ロゴは鏡に映しても認識できなければならない。
- 大きい会社であっても小さなロゴが必要。
- 全員が仕事だけでなく自社のロゴを気に入っているべき。
- たくさん作れば作るほど正しい答えにたどり着く。
- 複数のプラットフォームで一定の見え方になっていなければならない。
- ロゴは簡単に描けなければならない。
- ロゴにキャッチフレーズを使わない。
- PCで作業する前に、紙と鉛筆でアイディアを描いてみる。
- デザインはシンプルに。
- NIKEロゴのようなスウッシュや地球のシンボルを使わない。
- 紛らわしいロゴであってはならない。
- 表現したいことをストレートに表現していないといけない。
- ロゴはバランスのある見た目でなければならない。
- 明るいネオンカラーや暗くて鈍い色を使わない。
- ロゴは上記のルールをすべて守っていなければならない。
元記事は以下から。
多くの人が知らないが知っておくべきフリーウェアTOP10
» AutoHotkey
キーストロークを自動化するスクリプトが書ける
» MusikCube
iTuneライクなミュージックプレイヤー
» ImgBurn
ディスクからイメージファイルを作成しディスクに焼けるソフトウェア
» Blender
Pixarが作った素晴らしいCGI映画のようなグラフィックを作成できる
» Snipping Tool
Vistaに入っているスクリーンショットを撮れるソフト
» Foxit Reader
Adobeリーダーの代わりになり、動作が早く使いやすいソフト
» Windows Live Writer
WordPressやBlogger、TypePadに対応したデスクトップ上でブログを書くことができるソフト
» IrfanView
多機能なイメージビューア
» ConTEXT
ソフトウェアデベロッパーにも使いやすいエディタ
» Sharepod
iPodから曲を取り出してPCに入れられるソフト
コーディングをさっと済ませるためのCSSテンプレート集
» Dynamic Drive
2カラムや3カラム、固定幅、リキッドレイアウトなど、たくさんのCSSレイアウトを配布
2カラムや3カラム、固定幅、リキッドレイアウトなど、たくさんのCSSレイアウトを配布
» Code Sucks
90のフリーCSSレイアウト
» Layout Gala
40のCSSレイアウト
» CSS Creator
幅や背景色などを指定してXHTMLソースが生成できる
» Whiteboard
フリーのワードプレステーマフレームワーク
» Yet Another Multi-Column Layout
モダンで拡張性のあるレイアウトを作るための(X)HTML/CSSフレームワーク
90のフリーCSSレイアウト
» Layout Gala
40のCSSレイアウト
» CSS Creator
幅や背景色などを指定してXHTMLソースが生成できる
» Whiteboard
フリーのワードプレステーマフレームワーク
» Yet Another Multi-Column Layout
モダンで拡張性のあるレイアウトを作るための(X)HTML/CSSフレームワーク
フリーウェアで有料アプリを代替--節約上手なソフト選び
フリーウェアで有料アプリを代替--節約上手なソフト選び
OpenOffice.org、GIMP、KompoZer、Inkscape、PrimoPDF、Synfig Studio、Jahshanka、AVG Anti-Virus Free Edition、Avira AntiVir Personal Free Antivirus、CamStudio、Gadwin PrintScreen、7-Zip、ToneThis、IOBit Smart Defrag、BurnAware Free、Ashampoo Burning Studio Free、Windows Live FolderShare
フリーウェア：Windows Live FolderShare
代替対象：SugarSync
代替対象：SugarSync
フリーウェア：BurnAware Free、Ashampoo Burning Studio Free
代替対象：Nero
代替対象：Nero
フリーウェア：IOBit Smart Defrag
代替対象：Diskeeper
代替対象：Diskeeper
フリーウェア：ToneThis
代替対象：携帯電話の着信音配信サイト、iTunes Store、Thumbplay.com
代替対象：携帯電話の着信音配信サイト、iTunes Store、Thumbplay.com
フリーウェア：7-Zip
代替対象：WinRAR、WinZip
代替対象：WinRAR、WinZip
フリーウェア：Gadwin PrintScreen
代替対象：SnagIt 9
代替対象：SnagIt 9
フリーウェア：CamStudio
代替対象：Camtasia Studio
代替対象：Camtasia Studio
フリーウェア：AVG Anti-Virus Free Edition、Avira AntiVir Personal Free Antivirus
代替対象：McAfee、Norton、Kaspersky
代替対象：McAfee、Norton、Kaspersky
フリーウェア：KompoZer、Inkscape、PrimoPDF、Synfig Studio、Jahshanka
代替対象：Adobe Creative Suite
代替対象：Adobe Creative Suite
フリーウェア：GIMP
代替対象：Adobe Photoshop Elements
代替対象：Adobe Photoshop Elements
フリーウェア：OpenOffice.org
代替対象：Microsoft Office Home Edition
代替対象：Microsoft Office Home Edition
土曜日, 11月 08, 2008
木曜日, 11月 06, 2008
デザイン講義
・デザインの力とは
デザインの力とは、造形と色彩をとらえること
・発想力をつけるには
発想力をつけるためには、自分の生活や趣味を超えるものを見てみる
・技術と発想力
デザインには、技術と発想力が必要。技術だけなら誰でもできる。デザイナーに問われるのは発想力。これがないとデザイナーに頼む意味がない
・プロになる条件
・自分を否定しない
・他人と比較しない
・完全を求めない
これらをすべて否定すると、この世界で能力がないんじゃないか、才能がないんじゃないかと思ってしまう。脳科学者の茂木健一郎氏が言っていることと合致するが、自分はバカだと言っていると本当にバカになる
・レオナルド・ダ・ヴィンチの言葉
レオナルド・ダ・ヴィンチは、「自分で納得できる作品は一つもない」と言った。ある程度のところで手放していかないと先に進めない
・才能とは
才能とは、努力して得られる能力。生まれ持ったものではない。つまり才能がないのではなく誰でもなれる。「俺最高」くらいの気持ちで
・デザインの目的
・メッセージを伝える
・人を幸せにする、喜ばせる
・生活に直接関与する
・美的な安らぎを与える（デザインは常に進化する。後退することはない）
・機能的な満足
・デザインの役割
コミュニケーションジョイント
個人・モノ（ファッションデザインやプロダクトデザイン）・組織（企業のHP、ロゴやCIなど）・環境（建物や街、インテリア）を結びつける
・デザインの条件
・大勢の人に受け入れられる
・多くの人に手渡せる
・人の目をとらえる（インパクト）、しばらく引きつける（パワー、訴求力）。
シンプルが原則
・理解される
言いたいことを持っている。うまく行かない場合はここがあやふや
デザインは結局この4つができればいい
・表現とは
自分の気持ちを相手に伝えること
五感に訴えるものを使う。デザイナーが使うのは視覚だから、視覚について敏感になる必要がある
五感を常に意識すると、審美眼がついてくる。何が本物なのか、何が永遠に残るのかがわかってくる
・背景
いいものは背景に手を抜いていない。目立つものが生きているかどうかが重要
・発想力を鍛えるには
出てきた発想の流れを知る（頭の中をトレースする）。何かを考えたら、なぜそう考えたのかをトレースすることが大事
.htaccessに関する覚え書き
この覚え書き、便利です。
ディレクトリー内をブラウズ可能に
Options +Indexes
## block a few types of files from showing
IndexIgnore *.wmv *.mp4 *.avi
その逆
Options All -Indexes
エラーページの指定
ErrorDocument 403 /somePage1.html
ErrorDocument 404 /somePage2.html
ErrorDocument 500 /somePage3.html
デフォルトで表示されるページの順番を指定
DirectoryIndex myhome.htm index.htm index.php
アクセス制限
order deny,allow
deny from 123.456.789.00
deny from 123.456.789.00
deny from .someDomain.com
allow from all
Block Visitors From Specific Referring Sites
RewriteEngine on
RewriteCond %{HTTP_REFERER} site-to-block.com [NC]
RewriteCond %{HTTP_REFERER} site-to-block-2.com [NC]
RewriteRule .* - [F]
検索ボットを拒否
RewriteEngine on
RewriteCond %{HTTP_USER_AGENT} ^searchbot1 [OR]
RewriteCond %{HTTP_USER_AGENT} ^searchbot2 [OR]
RewriteCond %{HTTP_USER_AGENT} ^searchbot3
RewriteRule ^(.*)$ http://www.yourSite.com/goAway.html
OR
RewriteEngine on
RewriteCond %{HTTP_USER_AGENT} ^searchbot1 [OR]
RewriteCond %{HTTP_USER_AGENT} ^searchbot2 [OR]
RewriteCond %{HTTP_USER_AGENT} ^searchbot3
RewriteRule ^(.*)$ http://www.someOtherWebsite.com/ [R, L]
説得力のあるスライドを作る 3つの重要ポイント
説得力のあるスライドを作る 3つの重要ポイント
【1】 シンプルにまとめる
パワーポイントなどのプレゼンテーションソフトには、さまざまな機能がありますよね。でも、機能を使いすぎると、聴衆はスライドの派手さに目が行ってしまいます。Simple is best. そのスライドで伝えたいことを簡潔にまとめましょう。
【2】 スライドを読まない
1枚のスライドに何行もの文章を書き、実際のプレゼンテーションで長々と読む人、いますよね。それでは聞く方は眠くなってしまうかもしれません。スライドには、ぱっと見てわかるポイントだけを載せて、聴衆があなたの顔を見て話が聞けるようにしましょう。
【3】 枚数でプレゼン時間を管理
「1時間程度のプレゼンをしてください」と言われたとき、どうやって時間配分しますか？行き当たりばったりではなく、何回そのプレゼンをしてもほぼ同じ時間で終わるようにするのには、スライドで時間配分をするのがいいですよ。このスライドでは何秒、もしくは、何分話す、と決めておきましょう。準備段階で、予定時間を越えそうな場合、時間が余ってしまいそうな場合も、30秒分のスライドを2枚足す、というように調整すると、プレゼン時間をコントロールしやすいです。
火曜日, 11月 04, 2008
土曜日, 11月 01, 2008
オンラインプレゼン作成ツール『sliderocket』
オンラインプレゼン作成ツール『sliderocket』
ブラウザだけでさくさくスタイリッシュなプレゼンが作れますよ。いわゆる「パワーポイント」的ではなくて「Keynote」的なエフェクトとかが充実しまくっています。
まずはデモを見ていただくと一番良いかと。デモページから作品が見れますよ。
Generate Design、DESINGTIDE TOKYO 2008
画像をアレコレできちゃうソフト＆ツール
画像をアレコレできちゃうソフト＆ツール
http://www.lifehacker.jp/2008/11/post_338.html
【画像編集系「フリーソフト」】
・オープンソース画像編集フリーソフト『GIMP 2.6』（5つの技）
・かなりフォトショップ風な画像編集ソフト『Artweaver』
・普通のデジカメ写真を鮮やかに演出する画像編集ソフト『Qtpfsgui』
・写真にエフェクトをかけられる画像処理ソフト『Phantasmagoria』
【画像編集系「Webツール」】
・ブラウザ上で画像を編集できちゃう「DrPic.com」
・それなりに画像の加工や製作ができる「Pixlr」
・写真をイラスト化してくれる「BeFunky」
・写真をシブく劣化してくれる「幕末古写真ジェネレータ」
・画像にミラーイメージを追加できる「MirrorEffect.net」
【画像の「管理・閲覧・保存」ソフト＆ツール】
・顔認識機能搭載！ 新しくなったGoogleの画像管理ソフト『Picasa』
・見栄えよく画像・動画を閲覧できるビューワー『Pictomio』
・RAWをサクッと閲覧できる『Instant JPEG from RAW』
・写真やビデオを1TBも保存できるオンラインストレージ「Oosah」
【画像の「検索」ソフト＆ツール】
・画像を認識してくれる新ウェブアプリ「ALIPR」
・似てる画像を探してくれる「Pixolu」
・画像の重複を検索・削除してくれるフリーソフト『DupliFinder』
・Flickrの画像を色別検索できる「Multicolr Search Lab」
【画像の「素材」サイト】
・商用利用OK・事前手続き不要の写真素材サイト「写真素材 足成」
・その名もズバリなサイト「2000ピクセル以上のフリー写真素材集」
・ベクターデータの無料素材集サイト5選
・続・ベクターデータの無料素材集サイト5選
登録:
投稿 (Atom)