Usedly(株式会社トレビ様)

案件サマリー

種別: ECサイト
目的: リユースECサイトの新規立ち上げ
制作期間: 約1ヶ月 2025年12月

ロゴデザイン商品一覧ページデザイン商品詳細ページデザイン TOPページ調整 EC-CUBE実装メインビジュアル制作
担当範囲: ロゴデザイン情報設計デザイン EC-CUBE実装バナー制作
使用技術: HTML CSS JavaScript PHP
使用ツール: EC-CUBE Figma VS Code Photoshop

概要

幅広いリユース商品を扱うECサイト「Usedly」を制作しました。
ロゴデザイン、商品一覧ページ、商品詳細ページ、TOPページメインビジュアルを担当し、親しみやすさと商品を探しやすい導線を意識して制作しています。

作品を見る →

背景・課題・対応

背景

日用品からブランド品まで、幅広いリユース商品を扱うECサイトの新規立ち上げに関わりました。
多様な商品ジャンルを扱うため、親しみやすく、気軽に商品を見られる印象を重視しました。

課題

幅広い商品を扱うECサイトとして、特定ジャンルに寄りすぎないデザインと、商品を探しやすい導線を両立する必要がありました。
また、EC-CUBEの基本構成を活かしながら、短期間でサイト全体の見え方を整えることが求められました。

対応

ロゴ、商品一覧ページ、商品詳細ページ、TOPページメインビジュアルを制作しました。
親しみやすいトーンを軸に、商品カードやお気に入り導線を調整し、気になる商品を見つけやすいECサイトとして整えています。

主な対応内容

サイト名に合わせたロゴデザインを作成
商品一覧ページと商品詳細ページのデザインカンプを作成
TOPページは既存のデザインカンプをもとに画像追加・バランス調整を実施
商品カードにお気に入り追加表示を実装
未ログイン時にログインを促す導線を追加
TOPページ用のメインビジュアルを3枚制作

成果物

ロゴデザイン

担当範囲

ロゴデザイン

サイト名「Usedly」の頭文字である「U」の形を取り入れ、ショッピングができるサイトであることが伝わるロゴを制作しました。
親しみやすい印象になるよう丸みを持たせ、TOPページの基調色に合わせたネイビーカラーを使用しています。

意識した点

リユースECとして、気軽に利用できる親しみやすさを出す
ショッピングサイトであることが一目で伝わる形にする
幅広い商品ジャンルに合わせやすい、癖の強すぎないロゴにする
TOPページの配色と馴染むよう、ネイビーカラーで統一感を持たせる

商品一覧ページデザイン

担当範囲

情報設計デザイン EC-CUBE実装

商品を探しやすく、比較しやすい商品一覧ページを制作しました。
幅広い商品を扱うサイトとして、商品カードの見やすさや、お気に入り追加への導線を意識しています。

意識した点

商品が並んだときに、情報が見やすく整理されている状態にする
幅広い商品カテゴリでも違和感なく使える、汎用性のある一覧デザインにする
お気に入り追加表示を加え、気になる商品をあとで見返しやすくする
未ログイン時にはログインを促し、会員機能への導線をつくる
EC-CUBEの標準構成を活かしながら、買い物しやすさが伝わる画面に整える

商品詳細ページデザイン

担当範囲

情報設計デザイン EC-CUBE実装

商品詳細ページでは、商品画像・価格・説明・購入導線の見やすさを意識して制作しました。
ユーザーが商品の内容を確認し、購入検討へ進みやすいページになるように整えています。

意識した点

商品画像と説明情報のバランスを整え、商品の内容を確認しやすくする
購入に関わるボタンや情報が埋もれないようにする
一覧ページから詳細ページへ進んだあと、迷わず購入検討できる構成にする
リユース商品でも安心して検討できるよう、情報の見通しを良くする

TOPページメインビジュアル

担当範囲

デザインバナー制作

TOPページ用のメインビジュアルを3枚制作しました。
幅広いリユース商品を扱うサイトとして、商品ジャンルの広がりと、楽しく買い物できる印象が伝わるビジュアルを意識しています。

意識した点

扱う商品の幅広さが伝わるようにする
リユース商品を気軽に見られる、明るく親しみやすい印象にする
TOPページの導入部分として、サイトの雰囲気を分かりやすく伝える
商品カテゴリや新着商品へ進む前の期待感をつくる

← 実績一覧に戻る