第11回「ステートボタンの作成」

6時間、全23回で学ぶ Adobe Muse CC 完全習得[基礎編]

Adobe Museには、ロールオーバー(カーソルが重なったときの状態)やマウスダウン(クリックしたときの状態)などのデザインを含むステートボタンが用意されていますが、Vol.11ではオリジナルのボタンを作成します。また、ライブラリとして書き出す方法も解説します。

 

ここで作成したページは「Button-A」(拡張子は「.muse」)という名前を付けて、新しいフォルダを作成して、保存します。フォルダ名は「ボタンライブラリ」にします。

素材データはありません。

 

また、作成したボタンをライブラリとして書き出します。ライブラリ名は「Button-A」(拡張子は「.mulib」)にします。

※ビデオの中では、スペルミス([誤]Botton-A →[正]Button-A)がありますが、進行上の問題ありません。

再生時間:19分37秒

追加情報

ステートボタンが登録されている場所について:

 

ステートボタンは、ウィジェットライブラリに入っていますが、Muse CCでは「コンポジション」フォルダに登録されていました。
Muse CC 2014では、新たに「ボタン」フォルダが追加され、この中に登録されています。

Muse CC 2014では、ステートボタンの登録場所が「ボタン」フォルダに変更されている

[復習]グラフィックスタイルとライブラリについて

 

ステートボタン作成時に、グラフィックスタイルを活用しましたが、ライブラリとは異なり、設定した内容は、ファイル内にしか記憶されません。

ただし、下図のように「グラフィックスタイルを適用したボタン」をライブラリに登録しておけば、そのボタンをページにドラッグした時点で、グラフィックスタイルにも反映される仕組みになっています。

グラフィックスタイルとライブラリの仕組みを示した図

第12回「テキストの配置と段組みレイアウト」

Adobe Museは、InDesignやIllustratorなどに近いUI(ユーザーインターフェイス)になっていますので、文章もテキストフレームを調整しながら直感的にレイアウトしていきます。Vol.12では、段組みレイアウトの表現についても学習していきます。

 

ここで作成したページは「textedit」(拡張子は「.muse」)という名前を付けて、新しいフォルダを作成して、保存します。フォルダ名は「テキスト編集の練習」にします。

 

また、作成したページのレイアウトパターンをライブラリとして書き出します。ライブラリ名は「2Multicolumn」(拡張子は「.mulib」)にします。

再生時間:30分12秒

素材データ

第12回の素材データ:

 

ダウンロード:

 

フォルダ名「テキストと画像の素材」

  • photo01_sp.jpg
  • すべての段落.txt
  • 段落1.txt
  • 段落2.txt
  • 段落3.txt

追加情報

テキストフレーム間の余白について

 

ウェブブラウザーで「文字だけ」拡大した場合、テキストフレーム間の余白が狭くなってしまう場合があります(ビデオで解説しています)。この問題を回避する方法がありますので、追加情報として掲載しておきます。

 

下図をご覧ください。(ページ全体のズームではなく)文字だけ拡大すると、上下のテキストフレームの間隔が狭くなり、読みづらくなっています。ところが、一番下の表示結果では、同様に文字拡大していますが間隔は変わっていません。

ウェブブラウザーで文字だけ拡大したときの表示結果の比較

回避する方法は、テキストフレームの「高さ」と「最小値」を同じ値にするだけです。ただし、以下のような方法で実行する必要があります。

 

まず、テキストフレームをクリックして、下辺中央のポイントを上方向にドラッグしてください。ドラッグを続けると、破線が表示されます。

破線は、「最小値」が「高さ」より小さくなった場合に表示されます。

 

下図の場合は、「最小値」が「162」以下になったときに、破線が表示されます。「最小値」が「160」でも「150」でも、高さは「163」のままです。

 

今度は、下方向にドラッグして「最小値」を「163」にします(ここで破線が消えます)。

※「最小値」が「164」以上にならないように注意

 

解説文ではわかりにくいと思いますので、実際に試してみましょう。

テキストフレームの高さの調整

第13回「画像の配置と回り込みの設定」

Adobe Museは、Adobe Illustratorと同様の操作で画像を配置したり、レイアウトすることができます。Vol.13では、画像の配置、拡大縮小、テキストの回り込みなど、基本的な操作方法について解説します。

 

テキストと画像をレイアウトしたページを作成します(保存はしません)。

再生時間:19分49秒

素材データ

第13回の素材データ:

 

ダウンロード:

 

  • Vol13.zip(112KB)
    ※第12回の素材データと同じものです

フォルダ名「テキストと画像の素材」

  • photo01_sp.jpg
  • すべての段落.txt
  • 段落1.txt
  • 段落2.txt
  • 段落3.txt

ご質問があればコメントを送ってください

学習選択ページに戻る

ebookcast@gmail.com

The Future of Design Digital Publishing Team

デザインの未来 デジタルパブリッシングチーム

 ズオンコーポレーション 東京都中野区2-30-9 ツバセス中野坂上 333

© 2014 The Future of Design Digital Publishing Team