Show Menu
TOPICS×

コアコンポーネントを利用したプロジェクトの成功への道筋

コアコンポーネントは、強力で柔軟性が高く、使いやすく、カスタマイズも簡単です。このドキュメントで大まかに説明しているいくつかの主要なガイドラインに従えば、コアコンポーネントを利用したプロジェクトを確実に成功させることができます。

成功への 2 つの道筋

コアコンポーネントをプロジェクトに実装するには 2 つの基本的なアプローチがあります。それぞれ、成功につながりますが、プロジェクトごとに考慮する必要がある固有のトレードオフがあります。
  1. デザインをコアコンポーネントにマッピングし、コアコンポーネントで提供される HTML を取り込みます。または
  2. 定義済みの HTML 標準に準拠する必要がある場合は、より多くの手間がかかり、コアコンポーネントの利点を最大限活用することができません。

コンポーネントの実装時に陥りやすい落とし穴

コアコンポーネントを利用したプロジェクトが成功しない原因としてよくあるのは、次の 2 つの問題です。
  • 確定した設計
    - 経営幹部レベルの承認が得られている場合もあり、開発チームに引き渡されて、基盤となる技術を考慮せずにピクセルパーフェクトな実装がおこなわれます。
  • 全社的な HTML スタイルガイド
    - 多くの場合、コンポーネントでこのようなガイドに杓子定規に従わざるを得ず、トップダウンの観点からスタイルが適用されます。
いずれの場合も、コンポーネントに対する要件は非常に厳しく詳細なので、コアコンポーネントや標準搭載のコンポーネントでそれらの要件に従うのは困難であり、カスタムコンポーネントを大量に開発することにつながります。

早期の導入

プロジェクトの実装段階だけでコアコンポーネントを検討するのでなく、ワイヤフレーム作成および設計段階からコアコンポーネントを利用します。

コンポーネントライブラリの使用

既に設計段階で コンポーネントライブラリ を参照します。コアコンポーネントは強力で柔軟性が高く、出発点として非常に役に立ちます。合理的に考えてコアコンポーネントでは実現できないような実際のビジネスニーズがある場合にのみ、カスタムコンポーネントを追加します。

Adobe XD 用 UI キットの使用

カスタムコンポーネントのニーズが明らかになったら、すぐに Adobe XD 用の UIキット を活用して、コアコンポーネントを構成要素として使用し、設計者が枠組みと設計の作成を開始できるようにします。

強力な機能を見落とさない

AEM とコアコンポーネントの機能は非常に強力ですが、同時に非常にとらえにくく、特定の機能が設計者にすぐにはわからない可能性もあります。

コンテンツフラグメント

コンテンツフラグメントを使用すると、チャネルに特化しないコンテンツをチャネル固有のバリエーションと共に作成できます。 その後、コンテンツページをオーサリングする際に、これらのフラグメントとそれらのバリエーションを使用できます。
更新された JSON エクスポーターと共に構造化コンテンツフラグメントを使用して、AEM コンテンツをコンテンツサービス経由で AEM ページ以外のチャネルに配信することもできます。

エクスペリエンスフラグメントテンプレート

作成者がページの一部(エクスペリエンスのフラグメント)を再利用する場合。 エクスペリエンスフラグメント を使用しなければ、作成者はそのフラグメントをコピーして貼り付ける必要があります。これらのエクスペリエンスのコピー/貼り付けの作成と管理には時間がかかり、ユーザーエラーが発生しがちです。 エクスペリエンスフラグメントは、コピー/貼り付けを不要にします。

埋め込みコンポーネント

埋め込みコンポーネントは を利用すると、YouTube ビデオコンテンツなどの外部リソースを単に組み込めるだけでなく、コンポーネントを拡張してプロジェクトのニーズに合ったコンテンツを作成できます。