僕もちょっと関わらせていただいた、HTML5案件が無事リリースされました。PCブラウザはChromeで動作すればよい、というものでそのあたりはありがたいんですが、当初は「絶対無理だろう!」と思っていました。ほんと、よく出来たな、と。今回でかなり勉強になったと思います。開発チームに参加出来たことに感謝しています。先日の記事にある通り、大阪にありますマイクロソフトさんの会場で、イベントを行ってきました。キレイ、しかもフリードリンク付きなので、来場者の方は好きなだけドリンクを飲めました。●CSS3で作るボタンへのこだわり最近、UX(ユーザエクスペリエンス)という言葉を業界でよく聞くようになりまして、そのセミナーもいくつかあるようです。大事なことであって、僕も意識はしていますが、その反面、UIがダサくなってはいけない。ダサかったらダメです!というわけで、その日に話をしたのは、質感たっぷりのボタンを作るための考え方です。テーマがCSS3ということもあり、スライドに仕込んだのはCGで作られたボタンです。──背景の上に文字があって、その文字の影は何色か?口でいうと簡単なことで誰だって分かる話なんですが、物体に光があたると反対側には影がつく、ということ。私たちが生活している空間に存在する光は思った以上に複雑です。光源から直接当たっている光のせいだけではなく、他の物体に反射した間接的な光が当てられていることがほとんどです。そこまで考えて「奥行き」を表現することで「質感のあるデザイン」が可能な訳です。言われるとそれは違います。ボタンに文字をのせます。角丸のボックスの中に文字があり、その文字には影がついている、としましょう。実際は、そのボックスの背景色となる色に影がのせられた色、となるので、もし黄色のボタンだったら、黄色が濃くなるはずです。純粋な「黒」を影の色にするのは「現実的におかしい」ということになります。簡単そうで実は奥が深くて、軽視されがちな質感を見ていきましょう。観察からしましょう、こんなCGをつくってみました。>ボタンを斜め上から観察している様子をリアルに表現しています。・ボックスの上が白く光っている・ボックスの下は影がついている・文字の上には影がついている・文字の下は白く光っているというあらましを知ることができます。したらこれをCSSで表現します。rgba(0,0,0,0.7)ピンと来ない方はこの画像をご覧下さい。>CGのボタンと、CSSを使ったボタンを並べて比べましょう。CSS3まで使うとここまで表現できます。リアルで現実と近いですね。「こんなリアルに作る必要があるのか?」という問いに対しては、決してそうじゃない、って私も思います。影の表現で奥行きが理解できない、前後の距離感が分かりにくいUIが、ユーザの操作に対してどう影響を与えるのか?考えたら、このような考えは決して無駄じゃないってことです。>考えてみてくださいね。>テクニカルディレクター・デザイナー。交通広告を多数手がける。同時に音楽活動も活発に行い、西日本半全国ツアーなどを展開、某専門学校のテーマソングを作詞作曲、編曲から楽器全てを演奏してレコーディングするなど、マルチなクリエイティブ活動も。最近では東京と大阪の教育施設などで講師業をも務める。GraphicDesign...多種スキルを持つ。複数の名簿から同じ人物の名前がいるかどうかを調べるスクリプトです。Photoshop、Illustrator、Bridge、InDesign、ESTKで動作します。調べる対象となる名簿データは、以下のように一行に名前だけが入力されているシンプルなものです。このような名簿が複数あり、その中から、それぞれの人物が何度出て来るかをカウントするのが、以下のスクリプトです。allList){savefile.writeln(allList[i]+","+i);}savefile.close();})();スクリプトを実行すると、最初に結果を保存するファイル名を尋ねてきます。その後、名簿ファイルを選択するためのダイアログが表示されます。キャンセルボタンをクリックすると、結果が保存されます。結果を保存したファイル内容は、以下のように先頭に名簿に登場した合計回数とカンマの後に名前がついたものになります。名簿に限らず、重複データがどの程度あるのか調べる用途にも利用できます。>今回のテーマは、時事ネタとはあまり関係ありません。あと、忙しくて本が積ん読状態......。連載をお休みして、この話題で書きたいと思います。Beta2が先日発表されました。「マイナーバージョンアップでしょ?」と侮ってはいけません。「痒いところに手が届く」ような、新機能が盛りだくさん!なのです。>▼カテゴリ・フォルダの並べ替えやはり、今回の目玉機能はコレ。待望のカテゴリ・フォルダの並べ替えが標準搭載されました。>に「sort_by="user_custom"」モディファイアが使えるようになりました。>※左側の三本線アイコンをドラッグすると、順序入れ換えや階層移動が出来ます。右側に属する記事数が表示され、クリックすると記事一覧が表示されるのも嬉しい機能追加です。>※ナビゲーションなどでよく使われるカテゴリ一覧を表示するコード。>で並べ替えを反映し表示されます。|〈余談〉|並べ替えで、藤本さんのプラグインにお世話になっている方も多いと思い|ます。今回並べ替えが標準搭載になりましたが、藤本さんのプラグインは|ブログ記事・ウェブページの並べ替えも出来てさらに便利。用途に合わせ|て標準機能と使い分けることになるかもしれませんね。path」というオプションが追加されていました。チェックするとブログパスを全変更できるようです。これで、ウェブサイトディレクトリ内にブログディレクトがなくてもOKという選択肢が増えましたね。>▼管理画面UIの細かな調整ブログ記事の管理機能が使いやすく微調整されています。全体的にUIが小気味いい動きになって洗練された気がします。更新状態で「公開/未公開」を選ぶように戻りました。※MT4時代に戻りました。MT5になって変わってしまい、操作がわかりにくくなっていました。実行ボタンが状況に応じて適切なものに変化します。未公開時は、[保存]ボタンに変わります。>・ブログ記事の入力項目の順序の入れ換え本文以下の入力項目(タグ・キーワード・概要やカスタムフィールド)の順序が入れ換えられるようになりました。・再構築画面ボタンの配置が[再構築]/[キャンセル]の順序になりました。※今まで逆でよく間違えてました。>・ウィジェットセット編集画面バーの配置が[利用可能]/[インストール済み]の順序になりました。>・ブログ記事の管理ブログ記事一覧の表示オプションで、不必要な項目を非表示にしたり、[概要]など今までになかった項目を表示できます。フィルタ項目が増えて複数条件でフィルタリングできます。記事が探しやすくなりました。>▼バグとフィードバックとはいえ、まだまだベータ段階の時期MT5.1。バグもたくさんあるようです。広くユーザーからのフィードバックを受けてます。バグ報告だけではなく、機能要望もできるのがいいですね。MTが時期バージョンで、あなた好みのステキな変貌を遂げるかもしれません。5ユーザーコミュニ|ティ。フィードバックだけではなく、MTについての意見交換が活発でとて|も参考になります。「敷居が高くて......」という方も、見ているだけでも|勉強になりますよ。......ということで、報告終わりです。MTが好きだなぁと再確認しました。次回こそ、HTML5の文書構造系の新要素などを紹介します。※記事へのご意見・ご要望は下記より受付ま〜す。>近況報告:ようやく、今年度のセミナーラッシュが一段落しました。iMedioさんで新講座を一つ残すのみです。面白いことしたいなぁ......。(3/7)・「正論」4月号の特集「これが日本再生の救国内閣だ!」が興味深い。保守論客50人が「日本を救うために最強の内閣を考えてほしい」という緊急アンケートに応えている。保守派による組閣だから、革新派にとっては苦々しい内容であろう。いう、考えられる最悪のメンバー。これは逆説で(古いテクニックだ)、「一番悪いのは民主党の詐欺に騙された愚民。この内閣で一度地獄を見て、悔い改めない限り日本の再生はない」とする。そんな...、いまでも充分、国民は地獄を見ておりますが...。危機管理のプロ・佐々淳行氏は「内閣改造でも何も変わらない。してポスト菅政権を組閣した。...もう勘弁して下さい、民主党は。あらら、前原「首相」が〜。(柴田)・マイコミジャーナルの記事「Microsoft、IE6シェア1%未満に向けてカウントダウン・サイト開設」を読んだ。日本でのIE6のシェアは10.3%なんだそうだ。10年前のブラウザをまだそれだけの人たちが使っているとは。パソコンも10年以上前のを使われている人、いるのかもしれないなぁ。会社で10年前のパソコンを使うというのはどうなんだろう。処理速度はいま何倍になっていることか。XPで使っていたソフトウェアは、たいてい7でも大丈夫よ。リースしているなら7のパソコンにすればいいだけなんじゃ......。通常サポートは昨年7月に打ち切られてるよ〜(延長サポートは2014年4月8日まで)。コスト高ってことなのかな。それもこれも不景気のせいか。会社のシステムがIE6対応という人はともかく(いや、ともかくじゃないよ〜。セキュリティに問題があるらしいから早くバージョンアップ対応しようよ〜)、個人でも7や8は重いから嫌という人もいるらしい。9は早いし、いろいろと便利なんだって。XPでも9を使えるようにしてくれたらいいのになぁ。