アルマニアインフォメーションタイトルイメージ
INFORMATION

アルマニアストアに機能追加とデザイン変更

アルマニアストアのデザイン変更

アルマニアサイトのスマホ表示最適化を順次すすめておりますが、この度アルマニアストアに特に機能面での変更を行い、本日よりご利用できるようになっております。

1. ストアでの項目別の商品一覧などを折り畳みでアイコン見出しから開いてご覧いただくように変更しました。

2. お気に入り機能を追加し、各商品に設置した右上のアイコンをONにすることで、ブックマーク的に一時的に気になるものをまとめておくことができるようになりました。

アルマニアストアのトップ表示
アルマニアストアトップページ

アルマニアストアをご覧いただくと、一見今までと変わらないようにしか見えませんが、右上の【CART】ボタン下に薄くブックマークアイコンを設置しています。これをクリックすると個別にブックマーク(お気に入り)をONした商品がピックアップされて一覧表示で確認できます。

下にスクロールしていきますと、今回のマイナーチェンジした機能面が見えてきます。

主にはスマホに特化した表示方法を目指しての変更になります。PCやタブレットでも機能面は利用できますが、アコーディオンなどは最初から開いた状態になります。

項目別商品一覧表示を折り畳み式に

アルマニアストアではスマホ表示では様々な商品が無差別に並んでしまう印象になってしまうほどでした。PC表示を主体で設計したデザイン構成でしたので、PC表示ではジャンル別に分かれているものの、スマホでは分かりにくい点がありました。

アコーディオン式に変更

そこで、スマホでアルマニアストアを表示した際は、トップページの全ての商品表示をアコーディオン式に収めて、まずはストア内の全体の分け方が把握しやすいようにデザイン変更しました。

検索開始の入口

  • カテゴリーから探す(ストアにある商品全体)
  • スマホモデルから探す(スマホ専用)

現時点では商品までにたどり着く際には大きな分かれ道としてこの2つからとなります。将来的にはもっと大きなカテゴリージャンル分けになる予定ですが、現時点でスマホ関連商品が多いため、【スマホモデルから探す】ようになっております。

商品表示一覧項目

  • 新着商品
  • おすすめ商品
  • お気に入り←新機能
  • 最近チェックした商品

ストア内の全体から項目・機能別に分けた一覧表示は4種類になります。
従来より新着やおすすめで分けてはおりましたが、スマホ表示ではただただ下に長くなって並べられた状態になっておりましたので、目的別に見やすいようにタップしてから折り畳み式(アコーディオン方式)が開く表示方法に変えました。

右上に項目別マークを表示

項目別の表示マーク
画像はPC表示

スマホ表示で商品がただただ下に並んでしまうと、「今何の項目を見ている?」かが分かりにくいこともあります。
そのため、商品画像アイコンの左上には各項目別に異なるマークを表示させるようにしています。

お気に入り機能

今まで複数の商品をご注文する毎には、「商品を探す」→「カートに入れる」→「商品を探す」→「カートに入れる」と、ある程度先に商品を決めておかなければスムーズに注文完了まで進みにくかった状況です。

そこで、新たに【お気に入り】機能を追加し、「あとで買う」と同じような感覚で一旦保留にして、あとから呼び出すことが出来るようになりました。

アルマニアストアのブックマーク一覧表示アイコン

ブックマーク(お気に入り)方法

各商品画像の右上にあるブックマークアイコンをタップしていただければ色が変わって保持されます。解除はもう一度タップしてください。

お気に入りを一覧表示するのはスマホの場合は右上の「カートボタン」下の【ブックマークアイコン】から一覧表示ページに飛ぶことができます。

また、トップページの「お気に入り」からもアコーディオンが開いてご覧いただくことが可能です。どこでもブックマークをONにしたりOFFにすることが可能になっています。

cookieを利用していますので、異なる端末やブラウザを利用するとブックマークは保持されておりませんので、再度気になる商品のブックマークアイコンをONにする必要があります。

このエントリーをはてなブックマークに追加

この記事をシェアする

コメントは受け付けていません。

authorization logo alumania

この記事はalumania(アルマニア)のスタッフによって調査・検証して投稿されています。
※無断転載と複製を禁じます。引用可

NEW ITEM LINK

おすすめ記事