オーダーメイド商品をWebでカスタマイズできるようにするシミューレーターには様々なものがあります。業界標準などなく、各EC事業者がスクラッチで開発したシミュレーターにはそれぞれ特徴があります。
商品をカスタマイズするWebシミュレーターの最適解は何なのか。探るべく、独自調査でピックアップした31社から特に優れた8社を抽出し、そのUXを調査・分析してみました。
総評
8社のうち半数以上の事例に備わっていた特徴は総計63%以上の下記6つでした。スコアの多い順に示します。
- アイコン縦横同比率
- パーツをテキストで示す
- デザイン保存
- カスタムパネル左右
- パーツをアイコンで示す
- カスタムパネル内スクロール
「アイコン縦横同比率」が1位です。カスタムできるパーツやその選択肢の画像は正方形や円形で示すことが標準的なようでした。スマートフォンアプリの台頭から、UIに使う画像は正方形となることが多くなりました。モバイルファーストやレスポンシブデザインの趨勢もあり、デスクトップ版においてもそのまま同比率となっていることが多いです。
「パーツをテキストで示す」が同率1位になったことも、スマートフォンUIの影響が大きいと思います。UIの画像はそれだけでは意味が分からないことがあるため、指示テキストを一緒に置いておくケースが多いです。iOSの標準デザインでもあります。5位「パーツをアイコンで示す」と併せ考えれば、カスタムオーダーECのシミュレーターはスマートフォンのUI思想に大きく影響を受けることが分かります。
4位「カスタムパネル左右」は、パーツのアイコンを押したときに出てくる選択肢グループのパネルが、上下でなく左右にあるということです。上下は38%でしたが、左右は63%でより人気なようです。左右にして、6位に挙がったようにパネル内でスクロールさせたほうが、画面全体をその都度スクロールしないで済むので使い勝手がよさそうです。例えば上画像のCITIZENの場合が左右にあたります。
下位となりましたが、「チップごと情報ホバー」「パターンごと説明文章」は複雑な商品を初めて見たお客様にとって分からない専門性を分かりやすく案内するためには有効だと言えます。下の画像の左上の選択肢で、マウスオーバーしたときに下部へ「ウェリントンＭ＋ネイビー＋レギュラー」と情報がホバーされています。
分析項目
8社のうちたとえ1社でも備えた特徴的な機能があった場合に、1列目「特徴」へ記載しました。オーダーメイド商品をカスタマイズしてそのまま購入するためにUXを向上するものとして捉えられるものです。
- アイコン縦横同比率
- パーツをテキストで示す
- デザイン保存
- カスタムパネル左右
- パーツをアイコンで示す
- カスタムパネル内スクロール
- Twitterシェア
- ビュー切り替え
- Step by Stepカスタム
- URLシェア
- Facebookシェア
- カスタムパネル上下
- プレビュー画像拡大
- プレビュー画像背景白以外
- プレビュー画像シャドウ
- ページスクロール不可
- LINEシェア
- 画像を保存
- カスタム仕様一覧表示
- Pinterestシェア
- メールシェア
- チップごと情報ホバー
- パターンごと説明文章
分析方法
それぞれの特徴が備わっていれば1を記載する、ということを8社それぞれについてします。その後、一番右側の列「総計」で、その特徴が備わった事業者の数を割合で示しました。その割合が多ければ人気があって標準的な機能ということになりそうです。
後記
分析は以上です。分かることはもっとあるのですが、文章が冗長になってしまうので控えました。今回はdesktop版のみでの評価でしたが、より実践的なmobile版評価についても、追ってしてみたいと思います。
弊社のGB Customはこれらの特徴を多く備え、他社・顧客の声を反映して、最適解の実現に向けて日々改善を重ねています。シミュレーターを使って商品を購入するお客様にとっても、カスタムオーダーECシステムを使って販売管理する顧客にとっても使いやすい、費用対効果の高いサービスを提供して参ります。
オーダーメイド販売をもっと簡単に