［参考］Adobe Muse CC 2014 を使用したプロモーションページ作成［2］
Adobe Muse によるプロモーションページ制作のためのワークフロー（アップデート情報）
Adobe Muse CC 2014によるプロモーションページ作成のサービスに、HTML5によるアニメーションや動的な表現、インタラクティブな仕組みなどの作成も追加。今回は、Adobe Edge Animate CC をフル活用しており、Museとの連携で実現しました。
プロモーションページのトップカバーなどに追加できます。また、シンプルなブックトレーラーや動的な表現を追加したインフォグラフィックなども可能です。
更新日：2014年7月18日
「プロモーションページ作成」専用ページ
コピーライティングとビジュアルデザインで訴求！
あなたの作品・商品の魅力を伝える「プロモーションのための専用ページ」をつくります。
Adobe Muse CC 2014とEdge Animate CC 2014の連携ワークフローで作成
サンプルデータのダウンロード
同様のサービスを展開したいと思われている制作プロダクションやデザイナーの皆さんにとって、参考になるかもしれませんので、サンプルデータ（MuseとEdge Animateのデータ）をアップしておきました。
HTMLモーションのサンプルは、「プロモーションページ作成」専用ページ内の「サンプルを見る」をクリックしてください。PCとスマートフォンでページが切り替わります。
Adobe Muse CC 2014 のダウンロードデータ
Adobe Edge Animate CC 2014 のダウンロードデータ
ダウンロードデータ：
Adobe Muse CC 2014とEdge Animate CC 2014のファイル［HTML5 Motion Data.zip］3.88MB
※サンプルのキャラクターは「コミPo!」で作成しています。
リンクの再設定について
Museのページには、Edge Animteで作成したHTMLモーションのデータ（拡張子が「.oam」のパッケージファイル）が配置されていますが、フォルダの位置や名称が変わると、リンクが切れてしまうため、ダイアログが表示されます。
［1］下図のようなダイアログが表示された場合、ページに配置されているOAMファイル（Edge Animate）の再リンクをします。
［2］アセットパネルに（？）アイコンが付いていると思いますので、右クリックして「〜のすべてのインスタンスを再リンク」を選びます。
［3］「index.oam」ファイルを選択してください。
ダウンロードしたフォルダ「HTML5 Motion Data」内の「Edge_Animate」フォルダ→「publish」フォルダ→「animate_package」フォルダの中にあります。
［4］再リンクが完了すると、警告のアイコンが消えます。
本日配信したメールマガジン Vol.005 を掲載しておきます
本メールは、デザインの未来 デジタルパブリッシングチームの
商品をこれまでご購入いただいた方々へお送りしています。
Adobe Muse CC 2014でSource Han Sans（源ノ角ゴシック）を使用する
今週の火曜日（15日）、AdobeとGoogle、イワタが共同開発したオープンソースのフォント「Source Han Sans」が公開されました（バージョンは1.000）。
商業デザインでも十分使えるクオリティで、7種類のウエイトを持っています。
参考：
- Adobe Typekit Blog
Source Han Sansの紹介：オープンソースのPan-CJK書体
「Source Han Sans Japanese」のページで「フォントを使用」をクリックして、同期させることで、すぐに利用することができます
Muse でもテキストパネルのシステムフォントメニューに表示され、7種類のウエイトを指定することが可能です。
- ExtraLight
- Light
- Normal
- Regular
- Medium
- Bold
- Heavy
システムフォントを指定した場合、ウェブページ上では「画像」で表示されますが、代替テキストは自動的に追加されますので、検索エンジンなどのプログラムにもページの情報を伝えることができます。
以下のページは、Museで「Source Han Sans」を指定したサンプルページです。
サンプルページは、HiDPIモードにしていますので、Retinaディスプレイに対応した高解像度画像でパブリッシュされています。
文字のバリエーションが増えて、表現力も向上しますが、1つだけ問題があります。
「見出し」のレベルが指定できないことです。
Muse CC 2014から、テキストパネルで「見出しレベル（h1, h2, h3...）」の指定が可能になりましたが、システムフォントを使った場合は、画像になりますので、見出しレベルの指定が無効になってしまいます。
以下のようなコードを生成してくれると良いのですが、
＜h1＞＜img csrc="xxx.png" alt="大見出し"＞＜/h1＞
こうなります。
＜div＞＜img csrc="xxx.png" alt="大見出し"＞＜/div＞
※メール表示に影響しないように、全角の記号に変えています。
前述したとおり、代替テキストは自動的に追加されますので、内容は問題なく伝わりますが「見出し」とは解釈されません。
少なくとも、レベル1の見出し（大見出し）については、テキスト（Webセーフフォントで指定）でも配置しておいたほうがよいでしょうね。
Muse上のビジュアルデザインには、かなり使えるフォントだと思いますので、見出しの扱いだけ注意して、ぜひ活用してみてください。
Adobe Muse CC 2014が昨日アップデート
17日（米国16日）、Adobe Muse CC 2014のマイナーアップデートでバージョン2014.0.1.30 になりました。
こんなにバグがあったのか、と驚きましたが、修正が速いので助かります。
もし、原因不明のトラブルが発生している場合は、チェックしてみてください。修正されているかもしれません。
