魅力的なAdobe Muse CC用のウィジェット5例紹介
相変わらず時間があればAdobe Muse CCと格闘している。格闘といえば苦しかったり辛かったりを想像するかも知れないがこの格闘は実に楽しい。無論まだまだ思うとおりにはいかないし時にはなぜ旨くいかないかの原因さえ分からないこともあるが小さなウィジェットひとつを試しながら時間の経つのも忘れている...。
Adobe Muse CCはウェブページを作成するソフトウェアだ。HTMLといったコード類を書かなくても魅力的な、それでいて最先端の機能とデザインを折り込んだウェブページが作れるツールだが、間口は一見狭くて取っかかりやすいものの奥はズ~っと深い。
ただしそのMuse CCにしても何でも思い通りにできるわけではない。それを承知で「ここはこうしたい」「こんな表現はできないか」と考えあぐねることになるが、場合によってはウィジェットひとつ手に入れることでそれらが解決することもある。
ということで新しいウェブページの試作に疲れたとき、気晴らしにとMuse CC用のウィジェットを探してみたわけだが、これが実に面白いというか楽しい。勿論これもあれもと面白そうだからと取り入れては収拾が付かないページになってしまうが、コンセプトに合わせ小気味の良い小技を取り入れるのもサイトの魅力を増すことになるだろうと調べ始めた。

※MuseTemplatesPro.comからウィジェットが40種揃っている「Widgets Bundle」を購入した
ちなみに「ウィジェット(Widgets)」とはすでにご承知のことと思うが、念のために申し上げるなら「ページや画面に埋め込み、機能を拡張する小さなアプリケーション」とでも説明すればよいのだろうか...。
今回はたまたま出会った " MuseTemplatesPro.com " というサイトで販売している多くのMuse CC用ウィジェットのうちからお勧めのいくつかをご紹介してみたい。
勿論すでにMuse CCをお使いの方々ならすでにご承知のウィジェットたちだと思うが...。
実は先日、たまたま見つけた同サイトから今回のウェブページ作成に役立ちそうなウィジェットを3つダウンロード購入した。3つというと大層に聞こえるかも知れないがひとつ5ドルほどのものだからコスト的にもオモチャ感覚だった。
しかし同サイトで販売されているMuse CC用ウィジェットは全部で40種もある。当然のことそれらのすべてが必要なはずもないが大げさにいえば知的好奇心を刺激するものばかりだったから、優先順位のものから少しずつ購入しようと考えた。
そんなとき、 " MuseTemplatesPro.com " サイトからメールを貰った。それを要約すれば「貴方が我々のサイトでいくつかのウィジェットを買ってくれたことを知った。個別に買うより40個のバンドルセットがあるから10ドル値引きのクーポーンコードを送るので役立ててね」といったことだったが、無論そのありがたいお誘いに即刻乗って40種のウィジェットを手に入れたのだった(笑)。
では早速ここでは5種類のウィジェットをご紹介してみたい。なお具体的な作例はメーカーサイトにリンクしてある。当初いつものとおりビジュアルは自身で作った実例をと考えたが、英語サイトながらせっかく分かりやすい事例があるのでそのまま使わせていただくことにしてここでは簡単なビジュアルで済ますことにしたのであしからず...。
1)Audio Player
Muse CCを扱ってみて最初に考えたことはサウンドの再生機能を使いたいと考えた。しかしMuse CCにはその機能は実装されていなかったのでウィジェットを探し、当該ウィジェットに出会ったのがそもそものきっかけだった。ただサウンドを扱うといっても様々な演出があるしサウンドデータはサーバーにアップされ常駐するわけでむやみに大きな容量は避けなければならない…。
Audio Playerは指定したサウンドファイルを一般的なオーディオプレーヤー型インターフェイスで再生でき、ボリュームの調整機能もある。またプログレスバーのカラーなども指定できるのでオリジナル感を出せるのもよい。

※ライブラリからAudio Playerを選択し、Museのデザインページへドラッグする
ちなみに以下も同様だが、購入したウィジェットはダブルクリックするだけでMuse CCのアプリケーションに実装され「デザイン」モード時にサイドバーの「ライブラリ」に一覧表示される。それをデザイン画面にドロップし、目的のサウンドデータを読み込み、かつ各パラメーターの設定をすればOKだ。ただしサウンド利用の多くはボタン等の実装自体「プレビュー」で確認出来るものの、再生はサーバーへアップロードしブラウザで確認するまでできないケースが多い。

※プレビューした状態。プレーヤーのボディやらのカラーも選択可能
2)Moving Text
このウィジェットは任意のテキストを指定するフィールド内で電光掲示板のように横スクロール表示する機能だ。スクロール方向は右から左の位置方向だけだがオプションとしてテキストサイズ、テキストカラーおよびスピードを指定できる。とてもシンプルだが使い方によっては目を引くポイントとなるに違いない。


※表示のフィールド枠を整え、オプションウィンドウでテキストやそのカラー、サイズなどを選ぶだけ
3)Twitter Timeline
文字通りTwitterのタイムラインをウェブページに表示させるウィジェットだ。オプションとしてはTwitter Username指定の他、Twitter Theme、Link Color、BorderのON・OFFとカラーやご覧の設定が可能だ。

※Twitterのタイムラインをウェブページに表示させることができる
4)Background Music
これまたその名の通り、ウィジェットを埋め込んだページが開いたときに自動的に指定したサウンドが再生される。サウンドのタイムラインなどは表示されないがOFFおよび再度ONさせるボタンを置くことが出来る。オプションとしてはサウンド(Song)の読み込みとON・OFFアイコンの読み込み、そしてループのON・OFFだ。

※当該ページが開かれると指定したサウンドを再生する。ボタンを置きOFFあるいはONすることも可能
5)iFrame Widget
このウィジェットはウェブページに設定したフレーム枠内に指定URLのページを表示させるツール。オプションとしては表示させるウェブサイトのURL指定は勿論だが、フレームの縦横サイズ、ボーダーの太さおよびカラーだ。なおAllow Scroll にチェックを入れると表示枠内に表示しきれない範囲をマウスポインタでスクロールできる。
なお当該ウィジェットは私の環境下だとプレビュー時、スクロールさせるとフレーム内にボーダー線が縦横に入り込む。ただしサーバーにアップしブラウザで見た場合には問題なく表示した…。

※任意のURLページをフレーム内に表示する。表示枠内に表示しきれない範囲をマウスポインタでスクロールすることもできる
以上どれも大変魅力的なウィジェットだが、この種のウィジェットは "これ見よがし" に多用するものではない。あれもこれもと埋め込めばアクセスする者にとって五月蠅くて見難いものとなるだろう。またサウンドデータなどはファイル容量が大きくなりがちだがそれらを多々ホスティング側にアップすれば容量を圧迫するだけでなくアクセス時にタイムラグを生じる場合もあり得る。
上記の作例をご覧いただければお分かりの通り、同サイトでは英語ながらそれぞれのウィジェットの解説がわかりやすく載っているのにも好感が持てる。ともあれ手元にある40種のウィジェットをひとつひとつ楽しんでいるところなのだ…。
■MuseTemplatesPro.com
Adobe Muse CCはウェブページを作成するソフトウェアだ。HTMLといったコード類を書かなくても魅力的な、それでいて最先端の機能とデザインを折り込んだウェブページが作れるツールだが、間口は一見狭くて取っかかりやすいものの奥はズ~っと深い。
ただしそのMuse CCにしても何でも思い通りにできるわけではない。それを承知で「ここはこうしたい」「こんな表現はできないか」と考えあぐねることになるが、場合によってはウィジェットひとつ手に入れることでそれらが解決することもある。
ということで新しいウェブページの試作に疲れたとき、気晴らしにとMuse CC用のウィジェットを探してみたわけだが、これが実に面白いというか楽しい。勿論これもあれもと面白そうだからと取り入れては収拾が付かないページになってしまうが、コンセプトに合わせ小気味の良い小技を取り入れるのもサイトの魅力を増すことになるだろうと調べ始めた。

※MuseTemplatesPro.comからウィジェットが40種揃っている「Widgets Bundle」を購入した
ちなみに「ウィジェット(Widgets)」とはすでにご承知のことと思うが、念のために申し上げるなら「ページや画面に埋め込み、機能を拡張する小さなアプリケーション」とでも説明すればよいのだろうか...。
今回はたまたま出会った " MuseTemplatesPro.com " というサイトで販売している多くのMuse CC用ウィジェットのうちからお勧めのいくつかをご紹介してみたい。
勿論すでにMuse CCをお使いの方々ならすでにご承知のウィジェットたちだと思うが...。
実は先日、たまたま見つけた同サイトから今回のウェブページ作成に役立ちそうなウィジェットを3つダウンロード購入した。3つというと大層に聞こえるかも知れないがひとつ5ドルほどのものだからコスト的にもオモチャ感覚だった。
しかし同サイトで販売されているMuse CC用ウィジェットは全部で40種もある。当然のことそれらのすべてが必要なはずもないが大げさにいえば知的好奇心を刺激するものばかりだったから、優先順位のものから少しずつ購入しようと考えた。
そんなとき、 " MuseTemplatesPro.com " サイトからメールを貰った。それを要約すれば「貴方が我々のサイトでいくつかのウィジェットを買ってくれたことを知った。個別に買うより40個のバンドルセットがあるから10ドル値引きのクーポーンコードを送るので役立ててね」といったことだったが、無論そのありがたいお誘いに即刻乗って40種のウィジェットを手に入れたのだった(笑)。
では早速ここでは5種類のウィジェットをご紹介してみたい。なお具体的な作例はメーカーサイトにリンクしてある。当初いつものとおりビジュアルは自身で作った実例をと考えたが、英語サイトながらせっかく分かりやすい事例があるのでそのまま使わせていただくことにしてここでは簡単なビジュアルで済ますことにしたのであしからず...。
1)Audio Player
Muse CCを扱ってみて最初に考えたことはサウンドの再生機能を使いたいと考えた。しかしMuse CCにはその機能は実装されていなかったのでウィジェットを探し、当該ウィジェットに出会ったのがそもそものきっかけだった。ただサウンドを扱うといっても様々な演出があるしサウンドデータはサーバーにアップされ常駐するわけでむやみに大きな容量は避けなければならない…。
Audio Playerは指定したサウンドファイルを一般的なオーディオプレーヤー型インターフェイスで再生でき、ボリュームの調整機能もある。またプログレスバーのカラーなども指定できるのでオリジナル感を出せるのもよい。

※ライブラリからAudio Playerを選択し、Museのデザインページへドラッグする
ちなみに以下も同様だが、購入したウィジェットはダブルクリックするだけでMuse CCのアプリケーションに実装され「デザイン」モード時にサイドバーの「ライブラリ」に一覧表示される。それをデザイン画面にドロップし、目的のサウンドデータを読み込み、かつ各パラメーターの設定をすればOKだ。ただしサウンド利用の多くはボタン等の実装自体「プレビュー」で確認出来るものの、再生はサーバーへアップロードしブラウザで確認するまでできないケースが多い。

※プレビューした状態。プレーヤーのボディやらのカラーも選択可能
2)Moving Text
このウィジェットは任意のテキストを指定するフィールド内で電光掲示板のように横スクロール表示する機能だ。スクロール方向は右から左の位置方向だけだがオプションとしてテキストサイズ、テキストカラーおよびスピードを指定できる。とてもシンプルだが使い方によっては目を引くポイントとなるに違いない。


※表示のフィールド枠を整え、オプションウィンドウでテキストやそのカラー、サイズなどを選ぶだけ
3)Twitter Timeline
文字通りTwitterのタイムラインをウェブページに表示させるウィジェットだ。オプションとしてはTwitter Username指定の他、Twitter Theme、Link Color、BorderのON・OFFとカラーやご覧の設定が可能だ。

※Twitterのタイムラインをウェブページに表示させることができる
4)Background Music
これまたその名の通り、ウィジェットを埋め込んだページが開いたときに自動的に指定したサウンドが再生される。サウンドのタイムラインなどは表示されないがOFFおよび再度ONさせるボタンを置くことが出来る。オプションとしてはサウンド(Song)の読み込みとON・OFFアイコンの読み込み、そしてループのON・OFFだ。

※当該ページが開かれると指定したサウンドを再生する。ボタンを置きOFFあるいはONすることも可能
5)iFrame Widget
このウィジェットはウェブページに設定したフレーム枠内に指定URLのページを表示させるツール。オプションとしては表示させるウェブサイトのURL指定は勿論だが、フレームの縦横サイズ、ボーダーの太さおよびカラーだ。なおAllow Scroll にチェックを入れると表示枠内に表示しきれない範囲をマウスポインタでスクロールできる。
なお当該ウィジェットは私の環境下だとプレビュー時、スクロールさせるとフレーム内にボーダー線が縦横に入り込む。ただしサーバーにアップしブラウザで見た場合には問題なく表示した…。

※任意のURLページをフレーム内に表示する。表示枠内に表示しきれない範囲をマウスポインタでスクロールすることもできる
以上どれも大変魅力的なウィジェットだが、この種のウィジェットは "これ見よがし" に多用するものではない。あれもこれもと埋め込めばアクセスする者にとって五月蠅くて見難いものとなるだろう。またサウンドデータなどはファイル容量が大きくなりがちだがそれらを多々ホスティング側にアップすれば容量を圧迫するだけでなくアクセス時にタイムラグを生じる場合もあり得る。
上記の作例をご覧いただければお分かりの通り、同サイトでは英語ながらそれぞれのウィジェットの解説がわかりやすく載っているのにも好感が持てる。ともあれ手元にある40種のウィジェットをひとつひとつ楽しんでいるところなのだ…。
■MuseTemplatesPro.com
- 関連記事
-
- 「DIME」誌5月号特別付録「クリップ式スマホレンズ」を使ってみた (2016/03/18)
- バード電子の新製品、ステンレス製マウスパッドレポート (2016/03/14)
- ジョージ・ザルカダキス著「AIは心を持てるのか〜脳に近いアーキテクチャ」読了雑感 (2016/03/11)
- キングジム 電子メモパッド ブギーボードBB-2 レポート (2016/03/07)
- プログラムタイマー付きエコキーパー EC-04 レポート (2016/03/04)
- 魅力的なAdobe Muse CC用のウィジェット5例紹介 (2016/03/02)
- Kindleとコミックで楽しんだ漫画「スティーブス」は一級のエンターテインメント! (2016/02/29)
- シャチハタ、「どこでもスイッチ」レポート (2016/02/26)
- Web用にと丸いボタン・アイコンを簡単に作る「ICON X Pro」レポート (2016/02/24)
- Adobe Fuse CCとPhotoshop CCとの連携覚書 (2016/02/19)
- 15枚までの書類をしっかりとめる 紙素材の新感覚クリップ「デルプ」レポート (2016/02/17)