Expression Web 4とDesign 4はフリーソフトになります

今日がマヤ暦の最後の日で世界滅亡の日みたいですが、Expression Studioはなくなる方向になるようです。まるでその日に合わせたかのように。

Expression Web 4とExpression Design 4はフリーソフトになりました。Expression Encoder 4はフリー版とプロ版があり、Expression BlendはVisual Studioと結婚したようです。

これらの日本語の無料版は以下からダウンロード可能です。

• Expression Web 4無料版
• Expression Design 4無料版

無料版は、プロダクトキーが抜かれたバージョンです。リテール版でのExpression Web 4の最新がService Pack 2ですが、無料版はSP2aとなります。Expression Web 4 SP2aでは、ダイナミックWebテンプレートが適用されたWebページにおいて、編集可能な領域が正しく認識されるよう修正されたっぽいです。

フリーソフトになると、マイクロソフトからのサポートは受けられません。ただし、お金を出して買った人には、マイクロソフトからメインストリームサポート（無償インシデントサポート）を受けることができます。今のところ、Expression Web 2までマイクロソフトに質問できるようです。

製品名	ライフサイクル 開始日	メインストリーム サポート終了日	延長サポート 終了日	サービスパック 終了日
Expression Web 4	2010/08/26	2015/09/08	2020/09/08
Expression Web 3	2009/10/19	2015/01/13	2020/01/13
Expression Web 2	2008/07/24	2013/10/08	2018/10/09
Expression Web	2007/02/06	2012/04/10	2017/04/11	2009/01/13
Expression Design 3	2009/11/19	2015/01/13	2020/01/13
Expression Design 2	2008/07/24	2013/10/08	2018/10/09
Expression Design	2007/07/27	2012/10/09	2017/10/10
Expression Blend 3	2009/10/19	2015/01/13	2020/01/14
Expression Blend 2	2008/07/24	2013/10/08	2018/10/09
Expression Blend	2007/07/13	2012/10/09	2017/10/10
Expression Studio 4	2010/08/26	2015/09/08	2020/09/08
Expression Studio 3	2009/10/19	2015/01/13	2020/01/13
Expression Studio 2	2008/07/24	2013/10/08	2018/10/09
Expression Studio	2007/07/27	2012/10/09	2017/10/10
Expression Media 2	2008/07/24	2013/10/08	2018/10/09
Expression Media	2007/07/27	2012/10/09	2017/10/10

では、無料版のExpression Web 4はどこでサポート受けられるかというと、コミュニティサイトのみとなります。本家は英語サイトですが、英語が苦手な方たちのためにこちらでできる限り対応させていただきます。

http://www.wanichan.com/web/forum/

 

続きを読む

Expressionの今後についての勝手な予想

開発者の方はすでにご存じかと思いますが、Expression Blendは今後Visual Studioにバンドルされることになるようです。つまり、Visual Studioユーザーが、Expression Blendを手に入れるために、わざわざExpression Studioを購入する必要はないということになります。

では、Expression WebとかDesignとかはどうなるのでしょうか？

私は残ると思います。Expression Web 4にはまだまだバグとかありますけど、静的HTMLで構成されたWebサイトとかでは欠かせないものとなります。実際に私の wanichan.com とかのWebサイトは、CMSとかではなく、普通にExpression Webでパブリッシュして更新作業を行っています。というよりも、逆にCMSにした場合のリスクを考えるとちょっと恐ろしいことになりますから。

先日、ファーストサーバーでデータが消えてしまい、プランによってはユーザー側で手動バックアップ機能がなく、そのバックアップごとすべて消えてしまって泣き寝入りな企業が少なくないとのこと。大阪でのWebサイトでは、海遊館のサイトも被害を受けていましたね。今は徐々に復旧していっているそうですが、PHPベースで構築されたWebサイトになっています。

実は、私のWebサイトもCMSに移行を考えたこともありましたが、手間などを考えると見送りになっています（面倒、ともいう(笑)）。というよりも、FTPでパブリッシュしたほうがいいですね。バックアップデータが確実に自分のPCにあるわけですから、万一、Webサイトのデータがすべて消えてしまったとしても、もう一度すべてパブリッシュさえすれば、数十分で復旧可能です。まあ、今回の件で、CGIファイルのデータなどは、こまめにバックアップとっておこうと思うようになりました。

やはり、バックアップは各自責任もってとっておくべきですね。

そんなわけで、静的HTMLは不滅＝Expression Webはなくならない、と私は思います。

一方、Expression Design ですが、Webサイトを構築しているデザイナーとかWebマスターが使うのには手ごろなものになるでしょう。Expression Studio Web Professional というパッケージ構成は、WebとDesignとEncoderの3つですからね。Webサイトに動画を挿入するための素材作りにEncoderも便利ですし、スクリーンキャプチャーもとれるから、ソフトの使い方なチュートリアルサイトでも重宝するでしょう。

今後、Expression WebとEncoderとの連携とか、Designとの連携ができるようになればいいなと期待しています。

複数バージョン混在環境でExpression Design 3で開く問題について〜続編

当初は、拡張子 .design ファイルをダブルクリックすると、本来Expression Design 4で開くのに、なぜかExpression Design 3で開いてしまうので、修復インストールを試みたところ、修復に失敗してしまう現象について、いろいろと聞いてみたんですが。。。

Expression Design 3が既定のプログラムに設定された原因？

いつしか、Expression において、Service Pack だけアンインストールできなくなったので、仕方なしにExpression Studio 4 Ultimateをアンインストールした経緯がありました。その際に、Expression Designについても、Expression Design 3にひも付されたのではないかと推測しています。

Service Packだけアンインストールできなくなった理由

どうやら、Service Packだけアンインストールすると、Expression Blendがうまく動かなくなるという問題が発生したため、Expression 4バージョンからサービスパックだけをアンインストールすることができなくなりました。そのため、下の図のように Service Pack を選択しても、Windows 7の場合、［整理］の右側に［アンインストール］が表示されなくなりました。

Expressionの修復ができない原因

Service Packが適用されたExpressionを、古いバージョン（RTM）で修復ができない、というオチになっています。

つまり、修復するには、現時点では、Expression 自体を一旦アンインストールして、再インストールしなおすしか今のところ選択肢はありません。

続きを読む

複数バージョン混在環境でExpression Design 3が起動する？

私のPC環境は、一応Expression Studio 3と4、そして、Expression Web 2も入れています。とりわけ、Expression Designについては、Expression Design 3と4がインストールされています。

Expression Design 4で作成した、拡張子 .design ファイルをダブルクリックすると、なぜかExpression Design 3で開いてしまうのです。

下の図のスクリーンショットのアイコンをみると、明らかにDesign 3ですよね？ Version 4であれば、アイコンの右下に4が出るはずです。

1. そんなわけで、Windowsの関連付けを行おうと、右クリックして［プロパティ］をクリック
   
2. ［ファイルを開くプログラムの選択］ダイアログボックスの［参照］ボタンをクリック
   
3. プロパティダイアログボックスの［変更］ボタンをクリック
   
4. ［プログラムから開く］ダイアログボックスで［Design 4］フォルダーの［Design.exe］を選択して［開く］ボタンをクリック
   
5. すると、Design 3のままで反映されないわけです。

私のほかに同じ現象が起きている方はいらっしゃいませんか？

Expression Studio 4の修復ができない？

Expression DesignのファイルをダブルクリックしたらなぜかExpression Design 3になっているので、修復インストールしようと思って、ISOイメージから仮想ダィスクにマウントして。。。

メンテナンス画面から「修復」を選択

すると、「インストールの失敗」とでて、「値を Null にすることはできません。」と・・・orz

どうやら、fwlinkに問題があるらしいとのこと。fwlinkのリンク切れらしいです。

こればかりはどうしようもないので、リンク切れを修正してもらうときまで待つしかない、ということですね。

Expressionのバージョン5のリリースはいつ？

Expression Web 4 はSP2まで出てますが、Version 5はいつ出るのか？ 今年中に出ないのか？ という声を聞きましたが、私の認識している限りでは、年内に新しいバージョン出ることはない、です。

しばらくサービスパックで対応するんじゃないかという憶測を持っていたり（笑）

最初の3〜4バージョンまでは1年に1回のペースでバージョンアップしていくが、そのあとは次のバージョンまでのリリースは少なくとも2年間隔になるとかならないとか聞いたことがあります。

しかしながら、どうも、マイクロソフト側はExpression Webはそっちのけで、Expression BlendでWindows Phoneアプリ開発に終始している気がしています。開発者万歳って感じですしね。

一方、Expression Webの最新バージョンの書籍はでないのか、みたいな声がちらほら聞こえて来たり。しかし、Expression自体売れてないから書籍が出せないという感じです。とにかく情報を増やそうとは私個人的にも考えていたりしますが、費用対効果で考えると、パイがでかいMicrosoft Office関連の記事をwanichan.com サイトにアウトプットしたほうがいいという流れになったり。あ、もちろんExpression Web 4使ってサイトの更新作業していますよ。

Expression Blendの本は出ないのか？という期待を持っている人もいると思いますが、そのうちに出ると思います。その「そのうち」がいつ出るのかわかりませんが（逃

とにかく、自分が今できることをやっていくしかないですね。他力本願にならず、できることをやるしかないです。

そのうちにExpression WebのPDF版なオリジナル本を作ろうかと思っています。「そのうち」がいつになるかはわかりませんが、そのうちに作るつもりです。

Expression Blend 5 ではHTMLとCSSも利用可能に？

日本時間真夜中に開催された Build Keynoteにおいて、Expression Blend 5ではHTMLとCSSが使えるようになったという内容があったかもしれません。そしたらExpresssion Webはどうなるの？と思う人が少なくないですよね。

私が思うに、Expression WebとExpression Blendはそもそも目的が異なります。同じコードが使われていようが、それは問題ではないと思います。したがって、Expression Webがなくなるということはありえないでしょう。

すごく強引なたとえが許されるのであれば、WordとPowerPointとの違いという感じですね。WordもPowerPointも段落とかあるし、年賀状の裏面だってぱわぽで作っちゃうぞみたいなノリだったりします。スタイルだってWordもPowerPointも存在します。しかし、そもそも何をするためのソフトであるか全然違いますよね？

Expression Webにできて、Expression Blendにできないことありますし、その逆もあります。

同じコードが使われているからといって、方眼紙Excelでドキュメント作成といった使い方をExpressionでもしてほしくないですね。

.htaccess で SilverlightやExpression WebアドインのMINEタイプを登録するには

新しいタイプの拡張子ファイルは、既存のサーバーには対応していなかったりしますよね。

共用サーバー等の理由で、サーバーで設定ができない場合は、.htaccess ファイルを利用してMINEタイプを登録するとOKです。

まず、Expression Web 4 のアドインの拡張子は .xadd ですね？

Addtype XWeb.xweb4xadd.4.0 .xadd

あと、Silverlight をWebサーバーで公開する場合、

AddType application/x-silverlight-app .xap
AddType application/xaml+xml .xaml

ついでに、Expression Design のファイルは。。。

AddType Expression.Design.Design .design

既出かもしれませんが、ひとまずメモとして投稿しておきます。

Expression Design January 2011 Preview

Expression Design January 2011 Previewがダウンロードできるようになったようです。

ダウンロードはこちらから
http://www.microsoft.com/downloads/en/details.aspx?FamilyID=f36353c5-f3a1-4547-8b99-d55a456d857b&utm_source=feedburner&utm_medium=feed&utm_campaign=Feed:+MicrosoftDownloadCenter+(Microsoft+Download+Center)&utm_content=Twitter#tm

英語版のみの提供ですが、2つ機能追加されたようです。

EPS ファイルのインポート

Expression Design Previewでは、EPS ファイルのインポートがサポートされています。これを行うには、［File］メニューの［Import Encapsulated Postscript File］をクリックします。

レイヤーパネルで複数選択が可能

Expression Design Previewは、非隣接のレイヤーを選択するためにはShiftキーを押しながらクリック、もしくはCtrlキーを押しながらクリックで様々なレイヤーパネルの様々なレイヤー、グループ、およびオブジェクトを選択できます。複数選択機能は、Windows Explorerでの機能と同様に機能します。

Expression Designに興味のある方、愛用している方はダウンロードして触ってみてください！

Expression Designで雲を描いてみよう

Expression Blend MVP の Elenaさんのブログに魅力的な記事を見つけたので、ちょっとやってみようと思います。
Helen > Drawing the cloud button

雲を形成する

1. ［ファイル］メニューの［新規作成］をクリックします。
2. ［新規ドキュメント］ダイアログボックスで［OK］ボタンをクリックします。
3. ツールボックスから楕円を選択します。
   四角形ボタンしかない場合は、その［四角形］ボタンを右クリックして、［楕円］をクリックします。
   
4. ドキュメントの中央に楕円を描きます。
5. 楕円を選択して、50ピクセルの正方形に整えます。もし縦横比のリンクを解除していない場合はをクリックして下の図のように 解除し、縦と横のサイズをそれぞれ50pxに設定します。
6. 続いて、座標を指定します。Xボックスに 300px、Yボックスに200pxと入力します。
   
7.   ［プロパティ］パネルにおいて、色コード #0096FF 指定します。
8. 下の図のように、ストロークなしにします。
    
9. 作成したオブジェクトをいくつか複製します。［編集］メニューの［コピー］をクリックして、［編集］メニューの［貼り付け］をクリックすることで、元のオブジェクトの前面に貼り付けられます。いくつかの丸を組み合わせてください。
   
10. 次に、これらのオブジェクトをすべて選択し、ステータスバーの右端にある［パス］のボックスの▼をクリックして［合算］を選択します。
    

グラデーション効果を付ける

1. ［プロパティ］パネルの［外観］カテゴリにて、ボタンをクリックしてグラデーションにします。
2. グラデーション境界の開始バーを選択して、スポイトアイコンの右側の色コードを黒の#000000から#00B6FF に変更します。
   
3. 続いて、最後の白（#FFFFFF）に設定されたグラデーション境界の色を#B6EAFFに設定します。 
   

グラデーションの方向を変える

1. ツールボックスから［グラデーションの変換］ボタンをクリックします。
   
2. 縦方向に上から下までドラッグします。
   
3. Ctrl+Cキーでコピーをします。Ctrl+Fキーでオブジェクトをコピーをするために検索します。
4. ステータスバーの左端の［変換オプション］をクリックして、［パーセンテージで拡大縮小］をクリックします。
   
5. 幅と高さを90%にセットすることで、より小さくなります。
   
6. ［プロパティ］パネルのグラデーション境界の左端のバーをクリックします。
7. Altキーを押しながらパレット色一覧から白色をクリックします。
   
8. 右端のグラデーションの境界バーをクリックして、［アルファの停止］ボックスに「5%」と入力します。
   

影をつける

1. ツールボックスから［楕円］を選択し、ドキュメントの中央に描きます。
2. ステータスバーの［変換オプション］にて［パーセンテージで拡大縮小］のチェックをはずします。
3. 幅150、高さ130ピクセル、X座標は355、Y座標は265と指定します。
   
4. Shiftキーを押しながら両方のオブジェクトを選択し、［パス］ボックスの▼をクリックして［背面マイナス前面］を選択します。
   
   すると、以下の図のようになるはずです。
   
5. 次に、グラデーションの方向を変更します。ツールボックスから［グラデーションの変換］ボタンをクリックして、上から下にドラッグします。
   
6. 背面の雲を選択してCtrl+Cでコピーし、そのあとCtrl+Fキーを押して選択します。
7. ステータスバーの［変換オプション］にて［パーセンテージで拡大縮小］のチェックを付けます。
8. 幅80％、高さ10％、Y座標を270にします。
   
9. 色を#2B5574にして、［ストロークの不透明度］では30%にします。
   
10. すべて選択します。
11. ［整列］メニューの［グループ化］もしくはCtrlキーを押しながらGキーでグループ化します。
12. ［レイヤー］パネルの［レイヤー1］を展開すると、［グループ化］が表示されます。ここでダブルクリックして名前を変更することも可能です。
    
     

Expression Designで作った Silverlight 2 コントロール

Expression Blend MVP のElena さんがExpression DesignでSilverlight 2 コントロールを作ったそうです。

 

こちらは、Microsoft Expression公式WebサイトのGallaryサイトでダウンロードできます。
http://gallery.expression.microsoft.com/en-us/SweetAndJuicy

Helen's blog at http://dev.net.ua/blogs/Helen/
彼女の個人Webサイトは http://helen.org.ua/

Expression DesignでVista "Chrome" スタイルボタンを作るには

from Expression Blend and Design > Creating your Own Vista "Chrome" Style Button
by Sam Paye on Sun, Feb 17 2008 5:21 PM / Translated and Edited by Yoshie Kohama

このブログ投稿では、私は、Expression Designを使って編集や使いこなしやすくするためのあなた自身の"chrome"風のボタンテンプレートを作成する方法を紹介します。この投稿では、Expression Designを今まで使ったことのない超初心者をターゲットとしています。この投稿でもってそれに親しんでいただけることでしょう。最終的に以下のようなボタン作成練習を行います。

それでは始めましょう！

横150ピクセル、高さ50ピクセルに設定された長方形の基板を作成しましょう。

大きさを調整するために、代わりに下の操作バーの幅と高さの調整をすることで、より正確に設定できます。
ヒント：これらの 2 つのフィールドの間にある アイコンをクリックすると、縦横比固定リンクのオンとオフを切り替えることができます。

最後のボタンは角が丸まっています。つまり、四角形の角に丸みももたせる必要があります。四角形を選択し、［プロパティ］パネルにある［四角形の編集］カテゴリの［角の半径］ボックスに 10 px と入力します。

この変更を加えることによって、以下のように四角形に丸みが追加されます。

さあ、このボタンにグラデーション効果を追加しましょう。これを簡単に行うには、［外観］カテゴリのシルバーのグレースケールの［グラデーションの色］ボタンをクリックします。

グラデーションを適用すると、以下のようになります。

枠線をなしにするとより見栄えが良くなりますよね。まず、［外観］カテゴリの［塗りつぶし：グラデーションの色］ボタンの右側にある［ストローク］ボタンをクリックしてストロークの色選択モードに切り替えて、［なし］ボタンをクリックすることによって、ストローク（枠線）を削除します。

ストロークをなしにした状態では以下のようになりますが、塗りつぶしのこのグラデーションは左から右になっていますよね。

これを上から下に方向を変更するには、グラデーションの回転角度のツールを使用します。、［外観］カテゴリの右下の小さな［オブジェクト塗りつぶしの移動、拡大縮小、回転、または傾斜］ボタンをクリックして、次に示すように ［回転の角度］ボックスにて270 度または-90 度に回転角度を変更します。

グラデーションの方向を回転させることによって、以下の図のように表示されます。

滑らかなグラデーションをしたところで、次のステップに移動する準備ができました。輝きです！またはより明るいレイヤーとも呼ばれるかもしれません。それとも私がそれを「Bing」と呼びたいです。

もう一つのコピーを上部に配置するには、作成したボタンをクリップボードにコピーして、［編集］メニューの［貼り付け］機能を利用します。その後、いくつか調整する必要があります。

新しいボタンを選択して、以下の手順に従って微調整を行います。

1. 操作バーに戻って、新しいオブジェクトの幅と高さを変更します（146x25）。二つ目のボタンオブジェクトはオリジナルボタンの前面に配置されます。そして上の辺に沿ってそのオブジェクトを配置します。
2. そして、新しいシェイプの角の半径を8pxに変更することによって、より小さな丸みができます。
3. 基のオブジェクトを4ピクセル分上方向に移動します。ズーム機能を利用して表示を拡大することによって調整しやすくなります。
4. グラデーションの角度を90度に変更します。それはあらかじめ基のオブジェクトからコピーと貼り付けを行ったものが-90度に設定されている必要があります。
5. プロパティパネルに戻ります。グラデーション境界色を黒から白に変更することによって、グラデーションの開始と終了の両方が白に置き換わります。（カラーパレットの白を選択するには、Altキーを押しながら白色をクリックします）。

この時点では、なんだか全然違うように見えます。

同じグラデーション境界にて、［アルファの停止］を0%に変更します。

これで、ボタンがこのように完成しました！

ここに仕掛けがあります。.  下のオブジェクトをクリックし、その黒の境界色をあなたの好きな色に変更してみてください。カラーの配色が変えた色に変化します。また、二つ以上のグラデーション境界色を利用することも可能です。

ヒント：クリックすることでグラデーション境界に中間色を追加できます。

ここにいくつかのExpression DesignのChromeスタイルボタンのアセットがあります: Download Chrome Style Button Design File

楽しんでください！

Sam Paye

Expression Designで解像度を96 PPIにするためのコツ

from Expression Blend and Design > Trick or Treat : Resolution = 96 PPI 
by Joanna Mason on 31 Oct 2007 5:19 PM /Translated and Edited by Yoshie Kohama

今までに画像やIllustratorファイルをExpression DesignやExpression Blendにインポートして、元の画像より少し大きいまたは小さいと気付いたことはありませんか？ この投稿ではなぜこのような現象が起きているのか、そして、期待通りにExpression DesignやBlendに画像やそのほかのアセットをインポートするためのいくつかのポイントやTipsを説明します。

Expression Blendの解像度は 1インチ当たり96ピクセルを想定しています。WPF、Expression BlendおよびSilverlightのすべては、1ピクセルあたり1/96インチ、解像度 96 PPIを想定しています。あなたはおそらくなぜ 96 PPI？と自分に問いかけるでしょう。私は自分のWebの仕事には72PPIを使ってました。その短い答えは、Microsoftが96 PPIを標準的に使っているということです。Appleの標準がなぜ72 PPIとして決定されたのか表現された多くのWebサイトが存在します。私は読者がお気に入りの検索エンジンで 96 PPI を検索するためのチョイスについてもっと学ぶことを勧めます。

96 PPI 以外の解像度を指定して保存されたリソースで作業している場合は、DesignとBlendを同じ物理サイズで 96 PPI にリソースをスケーリングします。たとえば、480 ピクセル、高さの 640 で 72 PPI は 6.667 インチ、幅、高さ 8.889 インチのイメージの幅です。96 PPI の解像度で、同じ画像を表示したい場合は、幅と高さの 640 と 853 ピクセルでそれぞれがある必要があります。そのため、デザインまたは 72 PPI で作成されたブレンドに 480 x 640 イメージをインポートする場合は、インポートした後は、実際のサイズは 640 x 853 になります。

他のコンテンツの生成ツールでお客様の資産で同じピクセル サイズでデザインまたはブレンドお入りを確認する最善の方法は 96 PPI、ワークフロー全体を使用することです。

Expression Designで使用中に そのファイルにて96 PPI を選択するには、［ファイル］メニューの［新規作成］を選択します。

さらに、ズーム レベルにおいて実際のピクセルをフルサイズでコンテンツを表示するで設定する必要があります。96 PPI ではこの場合 133% です。

Photoshop では、ストアドの解像度の画像 [画像サイズ] ダイアログ ボックスで 96 PPI に変更できます。画像の「再サンプル」チェックボックスをオフにする必要があります。

残念ながら、Illustrator ファイル 72 PPI、現在は常にドキュメントの解像度が 96 PPI のときにデザインをインポートするときに拡張します。この場合、拡大/縮小としてパーセント操作バーで変換オプションのポップアップ ・ メニューから選択して、オブジェクトを目的のピクセル サイズを得ることができます。幅と高さにリンクされ、幅または高さを 75% に変更を確認してください (72/96 =.75).

Hopefully these tips will help keep the import goblins at bay!

Joanna Mason

Expression Designで作成したゲームグラフィック

From Expression Blend and Design > Game Graphics Created in Expression Design
by xprblog 30 Nov 2007 3:48 PM, translated and edited by Yoshie Kohama

はじめに

今日、私はExpression Designで作ったいくつかのゲームプロトタイピンググラフィックを共有したいと思います。これらは良質のグラフィックセットがなくて困っているゲーム開発者や、基本的なベクタ描画テクニックを理解するためのサンプルファイルを欲しい人たちに役立ちます。

以下に私がExpression Designで作成したサンプルを例に挙げます:

上記のイメージのファイルはこちらからダウンロードできます: PlanetCute.design (540k)

これらのファイルを作成するためのヒントとコツ

Expression Designはすでにベクタ描画ツールを作成の方法を知ってる人たちはすでにおなじみでありましょう。しかしながら、自分の生活をより簡単に作る毎日を過ごすためのいくつかのユニークなトリックがあります。

常にピクセルで作業する

私はいつもマイドキュメントをピクセルに設定（96 PPIが正確!）しています。これは、XAML にエクスポートするすべての混乱を大幅に削減します。なぜそれができたか詳細を知りたい場合は、Joannaのブログ記事をご覧ください。

グリッドサイズを10ピクセルに、微調整の刻み値を1ピクセルにするように設定する

すべてのタイルは10ピクセルでグリッド上に作られています。移動間隔を1ピクセルずつ微調整できるように設定することによって素晴らしいトリックが可能となります。Shiftキーを押しながら矢印キーを押してドラッグことで、そのオブジェクトは10ピクセルずつ移動します。この場合、10ピクセルのグリッドのとおりに動きます。今、手動で要素をドラッグする代わりにShifキーを押しながら矢印キーで移動できます。私はこれらのグリッド揃えを保証します。これは、ゲームのグラフィックを並べて表示する場合に便利です。

以下の手順でグリッドのサイズと移動間隔を微調整するように変更できます。

1. ［編集］メニューの［オプション］をポイントし、［単位とグリッド］を選択します。
   
2. ［ドキュメントの単位］を「ピクセル」に設定します。
   
3. ［グリッドサイズ］を「10px」と入力します。
4. ［微調整の刻み値］を「1px」と入力します。
5. ［OK］ボタンをクリックすることでこれらが設定されます。

透過ストップを使用してグラジエントをシェーディング

ほとんどの3Dのシェーディング結果は透過ストップを用いたグラジエントを使っています。このシンプルな機能は、すべてのグラデーションで停止 Alpha プロパティを通じてアクセスできる古い信頼性の高いグラデーションの有用性が大幅に増加します。ここに私はグラデーション透明の停止とタイルの残りの部分での使用に基づいてタイル シャドウ システムを作成する方法の例です。

Download Large (more readable!) Version

ゲームを作成できますか？

このグラフィックセットはほとんどフレキシブルです。あなたはプラットフォームゲームを作ることができますか？ ロールプレイングゲームを作ることができますか？ それともパズルゲームですか？ その可能性は無限大です。ロッキング、ゲームの設計に必要な正確なタイルにはセットが含まれていないことを確認する場合は、Expression Design で .design ファイルを開き、いくつかの色を変更、または一部の図形を追加するのは簡単です。新しいタイルと新しい文字ができあがり！

私は宝島チェストグラフィックを追加したので、誰かが最初のSilverlight海賊ゲームを作ってくれることを楽しみにしています。

これらのタイルを使って作成された何か他のモノをみるには、私のサイトに訪れてください。

• http://lostgarden.com/2007/06/latest-crop-of-sweet-prototypes.html
• http://lostgarden.com/2007/05/dancs-miraculously-flexible-game.html

Best wishes,
Danc.

Expression 4 パッケージ版 Amazon.co.jp で予約受付開始

9月3日のドラえもんの誕生日に発売される、Expression 4のパッケージ版がどうやらAmazon.co.jpで予約受付開始された模様です。

• Expression Studio 4 Web Professional アップグレード版
• Expression Studio 4 Web Professional アカデミック版
• Expression Studio 4 Web Professional

Expression Web 4 じゃなくて、Expression Studio Web 4になりました。4.0なのか4なのかという部分ですが、4が正しいと思い、こちらで4にさせていただきました。

Expression 4 がダウンロード可能になったっぽい

最近死ぬほど忙しくて全然活動できてないですが、、、

Expression 4がMSDNからダウンロード可能になってるっぽいです。ただし英語版のみです。

あと、英語版ですが、Expression４関係の試用版もダウンロード可能になっています。

Microsoft Expression Web 4 Trial
http://www.microsoft.com/downloads/details.aspx?displaylang=en&FamilyID=7b10272b-2f96-4250-aede-3fcfadf26f34

Microsoft Expression Blend® 4 Release Candidate (RC)
http://www.microsoft.com/downloads/details.aspx?displaylang=en&FamilyID=88484825-1b3c-4e8c-8b14-b05d025e1541

Expression Encoder 3 Screen Capture

昨日の第1回ExpressionTech.jpで初めて知ったんですが、Expression Encoder 3にスクリーンキャプチャツールが付属してきたんですね。

Expression Web 3にはSuperPreviewが付属したのは知ってますけど（自分のセッションで紹介したし）。

つまり、チュートリアルビデオなんか作れちゃうってことでしょうか？

画面操作したのを録画してくれるっていうか、声とかも録音してくれて、Webカメラも対応ってことでしょうか？

1. ［スタート］-［すべてのプログラム］-［Microsoft Expression］-［Microsoft Encoder 3 Screen Capture］をクリック
2. こんなツールバーがぴょんとでてくる
   
3. ［記録］ボタンをクリック
   
4. キャプチャする画面の範囲をマウスで指定
5. もう一度［記録］ボタンをクリック
6. 全画面キャプチャする場合は、こんなメッセージが表示される。［OK］ボタンをクリック
   
7. 画面操作する
8. 終了するには［停止］ボタン、またはCtrl+Shift+F12をクリック
9. プレビューウィンドウが表示されるので、再生ボタンをクリックすると再生できる。
   
10. Expression Encoder 3に取り込むには、ウィンドウ右下の［Expression Encoder の起動］ボタンをクリック
    
11. 名前をつけて保存 ダイアログが表示されるので、ファイル名を入力して［保存］ボタンをクリック
    
12. Expression Encoder 3が起動され、このように編集できるようになる
    

これは使えますね！

# 余談ですが、このPC、Webカメラ内蔵しているのにドライバインストールしてなかったです。。。
# 当初の投稿で誤植があったので訂正しました Blend → Encoder ボケてます。すみません。

Expression 3 日本語版がRTMに

それに気づいたのは今朝の話です。昨日RTMしたんですね。

そんなわけで、MSDNからダウンロードして、Windows 7のノートPCにインストール中です。

今後、Expression Web 3の解説サイトを作成していく予定です。本を出す予定がなさそうなので orz

まずは啓蒙活動をしないと、「Expressionって何？」な人を減らさないと先に進めない気がします。

10月3日の東京でのExpressionTech.jpの勉強会の参加希望の方には、「Expressionって何？」な方も含まれています。

そんな感じで、来月、ふるってご参加くださいませ。
http://expressiontech.jp/event/01.html

Expression Design 3ではスキンの切り替えがOK

Expression Design 3では、画面のスキンが2パターンあります。

1. ［編集］-［オプション］-［全般］を選択（もしくはショートカットキーCtrl+K）
2. ［オプション］ダイアログボックスの［ワークスペース］カテゴリを開く
3. ［ユーザーインターフェイス］の［テーマ］ボックスで［Expression dark］と［Expression light］のいずれかを選択
   

既定では「Expression dark」ですが、「Expression light」にすると、こんな感じになります。

全体の画面もこんな感じで

もしこれがExpression Webとかにもユーザーインターフェイスのテーマが変更できたらいいのにな、って思ったりします。

Expression Studio 3 がMSDNサブスクリプションに

今MSDNのサイトにアクセスしてみたら、Expression Studio 3 (x86) - DVD (English) がリストされているのを確認しました。

英語版・・・ですね。

日本語にフィルタされていると表示されないですが、言語を「English」にすると見れます。

Expression Studio 3がリストされるサブスクリプションレベルは

Available to Levels: VS Pro with MSDN Premium (Empower); Developer AA; Designer AA; MSDN Universal (Retail); VSTS Team Suite (VL); VSTS Architecture (VL); VSTS Development (VL); VSTS Test (VL); VS Pro with MSDN Premium (VL); MSDN Universal (VL); VSTS Database (VL); VS Pro with MSDN Premium (Retail); VSTS Test (Retail); VSTS Development (Retail); VSTS Architecture (Retail); VSTS Team Suite (Retail); VSTS Database (Retail); BizSpark Admin; BizSpark; G3; G4;

Expression Studio 3の中身は

Expression Studio includes Blend, Design, Encoder, and Web.

やはりMediaが入ってません。

たぶん、日本語版が出るのは2ヶ月後でしょう。