前回報告した「WEBサイトの見た目の変更」以外にも細かい変更をしています。
それがユーザビリティ改善です。

というのも今までユーザビリティなんてあまり考えてなかったんです。

個人のブログだからそんなこと考えなくても良いじゃないかってのも手伝って、最初にデザイン組みをしてあとは記事を流し込むだけのブログ。
時に面白そうなブログパーツがあったらサイドバーに設置するぐらいだったんです。

以前までのブログは、僕の中で「見た目重視」。
好きなシンプルなデザインを基調として、そこに自分らしさ、ブランディングを築いていきました。

で、今回。
今回は出来るだけの実験をしたかったです。
いわばチャレンジの構成。
まず、脱ブログの見た目。
そして、やりすぎだろうと思わせるビジュアル演出。
「重い！」と言われるのは端から承知で、色んなモノを詰め込みました。

そして今度はユーザビリティ。
これだけ「やりすぎ」な演出とか書いておいてユーザビリティは無いだろうという気もしないでもないけど、詰め込めるだけ詰め込むのが今回のテーマ。
押しつけがましい作り手本意のユーザビリティだけど、いくつか追加したので紹介します。

まずは個別ページの一番下にある「ページのトップに戻る」リンク。

これはブログならではの長い記事をスクロールウィールをゴロゴロ転がしてページのトップへ戻すことなく、クリックだけで上部に戻れ、トップに配置してあるナビゲーションバーから他の記事を閲覧することが出来る。
単なるリンクだけでも機能的には果たしているのだけれど、分かりやすさという点から、スムーズにスクロールしてトップに戻るような演出を施してある。
これは、どこからどこへ行くか目で見て分かるという物。
クリックしていきなりトップに戻されると、「どこへ飛ばされた？」と一瞬分からなくなるが、このエフェクトで潜在的な安心感が得られ得ると思う。

まぁ、ここら辺は作り手のエゴみたいなもんだけど。（;´Д｀）

で、つぎ。
次からはユーザビリティと言うよりも、もっと記事を見せたい策。

そう、ウチのブログは素晴らしい直帰率。（ひどい日なんて90%を越える）
しかも滞在時間が1分以下がほとんど。（google Analytics調べ）
よく調べてみてると、グーグルで検索して中身をちょろっとみて帰っちゃうパターンが多いのです。（トラフィックサマリーでは検索エンジンからが52.58%、参照サイトからは30.52%、ノーリファラ…つまり固定ユーザーさんが16.91%となっている）

コレにはサイトの作りにも問題があることを知っていました。
どこが問題かというと、記事の先の広がりがないんです。
導線がなければ、バックボタンをポチッとされちゃうわけですよね。

そこで、２つの対策。

まず一つめは、「こちらもあわせてどうぞ」という文字に併せて関連記事を持ってくるようにしてみた。
この対策で、見に来た記事の関連記事ならば見てみようという気にもなるかもしれない。
まぁ、もっともこの関連記事が全く違い記事を引っ張ってきている（本文の内容やタグ内容などのバランス調整が出来ていない）ので、あまりまだ機能しているとは思えないんだけど、明らかに前よりは広がりが出たと思う。

そして二つめ。
ありそうでなかった記事の前後移動。
これにもポイントがあって、単純に「最近の記事」「過去の記事」とのリンクにせずタイトルを表示させることによって、僕のブログ特有のつぎになんのネタが来るか分からない（ジャンルがばらばら）というところを狙ってみた。
一つめにあげた物とは違う性格なところがポイント。

ここら辺の対策をしただけで、まだ数日だけれども確実に滞在時間と直帰率に変化が見えた。

こういった地味な改修でも、「あぁ、いままでなんでなかったんだろう」と思えるほど自然だって事は、何かが欠如していたんだよね？

これがゴールデンウィーク後半の僕の勉強の結果です。

ウィジットなど、ブログの見た目をカスタマイズするのもいいけど、こういった地味な改修も重要だと思いました。
是非是非、みなさんもWordPressで「気付きにくい部分の改善」にチャレンジしてみてはいかがでしょうか？
ブログを見直すのもいいよね。

ではでは。
（てか、文字書きすぎたな…。長くてスマン！（;´Д｀））

さらに、思いっきり言葉をはき違えてたら指摘ください(´；ω；｀)

仕事でWEBまわりやっているけど、CMS化が進んだ昨今ではデザインをすることがない。WEB屋さんならば別なんだけど、企業の中のWEB担当はほとんどがコンテンツ作成でのパーツレベルのデザインで終わっているんじゃないだろうか？

そんな僕も社内の顧客WEBDBを作ってもう数年、画面周りを変更していない。

ヘタにUIを変更すると使い勝手が変わり、派遣社員さんの効率化を逆に妨げてしまう事になるからだ。

そんなわけで、どちらかというと仕組みを見直すことの方が多くて、デザインとはホント数年関わっていないことになる。

そこで、個人的にblogをやりながら、アレもやりたいコレもやりたいが累積していって出来上がったのが現在のanycolorの姿なのだけれど、まぁ、蓄積していたものが爆発しただけに詰め込みすぎ感が無くもない。

まぁ、コレはコレで良い実験になったし、僕の中の何かがまた燃え始まった気がする。

とにかく、久しくWEB業界にいながらも一企業の担当者兼内製化担当なだけであって、最近のテクノロジを学べて良かった。

コレを他に流用できないか？といろいろ考えつつも、今の僕には全くといって良いほど引き出しがない。このケースならこういうアプローチや見せ方がありますというプロポーザル的なものが全く出来ない。

そして、それに付随すべきスキルも無い。

普段から物を分解する目線で見ているけど、このところはブログばかり。
まぁ、CMSを牽引してきたのがブログだから仕方ないが、どーにも2カラム、3カラムの一般的なレイアウトしか目につかない。

あるとすればカレンダはつけるかとか最近のコメントはどこに表示するか？とか、単純なことだ。

もっと情報はデザインされているはず。
ただそれを分解してみる目が今の僕には欠けている。

今後はブログだけでなく、色んなサイトを見て、それぞれの仕組みを学んで見たい。

そう思った連休の最終日だったのでした。

（…って、ここ数日思ったことをキレイにまとめた！と自分で思ったりしてｗ）

ロゴデザインはそのブランドの第一印象です。

ロゴ、そしてサイトはそのサービスの顔なのです。
その為、デザインはブランディングにとっては重要だったりするのです。

以前、グラフィティのロゴを作成し、ホームページを運営していたときは「あ、このロゴ見たことある」と嬉しい言葉をもらったことがあります。

ロゴがもたらす効果は、運営者のモチベーション、ブランディング、さらにはコンテンツにまで影響するほど重要なのです。

…と、ウンチクを並べましたが、ココは僕のポートフォリオのサイトではなく、anycolorという僕の個人的なブログなのでサラッと流してもらいまして…。

僕がロゴにポイントを置いているところは何ポイントかあるのですが、ビジュアル面でいうと、単純であることと1色で判別つくかという「わかりやすさ」を重点に置いてます。（墨のみとか白ヌキとかね）

で、今回のanycolorのロゴは色々と悩みました。
サイト自信にあまりに多くの情報を取り入れすぎて、具体的な形とならないのです。

前身であるグラフィティでは、僕のはき出す情報が僕の人生そのものの落書きなんだよという事からネーミングをつけ、図案としては枠からはみ出すぐらいに大きく、遊び心があり、そして誠実にということで、ロゴのカラーとして紺を選択しました。

そしてanycolor。

-　あなたの色をそのままに。欲しい色はどんな色？　-

名前にあるとおり、テーマは色なんですよね。

かといってカラフルにもしたくはなく、苦労しました。

結局、思い浮かんだのはパレットの上の絵の具でした。
柔らかい曲線で頭文字の「a」をデザインすることにしました。

しかし、コレがなかなかまとまらない。

1度目のデザインでは「a」と「c」の頭文字を併せ持とうとしたので、デザインに迷いがあり、挙げ句に描いた曲線までも迷いがあり中途半端な物となってしまいました。

これじゃいかんと、リニューアルを機にロゴマークも一新。
原点懐古ってことで、シンプルに円と線から練り直しました。

正直見た目はあまり変わっていないように見えるかもしれませんが、文字の肉の持たせかたなど、大分変更しました。

併せてロゴタイプも変更しました。

まだまだシンボルカラーの決定には至っていないのですが、場合に応じた数パターンを用意する形でやってみたいと思います。

※ なんか改めて仕上がりを見ると、シンプル過ぎるぐらいシンプルだな。
遊び要素入れれば良かったかしら…。

2009年はユニバーサルフォントの年（トレンド）だと言われていましたが、C4からユニバーサルフォントラインが出てきました。

昨今ではアクシズフォントが脚光を浴びて、様々な業界で利用されてますよね。

フォント業界は何気に熱いです！

ここでユニバーサルフォントってなによ？って思われる人も多いかと思いますが、いわゆる年齢・性別や障害に関係なく、あらゆる人が商品・サービス・住居・施設を快適に利用できるように配慮されたデザインのフォントです。

フォント自体のデザインをすっきりすることにより、誤読しやすい6と9、RとB、OCGとOOOのような文字列が見やすいデザインとなっているわけです。

焦点のズレや環境による光量過多（文字がやせて見えますよね？）での視認性、先ほど例に挙げた6と9のような点対称の文字や外形が似ている文字を出来るだけ読みやすくってことですね。

まぁ、ここら辺のラインはモリサワの新ゴシックあたりが好まれてつかわれていたり、近頃だとイワタUDなんてのは、家電用のフォントデザインをして電子・電気製品・OA機器の操作表示、リモコン操作表示、交通標識や各種案内表示板・看板などなど、利用用途により表示用と本文用を作成しているのです。

で、今回のC4から出てきたユニバーサルフォントラインも同じような流れの形。

作成したのはWindows Vistaで採用されたフォントメイリオ（明瞭）のフォントアライアンスネットワーク。

Windowsでは文字が読みにくかったのですが、このスクリーンフォントの登場で大分読みやすくなったのではないでしょうか？（MSゴシックがひどかったですからねｗ）

まぁ、これと併せてクリアタイプなる技術によって画面上でも可読性が良くなったってのもありますしね。

…あ、話がずれた…。

このままではC4の紹介というよりもユニバーサルフォントの話になりそうだｗ

さて、そのC4のユニバーサルライン。
とても素敵なフォントです。
僕もお金に余裕が出来たらポチッとする予定です。

■　C4　ユニバーサルライン　http://www.type-c4.com/products/universal-line/family.html

※ダウンロード販売は1書体12,000円なのに、パッケージ販売が『C4 ユニバーサルライン』全8書体パック：直販価格 44,000円（税別）ってのはどゆことよ！？

ダウンロードでもパック物をだしてくれー！！o(｀ω´*)o

■　イワタUDフォント　http://www.iwatafont.co.jp/MO_FONTS/set_list.html

トラックバックをもらって知ったのだが、taroさんが名刺デザインを変えるらしい。
taroさんの名刺といえば、僕が個人名刺で刺激を受けたもの。
それまで仕事以外では名刺交換した事が無く、個人の斬新なデザインの名刺に驚かされ、「作りたい！」という気持ちがどこからともなく湧き出したものだ。
サイトロゴをあしらうとの事で、僕も勝手ながらtarositeをいじらせてもらった。
題して、「昼休みにtaroさんのロゴを勝手にいじってみたよ」。
…え？また昼休み？と思われるかもしれないが、オレにとって昼休みは仕事の頭が残って居つつもほかにパワーを回したい時間なのである。
だから、大概昼休みにブログを書いていたりする。
今日はtaroさんのロゴを頭に浮かべながら喫煙所にノートPCを持ち込んでの落書きとなる。
これぞ、グラフィティ。（笑）

さて、tarositeのロゴ。
必死に思いだそうとしたが、キチンとした形が頭に出てこない。
出てきている絵はオレンジのベースにAppleのiシリーズで使われているMyriadッポイ書体。それも白が混ざっていたなぁ…。とまぁ、これぐらい。
さて、あのロゴを名刺に使うとするとどのようなモノが良いだろうか…。
僕が考えるからには作ったモノと同じデザインでは全くおもしろみがない。
とりあえずロゴを起こしてみよう。
色々配置して見るも、頭を抱えるばかり。
分かった。僕はあまりにtaroさんを意識しすぎる。
もっといえば、キレイすぎるのだ。
そこで、もっと僕らしいアプローチにしてみようと方向転換。
ロゴをキャラクタ化してみる事にする。
仕事の頭が残っているせいか広げられる発想はドンドン形にしてみようという試み。
四角いロゴを思い浮かべ真っ先にボックスが頭に浮かんだ。
これをパースっぽくして全面にロゴをマッピングしてみよう。
（といってもイラストレーターなので素手マッピング）
「t」の模様が入った箱が出来た。
オレンジがポップな方面に働き、とてもかわいい。
ここに僕が思い描くtaroさんを付け加えて…。　ごそごそ…。
と出来上がったのが箱から「！」が飛び出したイメージロゴ。

taroさんは非常にアイディアマンだ。何か常に作り出そうとしている姿を形にするとこうなる。吹き出しも飛び出させてtarositeから色んな情報が出ているイメージでも良いかもしれない。よし、この箱をtaroboxと名付けよう。
…書くまでもないが妄想は止まらない。

taroさんみたいな人が集まっても面白いなと集団tarobox。
これ、マークとしてカワイイじゃないのってことでボタンバージョン。
taroboxを無機質にレイアウトしても面白いかもしれないとtarotower。
と、まぁ。こんな具合である。
昼休みは短いモノでココで終わってしまった。
きっと何の役にも立たないだろうが、自分のネタとして使わしてもらおう。
調子良い事書くとリスペクトの気持ちがあふれたremixである。
tarositeという箱から何が飛び出すか、今後も楽しみにしているナカガワであった。
※デスクに戻ってロゴを確認したら「t」の字がライントレースだったとは…。
僕の記憶もいい加減である。

GREE Night 2.0も近付き、前回、屈辱の1.0から学んだ「なにかにつけ名刺交換」攻撃に対応出来るように、個人でも名刺を作ってみました。
（会社の名刺を出したところでビジネスにつながる訳じゃあるまいし…密かにやりたいってのもあるし…）
ふふふ、これで名刺を武器に話しまくれるぞw
立ち上がれ企業戦士！！　←個人だっつーのw

で、作る時の話し。
実際に自分の個人名刺を作るのってはじめてなんですよね。
ホントに名乗る程のものじゃないし…。（汗）
で、最初はどんなデザインにしよー！！とかワクワクしていたのですが、何パターンか作った末に、100人中98人が予想できたであろうデザインに収まりました。
まぁ…オレですからこんなもんでしょ。
ええ、ひねりは全くないですよ。でもね、なんと言っても分かりやすいし、遠くから見てもきっとウチのサイトだって分かるじゃないですか（笑）　最初にサイトをデザインした通りのものが形になりましたよーって感じです。
で、一番重要なのが内容。
最初はね、ホントに詰め込み過ぎたの。
銀行のカード番号を除くオレの個人情報みたいなものを。
だって、リアルで会ってるし、しかも限られた人だから良いかなーって。　…でも、いざレイアウトしたら「なんじゃこりゃー」な状態。
（いや、字だらけも情報が溢れている時代を表現できそうである意味面白そう）
シンプルな基本デザインが台無しだったので、情報を削除。
前回、taroさんに貰った名刺を見てみる。
なるほど、情報は極力少なめ。
url先を見ればだいたい分かる的な雰囲気が出ている。
この手で行こうと情報を少なくしたものの…あまり少な過ぎると模様になっている「Gr」が浮き出てしまう…。
微妙なバランスで、一番上の画像のようになりました。
てってけてーっと、休み時間に印刷完了。
手に取ってみてニンマリです。
他のカラーバリエーションも欲しいなぁ。
あはは、楽しい楽しい♪
実際、会う方。
今後お渡しする事となると思うので、よろしくです。