BLOG

No.098 minacolor

■ 概要 Overview
minacolor(ミナカラ)はユーザーが正しい知識と共に医薬品を購入できるミナカラ薬局が運営するオンライン薬局の公式Webサイト

■ ファーストビュー Above the fold
サイトタイトル
検索窓
ハンバーガーメニュー
会員登録・買い物かご
キービジュアル
(アニメーションによる利用方法のイメージ動画)


ニュース・トピックスのスライドショー

■ ターゲット Target
常用薬、常備薬を必要とするユーザー全般
近隣に薬局やドラッグストアが無いユーザー
体の不調で薬局やドラッグストアに行けないユーザー

■ フォント Font
Roboto
15px,16px,20px,23px,25px,33px

■ カラー Color
<B>#FFFFFF
<M>#000000
<A>#0174EC

■ デザインの特徴 Design features
左のアサイドに体の部位ごとのカテゴリーやピックアップ情報が配置された2カラム
大量の情報がよく整理され、薬の検索、詳細、購入がスムーズにできるUI・UXのデザインになっている
また薬の記事やトピックスは、その時期特有(例えば、花粉症や乾燥による諸症状)の諸症状に適した翼品などをイメージ画像やイラストを伴ったしっかりした情報筋の信頼性の高い記事によって紹介され、そのまま何種類かのプロダクトが購入できるようにリンクを伴ったCTAが設置されている
テキストはGoogleが開発したネオ・グロテスク系サンセリフのRobotoが使用され、視認性が高く、重要項目はフォントウェイトやフォントカラーで変化をつけ、理解しやすくエラーを招かないように工夫されている
カラーはホワイトを基調とした、アクセントに明るいブルーを使用した清潔感があり明るい印象
サイトの性質上、固めのイメージが伴いがちだが、明度高めのイメージ画像、優しい色合いのアイコンやイラスト、角がないフォントやイラスト、適度なアニメーションなどのjQueryによって、優しいイメージがサイトから感じ取れ、安心して利用できるサイトデザインになっている

https://minacolor.com/

コメントを残す

*