:: Love & Design ::

2008-08-20 Wed

ハートレイルズ「breakr」のデザイン担当

デザインを担当させていただいた、ハートレイルズのソーシャル英語学習サービス「breakr」が本日正式にリリースされました！
Fly fearlessly» Blog Archive » breakr の運営開始

posted by らぶ | Comment(23) | TrackBack(1) | 04 Design*.

2008-07-02 Wed

国内ソーシャルブックマークサービスまとめ

ソーシャルブックマークサービスは、ウェブ上にブックマークを保存して情報を整理したり、共通の興味を持つ人を発見したり、繋がることが（も？）できるウェブサービスです。

海外では、del.icio.us や Digg などが有名ですが、日本発のサービスは現在どれ位あるんだろうと国内のソーシャルブックマークサービスを調べてみました。

使ったことがあるものから今回初めて知ったものまで、サービスによって機能もさまざまで、いろいろな特徴を持っています。
（詳細は公式サイトでご確認ください）

ギークな人もそうでない人も、インターネット生活に欠かせないウェブサービスになりつつあるようですね。

posted by らぶ | Comment(36) | TrackBack(1) | 02 Blog*.

2008-06-23 Mon

TB企画*これがないと困る！Firefox 3 のアドオンリスト

もうあなたなしでは生きていけないわっ！なんて大げさすぎますが、Firefox がなければブログも書けないほど「これがないと困る！」Firefox 3 のアドオンリストをトラックバックで募集してみます。
人のアドオンを見るのって楽しいですよね。

posted by らぶ | Comment(8) | TrackBack(17) | 02 Blog*.

2008-06-23 Mon

Seesaa ブログから Wordpress に引っ越し

Seesaa ブログには、MT（Movable Type）形式に対応した「エクスポート」機能があります。この機能を使えば、Seesaa から Wordpress にも簡単に引っ越しすることができます。

記事だけでなく、コメントとトラックバックもエクスポートできるので、丸ごと Wordpress に移しました。

以下、手順をメモっておきます。

posted by らぶ | Comment(27) | TrackBack(1) | 02 Blog*.

2008-06-18 Wed

Firefox3 ギネス世界記録に挑戦！

6月18日午前2時、Firefox3が正式にリリースされました。
今回はダウンロード数でギネス世界記録に挑戦！ということで、さっそく会社と自宅でもダウンロードぉおおお！

あなたもダウンロードしてギネスに挑戦しよう！
（ギネス世界記録への挑戦は日本時間 19 日午前3:16 まで）

posted by らぶ | Comment(2) | TrackBack(0) | 02 Blog*.

2008-06-12 Thu

Web制作者とクライアントのコミュニケーション術

これだけは知ってほしいウェブデザインの常識を読んで。

リンク先の記事は、ロサンゼルスで働くウェブデザイナーでおなじみの河内さんが「最低限これだけは発注前にクライアントの方々に認識しておいてほしいウェブデザインの常識」をまとめています。こちらの記事のような、苦い思い出のある方もいらっしゃるのではないでしょうか。

　Webサイトの仕上がりのよしあしは、Web制作者とクライアントとのコミュニケーション次第といっても過言ではないと思います。

　そこで、制作現場で起こりそうなケースごとに「最低限これだけはWeb制作側がしておきたいこと」をリストアップしてみました。お互い「こんなはずじゃなかった」とならないために、生意気を言うようですが、Web制作の「プロ」として何ができるのか、今回はそんなこと考えてみたいと思います。

最低限これだけはWeb制作側がしておきたいこと

ケース1：思い描くイメージのギャップ

【デザイン編】写真の位置や余白、フォントサイズが違うとか……。
サイズの固定された“A4紙”と解像度の異なるディスプレイでは見え方が違うことを説明する
　対処法 → カンプ（ラフデザイン）は実際の環境／ブラウザで確認してもらうこと

【Flash編】口で説明されてもイメージがわからない……。
WEBディレクターのための方法論 : Flashのデザインチェック
↑思わず笑ってしまいました。（コメント欄参照）
「ここはチャキ～ン！シュワ～！って感じでお願いします」みたいな擬音での説明は、よほどの関係じゃない限り伝わりません。とは言うものの、「マスクかけて」とか、アクションスクリプトの「○○メソッド使って」なんて言うクライアントもいません。
対処法 → 絵コンテや動き方のサンプル、参考サイトを見せて具体的なイメージを伝える

ケース2：色情報の伝え方

「赤」という同じ言葉でも、イメージする色は人によってさまざまです。
当然のことながら、印刷物の色（CMYK）とディスプレイで見る色（RGB）とでは見え方が違います。インクの色を100％再現することは不可能です。
　対処法→印刷ではなく、色もディスプレイで確認してもらうこと
　色の面積や、ディスプレイ（Win／Mac）の設定によっても見え方が違うことを説明する

ケース3：修正・追加作業の繰り返し

いつまでも修正が終わらない
ページ単価の場合、1ページに収めれば追加料金が発生しないと思われる
　対処法 → 大がかりな修正、追加料金が必要なものは事前に説明する
　サイトマップ・仕様書・画面設計書（ワイヤーフレーム）をしっかり作る
参考：第35回　画面設計書はどう作られるべきか：ITpro

ケース4：いわゆる「言った言ってないよ」問題

お金も絡むことなので口頭の約束や指示はとにかく残すこと
　対処法 → 必ずメールや書面で確認する

ケース5：いわゆる「言わなくてもわかるでしょ？」問題

いわゆってないけど、長年連れ添った夫婦や超能力者じゃあるまいし、伝えないことにはわかりません。
　対処法 → プロジェクトメンバーとの情報の共有
　クライアントに「わかる言葉」で説明して納得してもらう努力が必要

無理矢理まとめ

もっと話そう。「なんだ、それだけかよ！」というツッコミはなしの方向で。
他にこんなケースもあるよというご意見もお待ちしています。

【あわせて読みたい】

CLOSE ↑

posted by らぶ | Comment(9) | TrackBack(0) | 04 Design*.

2008-06-09 Mon

これがないと困る！Webサービスベスト10

もうあなたなしでは生きていけないわっ！なんて大げさすぎますが、毎日のインターネット生活の中で、わたしにとって「これがないと困る！」と思うWebサービスを10コ選んでみました。

posted by らぶ | Comment(12) | TrackBack(10) | 02 Blog*.

2008-05-30 Fri

Webデザイナーの役目とは

MarkupDancing » ウェブ業界の肩書きあれこれ

わたしの肩書きは「Web デザイナー」です。（べにぢょみたいに“無駄にエロい”仕事はじめました！て言いたいけど）職業を聞かれてそう答えると、世間の人たちからは「Web デザイナーって何？」みたいな顔をされたり「パソコンに詳しい人」なんて言われたりします。Web デザイナーに対する一般的なイメージってどんなものなんでしょうか。たしかにパソコンも使いますが修理はできませんっ＞＜

この業界に片足突っ込んだばかりでえらそうなことは言えませんが、わからない「今」だからこそ、わたしが目指すWebデザイナー像を書き留めておこうと思います。

posted by らぶ | Comment(8) | TrackBack(1) | 04 Design*.

2008-05-16 Fri

Dreamweaver CS3 の勉強中

今、Webサイト制作ツール Adobe® Dreamweaver® CS3（以下、ドリウィ）の勉強をしています。

これまで mi （テキストエディタ）で十分じゃんと思っていたけど、ドリウィの本を買ってサンプルサイトを作ってみたらめっちゃ便利やんっ！！

なんとなくソフトの使い方を覚えるほうが面倒だなーと敬遠していましたが、ドリウィのほうが格段に楽になってミスも少なくスピードもアップするなら使わないと損！

posted by らぶ | Comment(3) | TrackBack(0) | 04 Design*.

2008-05-01 Thu

リンク色を変更

今日から5月ですね。気分を変えてリンクの色を変えてみました。ちょっと色を変えるだけで、印象も気分も変わります。

変更前

CSS：下線なしのピンク


a:link {
	color: #ff1a81;
	text-decoration: none;
}

a:visited {
	color: #ab1498;
	text-decoration: none;
}

a:hover {
	color: #ff0084;
	text-decoration:underline;
}

a:active {
	color: #663399;
	text-decoration: none;
}

変更後

CSS：黒に下線付き


a:link {
	color: #000;
	text-decoration: underline;
}

a:visited {
	color: #555;
	text-decoration: underline;
}

a:hover {
	color: #fff;
	background: #000;
	text-decoration: none;
}

a:active {
	color: #555;
	text-decoration: underline;
}

目にうるさいのでサイドバーのリンクは下線なしのままにしています。

追記：またピンクに戻した（5/9）

CLOSE ↑