今回はスマートフォンサイトで何らかの商品を比較する際のUIをいろいろと見てみたいと思います。

パナソニック（ノートPC）

最初はパナソニックのオンラインストアにある、最新モデルの価格・スペック比較表です。
下記は、最初にCPUやメモリなどのスペックなどを選択し商品が絞り込まれた後の画面です。
表示される商品数が多い場合があるのと、比較項目もそれなり多いので、タテとヨコにそれぞれスクロールして比較するかたちになります。

タテとヨコにそれぞれスクロールして比較可能。左項目や商品名はスクロールしても消えずに残ります。
また、検討から外したい商品があれば、×アイコンを押して消すことができます。

比較するモデルは、スペックなどで絞り込みが可能です。

楽天 保険の総合窓口

続いて楽天 保険の総合窓口の、検討リスト（お気に入り）です。簡易表示と詳細表示を選択できますが、こちらは詳細表示の方です。検討中リストということなので利用シーンとしては少し商品の候補を選んだ後、細かな情報を比較するような使い方でしょうか。
スクロールしても商品名と保険料は上部に固定されています。

検討中リストの詳細表示で比較画面。
ゆったりしたレイアウトで、整理されたデザイン。

保障や特約などの有無が分かりやすいように、無い場合もグレー文字で表示されていて比較しやすい。
また、商品名の上にある×アイコンで商品の削除、矢印アイコンで商品の並び替えをすることができます。

表示する項目（比較する項目）を減らすことも可能。

トヨタ自動車

次はトヨタ自動車の同車種のグレード比較機能です。２つのグレードの違いを比較できます。検討の最終段階で細かく比較する目的の機能というところでしょうか。
画面ではClossover”Glam”と、Sを比較しています。

２つのグレードを比較できます。
スクロールしてもグレードは上部に固定されますが、グレード名をタップして他のグレードのモデルとの入れ替えが可能です。
主要装備の「もっと見る」をタップすると、ホイールや外観、車内などの詳しい情報で比較できます。

こちらは上部のグレードのプルダウンを選択した画面です。他のグレードのモデルと入れ替えができます。

三井住友トラストアセットマネジメント

三井住友トラストアセットマネジメントの投資信託の比較機能です。
3つのタブ（チャート、詳細情報、リスク・リターンマップ）があり、見たい情報で比較できます。
チャートなどは一つのチャートに複数商品が表示されるかたち、詳細情報については、スワイプで切り替えて比較するかたちです。
アカウントなしで、比較結果を保存することもできます。

チャートの比較です。３つの商品が一つのチャートに表示されています。

基準価額や純資産、運用実績などの詳細情報の比較です。スワイプして他商品と比較します。
比較というより次々に商品を見る感じですね。

リスク・リターンマップの比較です。３つの商品が一つのマップに表示されています。

まとめ

以上、スマートフォンサイトの比較機能のUIをいろいろと見てました。各サイトとも利用シーンに応じた比較がしやすいように、いろいろと工夫をしてますね。