🐱制作物
▼ UI改善例（以下リンク先Figma）
※ 既存UIである「修正前」エリアに対し、「修正後」エリアにて改善UIの提案を作成しています
▼ 提案資料
🐱課題概要
架空クライアントからの依頼内容まとめ
- やりたいこと
ECサイト「SHE loves」のUI／UXを改善し、ユーザー体験を向上させたい
共有された「クライアントが抱えている課題」から2つを選び、解決策を提案する - 目的
UI／UX改善を通して売上を拡大する。
現在はSHEのCIを展開したグッズが中心だが、今後はコスメ・日用品・家具など生活関連商品へ展開予定。
🐱工夫したポイント
- マーケティング要素をブランド世界観に融合
ブランドタイトル「SHE loves」から着想を得て、ハートモチーフをお気に入りボタンに使用。機能性とトンマナを両立させました。 - UI改善提案の幅出し
資料では主に課題①・③に焦点を当てましたが、離脱要因となる「ほしい商品が見つけづらい」点についても、検索バー・並び替え・絞り込み・パンくずリスト導入などのUI改善案を検討。 - SEOとUXの両立
現職で培ったSEO知見（UGCやパンくずリスト構造の最適化など）を、UX向上の文脈で活かしました。 - 一貫したデザイン言語
既存のUIトンマナを維持しながら、改善案を自然に馴染ませ、全体の統一感を確保。 - プレゼン資料にもUX視点を反映
情報構成を整理し、クライアント視点で「改善意図がひと目で伝わる資料」に仕上げました。
🐱制作過程で意識したこと
- 仮説要因を論理的に洗い出し、「購入単価の向上」「離脱率の低減」に対する解決アプローチを構造化。
- 改善UIでは、ユーザーが直感的に意味を理解できる操作性を意識。ユーザー体験の向上と、事業者の売上向上を両立させることを目指しました。
🐱学び・振り返り・今後の展望
ストレングスファインダーで「最上志向」があるため、既存のUIをより良くする課題は非常に楽しく取り組めました。
複数のECサイトを分析する過程で、ユーザーが各コンテンツと接触する際に、どんな感情でサイトを見ているか、何を考えているかを想像することの重要性を再認識し、「より良く見せる」ではなく「より使いやすくする」デザインの大切さを体感しました。
また、「購入単価を上げたい」といった事業者側の課題を、ユーザーにとって自然でストレスのない動線設計で解決することに対するやりがいも実感しました。デザインはあくまで見る人のためにあるという原点に立ち返る課題でした。
初めて本格的にFigmaを使用しましたが、Photoshopとの親和性が高く取り組みやすかったです。今後はコンポーネントの扱いを中心にFigmaの運用スキルを強化し、UIデザインの再現性と効率を高めていきたいです。