AEMのクラシックUIで長らくサイト運用をしてきたけれど、どうやらAEM Cloudなるものがあるらしい。一体クラシックUIと何が異なるのだろう？
今回はそんな疑問をお持ちのサイト運用ご担当者に向けて、クラシックUIにはないAEM Cloudの特徴を3つご紹介します。
AEM Cloudとは
AEM Cloudは、Adobe社が出しているAEMの中で、クラシックUIより新しく登場したものです。
そのためまだ事例が少なく、調べてもよくわからないなーと思われている方が多いのではないでしょうか。
AEM Cloudは、Adobe Experience Manager (AEM) のクラウドベースのバージョンです。
そもそもAEMとは、Webサイトやモバイルアプリケーションなどのオンライン体験を構築、管理、配信するためのプラットフォームのことです。
AEM Cloudは、Adobeが提供するクラウドインフラストラクチャ上で動作し、ユーザーはインフラストラクチャ管理やスケールアウト（システムを構成するサーバーの台数を増やすことで、システムの処理能力を高めること）などのタスクを行う必要がありません。
また、AEM Cloudは、Adobeが提供する管理ツールを使用して、AEMのアップデートやセキュリティパッチの適用などを簡単に行うことができます。
このように様々なメリットがあるのですが、基盤の部分は目に見えないのでいまいち分かりにくいですよね。
そこで今回はより分かりやすい部分に注目し、主にWebディレクター目線で便利だと感じた特徴を3つご紹介させていただきます。
AEM Cloudの特徴
AEM Cloudの特徴は次の3点です。
- Adobeが用意しているベーシックなコンポーネントを活用することで開発コストを下げられる
- 一つのコンポーネントでもデザインのバリエーションが出せる
- 別のページにもコンポーネントをコピーできる
順番にご説明していきます。
1. Adobeが用意しているベーシックなコンポーネントを活用することで開発コストを下げられる
AEM Cloudにはコアコンポーネントと呼ばれる、Adobeが用意してくれているベーシックなコンポーネントセットがあります。
これをベースとし自分たちのデザインガイドラインに沿って開発することで、一から開発するよりも大幅に開発工数を抑えることができます。
具体的にどのようなコアコンポーネントがあるかは、Adobeのページからご確認ください。
コアコンポーネントのサンプルコードを活用しつつも、CSSは自由に当てられるので自社サイトにあったデザインに変更することができます。
2. 一つのコンポーネントでもデザインのバリエーションが出せる
AEMはコンポーネントの組み合わせでしか表現できないので、どうしても融通が効かず単調なデザインになりがちだなーというお悩みをお抱えの方は多いのではないでしょうか。
実はAEM Cloudのスタイルシステムという機能を使うことで、この問題を解決できます。
使い方は簡単で、各コンポーネントにある筆のマークをクリック→適用したいデザイン（スタイル）を選択するのみでOKです。
もちろん開発する側はスタイル名とそれに紐づくデザインをすべて用意する必要があるので、デザイン〜実装〜検証まではデザインのバリエーション分工数がかかることになります。
とはいえ一回この作業を乗り越えれば、後は同じボタンコンポーネントだとしても重要度に応じてデザインを変えて目立たせたり控えめにすることができたりするので、汎用的で豊かな表現が可能になります。
CVボタンは黄色、それ以外のボタンは緑、みたいな使い方ができるんだね！
このスタイルシステムと一つ目のコアコンポーネントをフル活用すれば、ぞれだけでも少ない工数で様々な表現が可能になります。
3. 別のページにもコンポーネントをコピーできる
あるページの中で作ったパーツを、別のページにも使用したい場面があると思います。
そのパーツを各ページでいちいち一から制作するのは骨が折れるし非効率ですよね。
そこで登場するのがコピー＆貼り付け機能です。
AEM Cloudの場合、各コンポーネントのツールバーの中に「コピー」と「貼り付け」の選択肢があります。
使い回したいコンポーネントをコピーし、別のページの中で貼り付けを行うと、コンポーネントのコピペが一瞬で完了します。
もちろん同じページ内でのコピペも可能です。
とても便利な機能なので、ぜひ有効活用してみてください。
AEM Cloudを使いこなし効率的なサイト運用をしよう
これまでご紹介してきたとおり、AEM Cloudには便利な機能がたくさんあります。
これらを駆使することで、サイト開発や日々の運用を効率的に行うことができます。
ぜひ新しくスマートなサイト制作を体験してみてください。