1年以上にわたって使用するならパッケージを購入した方が安くなるかもしれませんが、数ヶ月単位で使う使わないがあるなら断然お得な感じです。
全ての製品が対象というわけではなく、Creative Suiteを構成する主要製品が対象となっています…Fireworks…
機能強化としてはWeb標準やデファクトスタンダード（JQuery等）対応強化という感じです。
そして何よりモバイル対応に力を入れているのが感じられます。
目立ったところでは3Dサポートなど。
また、これまでの18ヶ月間隔のメジャーバージョンアップから今後は24ヶ月周期に変更というのもポイントかもしれません。
何はなくとも参入の敷居がすごい下がったのはうれしい限りです。
Dreamweaverが年契約なら月2000円というのはなかなか魅力的かも。もちろん期限内アップデートは無料です;p
via: アドビ、「CS 5.5」の国内価格を発表--サブスクリプション版も提供 - CNET Japan
すごいって。
これまではテンプレートの編集が非常に難しく、テンプレートといっても全部を置き換えるような感じでしたが、いつのまにかこんなに素晴らし機能がデビューしていました。
20種類くらいのベーステンプレートを選択して、それらの配色や背景などを好みに合わせて編集することが可能です。
これまでFirefoxのFirebugでプレビューしながら編集していたあの生活から解放されるんです!
しかも、テンプレートに使用しているCSSや画像などはすべてGoogleホストなので、自分ドメインで管理するより表示も高速になることが期待できます。
背景画像の種類も豊富ですし、半透明な画像はbackgroundの色に合わせてきちんと変わってくれます。
この辺は最近リニューアルされたGoogle検索のトップページと同じ感覚でしょうか。
もちろん各種要素を細かく配色などを指定することも可能です。
ここまで出来る事に驚きを隠せない状態です。
そろそろこのBlogのテーマも1年ちょっと使ってきましたが、1年ちょっと手を加えていないのでいい加減に不具合が目立つようになってきました。
リニューアルの良い機会なので、次はBloggerのテンプレートデザイナーを使ってリニューアルをしてみたいと思います。
こうご期待;-p
日経デザインをパラパラめくっていたら、なにやら革命的な衝撃をうけてしまった。
それがこれ。
Sony Bravia NX800系
国内では6月発売という事でまだレビューなどは全然ありませんが、このスタンドとフルフラットの液晶部分のデザインは、テレビの再発明といっても良いくらいだとおもいます。買いませんが。
ちなみにこのデザインに関してSonyさんはモノリシックデザインと呼んでる見たいです。
Sony Japan | Sony Design｜Activity｜Feature Design
中国のCMですが、これも美しい。
これこそシンプルの極みかと。
意外と目に優しい配色じゃないかなぁ～と自分では思っていたりもするので、一覧でまとめてみます。
逆に少しコントラストが薄くて見えにくい部分があるかもしれません。
これくらいですね。
16進コードばかりを並べられてもよく分かりませんが、モノクロほど明確なコントラストは作っていません。
やっぱり、ちょっと薄すぎるかな…
…!?
そうです。「Flex」じゃねーの? いいえ。Flash Builderに改名されたようです。
Adobe Labs - Adobe Flash Builder 4
どうやらもともとはFlex フレームワーク上でどうこうしていくものでしたが、ActionScriptで開発していくデベロッパーが増えてきたので、デベロッパーが扱うFlashツールということで改名されるそうです。
Flex SDKはそのまま残るらしい。
あと同時にデザイナー（Adobe CS製品群）とデベロッパー（Flash Builder）を繋ぐツール Adobe Flash Catalyst のβ公開されました。
ここまで来たら、Creative Suite 5位からはRIAセットを新設してもらいたいくらいの勢い;p
on the fly @ minimum interface from Hisato Ogata on Vimeo.
素晴らしいとしか言いようがない。
見て頂ければお気づきになると思いますが、紙に空いている穴をふさぐことでインタフェースを実現しています。
これは逆転の発想というか、衝撃的でした。
すでに展示自体は終了していますが、公式サイトminimum interfaceでFlashを体験できます。
on the fly @ minimum interface at AS3S.ORG
リアルタイムかつ、これだけの情報量…とくに映像の中にもあるように子供が使ったときなどものすごいことになるのではと。それを意識させないから美しいわけで。
後はいかにそれを安価に実現するかですね!
Struktable Multitouch Installation from Gregor Hofbauer on Vimeo.
これ欲しいなぁ～
と言うよりも、結構近いうちにタッチスクリーンを導入する必要があるかもしれないので参考にしたいなぁ～
ここに書かれているように、プロジェクターで下から映しているようです。
毎日常駐させるものには向いてないですが、イベントでこのテーブルがあれば注目の的ですね;p
こういったシステムを5万円以下で実現できないかなぁ～
Flickermood 2.0 from Sebastian Lange on Vimeo.
制作環境はAE/FCSだそうです。
一切意味のないアルファベットだけならFlashでも…難しいですね。
このクリエイター（Sebastian Lange）はIBMのアニメーションなども手がけています。
'Stop Talking, Start Doing' Animation for IBM from Sebastian Lange on Vimeo.
氏の作品はタイポグラフィーがすばらしく印象的。
それでいて非常にシンプル。
こういった感じのの演出を無限に作り出すだけのプログラムとかおもしろそう:p
via 4: flickrmood
以前紹介したクラウド化する世界とかクラウドの衝撃とか読んでいると、最初の部分も分かりやすいです。詳しい流れはこれを読んでいただくとして インターネットの歴史を8分のアニメーションで見る（動画） : Gizmodo Japan
インターネットという構想がどのように登場し、どのように広がったのかを分かりやすく解説しています。むしろこれの日本語版を授業で見せれば高校の情報授業7分で終わっちゃうかも:-)
PICOL Blog
作者のBlogですが、すばらしくセンスがいい!
CC3.0でモノクロアイコンセットを公開しています。
病的なほどシンプルなデザイン。
池田学 展にて on Flickr - Photo Sharing!
何かの雑誌に特集されていて、イラストを見た瞬間恐ろしくびっくりした。
この衝撃は会田誠氏の作品に出会った時ぐらいだ!!
この写真は「予兆」という作品で、この男性は作者の池田学氏。
アクリル顔料インク、丸ペン、フランス製美術用紙「アルシュ」を使い作品を描く。 1日8時間描いても、10センチ四方しか描けない。
池田学 (イラストレーター) – Wikipedia
いや、ホント作品のかなり接写した写真が雑誌にはあったけれど、本当に細かい。自分には到底出来ないようなすごい作業!!
こちらでは若手作家（6）池田学の《第４１次元》イラスト画［訂正1加筆5改題最後の部分に木村恒久を加える］：彦坂尚嘉の〈第41次元〉アート：So-net blog過去の作品が解説されていますが、ただただ圧倒される。
先人のすごい人はそれを彫刻でやっちゃうわけですから…
自分は自分の分野で表現していこうっと:-)
まずはこいつを見てほしい。
武富士はインパクトがあったけど、これは美しさがあると言っても良いのではないでしょうか!
CMの最後に流れるAK BANKというのはトルコの銀行です。
方向性はユニクロ広告に近い感じもします。と言うか銀行のイメージ広告だとしても大成功でしょ!
あまりにもすごくてビックリした。
これが第2弾です。
こちらがメイキングになります。
なんだか自分にもできそうな感じがしますが、メイキングを見ると超大変そう…
最近見たCMだと288,000本のろうそくを用いたストップモーションがすごかったですが、AKBANKのCMは音楽と相まってなかなか気持ちが良い感じです;p
ちなみに某国のマスゲームは規模が違いますので…
こんな感じで10書体。
当然のことながら日本語は使えません。
The Ultimate Free Fonts Pack | yensdesign - Tutorials, Web Design and Coding
いかにもシンプルな書体からちょっと特徴的な書体までそろっています。
タイトル部分やバッジ、Fontの埋め込みでsIFRなどを用いて特徴的な演出にしてみたりなど…
日本語部分はどうしようもないというのが問題ですよね…。
そこをうまく表現しているWebサイトって無いものかなぁ?
なんか英語圏のまとめ記事って、大体こんな感じのタイトルですよね;p
よく、日本のサイトでも海外のデザインサイトがまとめた25個の素晴らしいデザインのサイト! なんて事をパくって書いています。
でも、海外のサイトはフォントの問題とか、比較的日本語圏に比べると扱いやすいです。
…そこで、自分が知りたいのは 「日本語で書かれている素晴らしいBlogのデザイン!」です。
日本でも非常にハイクオリティなWebサイトは沢山あります。
しかし、自分が欲しいのはコンテンツをドンドン更新していく事が出来るBlogのデザインです。
Blogのデザインやインターフェイスの流れなどを勉強させて頂こうと、今回5つの素晴らしいデザインの日本語で更新されているBlogをピックアップしてみました。
かなり自分の好みや理想としているものを選んでいます。
BlogシステムにWordPressを使用。
モノクロの中に立体感があります。掲載している画像のカラーが際立ちます。
BlogシステムにWordPressを使用。
Macのインターフェイスのようなデザイン。Blogの記事1つ1つにも非常に時間をかけていることが分かります。
BlogシステムにMovable Typeを使用。
Web技術に関する記事も書かれています。横幅はこのサイズの方が読みやすいかも。
BlogシステムにWordPressを使用。
ユーザーインターフェースに関する記事を書かれています。非常に自然なグラデーションです。
BlogシステムにMovable Typeを使用。
規格外の横幅1000pxオーバーのデザインです。現在の配色はこのサイトを参考にしています。
今回は5つでしたが、恥ずかしいながら自分が知らない素晴らしい日本語のBlogサイトは沢山あると思います。
皆さんがご存じなサイトを紹介頂ければ嬉しいです。
一言。
圧巻です。
元の動画はHDクオリティで公開されています。
YouTube - Electrabel - Happy New Year (2009)(NL)
電力会社のCMのようですが、圧倒的です。
こちらはメイキングなります。
気の遠くなるような作業…
こちらもHDで公開されています。
YouTube - Making of Electrabel - Happy New Year
電力会社が、ろうそくで光の暖かみを表現するというのもなんだか納得です;p
The Kingdom Series on the Behance Network
あまりにも美しい作品だったので紹介。
全部で3作品公開されています。
Christopher Hewitt氏の作品 だと思う。
氏のサイトはChristopher Hewittになります。
Photographerの様ですが、こんなに素晴らしい画像を!!
このBehance Network :: Galleryはアーティスト向けSNSの様です。
非常にクオリティが高い。
見てると時間が経つのを忘れちゃいます;p
Livres XHTML et CSS on Flickr - Photo Sharing!
今日で3日目です。
デザイン等の一部修正を行いました
デザイン等の一部修正を行いました その2
たぶん今日が今までで一番変化があったと思います。
なんせカラーを小麦色に統一してみました。
是非ともsafariで見て欲しいです。
今回はCSSをかなりいじってみました。
safariで見るとそれぞれの記事の下にドロップシャドウが効いて、良い感じに立体感が…出ていると思いませんか?
これは-webkit-box-shadowを使用しました。
-webkit-box-shadow:0px 0px 3px #1B1310;
これの場合は、横軸に0ピクセル、縦軸に0ピクセル、ぼかし3ピクセル、色#1B1310 という指定になります。
PhotoShopやFireWorksを使った事ある人ならこの指定でも分かると思います。
現在の所サポートされているのがsafariだけとなっています。
（Opera はtext-shadowはサポートしていますが、box-shadowはまだのようです）
しかし、Firefox3.1でサポートが確実となっているので今後一般的になるのではないでしょうか。
使用してもサポートしていないブラウザで問題が発生するわけではないので、safariユーザーを歓迎してみてはいかがでしょうか;p
ちなみにFirefoxの場合は-moz-box-shadowという記法になります。
日付の表示をちょっとリッチにしてみました。
タイトルバーと被るようにしてみました。
やり方は単純でz-indexで日付部分を上にして、タイトルバーのをそのままマイナス・マージンで上に引っ張ってきているだけです。
CSSを見れば一発で分かります。
safariで見た時にリッチになるようにtext-shadowを付けた方が良いかな?
今回一番複雑だった点。
やりたいことは、「特定のリンクされているサイトの画像に対して、背景に背景画像を設定したい」という事なんです。
すでに、画像は<img>で指定していますし、その親にも特殊な設定をしているわけではありません。
これは困りましたが、今の形で落ち着きました。
まずはFlickrにリンクしてる画像を見つける方法ですが、CSSだけでも出来ちゃいました。
img[src*=".static.flickr.com/"]{
hogehoge
}
これで、<img>の中のsrcがFlickrのものをだけにhogehogeを適用することが出来ます。
CSSのセレクタというらしい…
ちなみにこの指定の方法ですが、
これ以外にもありますが、よく使いそうなものを選んでみました。
もちろんこれはimgタグ以外にも用いることが出来ます。
詳しくはCSS セレクタに関するおさらい | WWW WATCHで丁寧に解説されています。
使ってみると特定の要素を狙い撃ち出来るので、非常に便利です!
ただし、現状ではIE7から対応していると言うことですが、根強い人気のIE6はサポートしていません。
IE6では無視されますので、最初にこちらを作ってしまえば問題ないでしょう。
ただ、画像を無理矢理このような表示のさせ方をしていますので、過去記事のいくつかでは不具合が出る場合も考えられます。
見つけたら教えて頂けると嬉しいです;p
随分自分の納得のいくものになってきました。
最終的にはBloggerテンプレートとして配布できたらなぁ とか思っています。
昨日のautopagerize対応したので、この勢いを忘れないうちにもっと改造を!!
今日ポストが少ないのは朝からずっとこれにつきっきりだったからです;p
これまで目立たなかった、タグをページタイトルの真下に持ってきました。
ちなみにこのスタイルはどこかで見たことがある方もいらっしゃるかと思います。
実は…
Deliciousのデザインを参考にしてみました。
同じタグつながりと言うことで;p
Deliciousみたいにキレイに付けることが出来ず、なんとなくという結果になってしまったのが残念です。
もっと計画的にCSSは書くべきですよね。
B! ははてなブックマークへの追加です。
その隣の数字は、もしもブックマークされている場合そのユーザー数が表示されます。
これからも少しづつ手を加えていきたいと思います。
格好いいBlogデザインや、お薦めのBlogパーツなんかを教えて頂ければ嬉しいです;p
何気に増えてきたサイドのTAGリストですが、OperaやSafariで観覧すると交互に色分けして表示されるようにしました。
#tags li:nth-child(4n+1) {
background-color: #EBE5DC;
}
#tags li:nth-child(4n) {
background-color: #EBE5DC;
}
こんなコードです。
ただ、CSSの先行実装を使用しているので、現在利用できるブラウザは限定されます。
:nth-child(4n+1) と書くことで、1,5,9,13…番目を指定します。
:nth-child(4n) と書くことで、4,8,12,16…番目を指定します。
最初は上図のような交互に表現する方法が分からないで悩んでしまいました;p
これまで、マウスオーバーしてもいまいち見分けがつかない面がありましたが、"Back to Home"という文字がマウスオーバー時に表示されるようにしました。
…Blogなのでいまいちトップページに誘導しても仕方ないですが;p
ちなみにこの素敵なFontはaguije Caimanです。
aguije Caiman｜a Free Font from project WANI｜NEWS｜aguije
これを一般に公開して下さる素晴らしさ。
ありがとうございます。
RSS始めました。
昔から配信していましたが、すこし目立つところに置いてみたいと思います。
気が変わらない間は、全文配信を続けたいと思っています。
一番の目玉（笑）はautopagerizeというスクリプトに対応しました。
これまで利用できてたと思うですがデザイン変更の時に無効にしちゃったようで、対応させました。
コメントはページ毎になるので、読み込んだページにはコメント欄がついていません。
それぞれの記事のタイトル部をクリックすればその記事にジャンプしますので、そこで間違いを指摘して下されば嬉しゅうございます;p
autopagerizeが使えなくなると言う衝撃的な事があったせいで、こいつの重要性に気がつきました。
autopagerizeが効かなくなったときの対処
ちっちゃな変化ですが、ファビコンを変えてみました。
これは何って聞かれると困っちゃいます;p
まだまだ荒い部分もありますが、新年に向けて手を加えていきたいと思っております!
これは素晴らしい!!
とは「私は読むのが好き」という事だそうです。
おそらく本に関係しているサイトのプロモーションだと思いますが、これはホントに素晴らしい!
この発音の仕方を聞いているとなんだかニューシネマパラダイスを思い出します;p
ここまで一貫してインターフェイスを変えてこないというのはすごい事ですよね。
アイコンのイメージも昔のものを見てもほとんど分かりそうです。
これが最新のPhotoShop CS4のインターフェイスになります。
なんだかシンプルに回帰しているような感じです。
