PORTFOLIOS
ポートフォリオ一覧
- ALL
- LP制作
- バナー制作
- WEBサイト制作
- UI/UXデザイン
コールセンター_LP
| 制作期間 | 0.5ヶ月 | |
|---|---|---|
| 使用技術 | Figma | PhotoShop |
| 対応機種 | PC | SP |
COMMENT
1. 「100名募集」の圧倒的な視覚的インパクト
一番の強みである採用人数が、太字のフォントと大きなサイズ、さらに鮮やかな水色で表現し、
パッと見た瞬間に「受かりやすそう」「大規模な募集だな」という安心感と活気が伝わります。
背景のカラフルなストライプも、オープニングスタッフらしいワクワク感を演出しています。
2. 重要な3要素が「円形」で整理され、視認性が高い
求職者が最も気にする「時給」「雇用形態」「勤務地」が、
重なり合う円形のアイコンの中に整理されています。
3. 安心感を醸成する「具体的なターゲット明示」と「写真」
中段のセクションで、**「大学生・フリーター・主婦」**というターゲットをオレンジのラベルで
明示しているため、自分事として捉えやすくなっています。 また、笑顔のオペレーターの写真と
「未経験大歓迎」のキャッチコピーがセットになっていることで、コールセンター未経験者が抱く
「難しそう」という心理的ハードルをうまく下げられています。
美容系_LP
| 制作期間 | 0.5ヶ月 | |
|---|---|---|
| 使用技術 | Figma | PhotoShop |
| 対応機種 | PC | SP |
COMMENT
1. 水を想起させる「清涼感・透明感」のある質感
背景に揺らぐ水面、浮かび上がる水滴、そして透明なバブル(円形パーツ)が多用されており、
商品最大の特徴である「保湿」や「みずみずしさ」が視覚的にダイレクトに伝わってきます。
青と白のグラデーションが非常に美しく、清潔感を演出しています。
2. ターゲットの悩みに寄り添う「強いキーワード」の配置
「年齢肌」や「徹底保湿」**といったコピーが筆記体に近いフォントで大きく配置され、
ユーザーの悩みを瞬時にキャッチしています。
「くすみ × 荒れ」という具体的な肌のトラブルを中央のバブル内に配置することで、
何を解決してくれる商品なのかが明確です。
「直接アプローチ!」**という強い言葉が、効果への期待感を高めています。
3. 「季節を問わない万能性」の訴求
下部に配置された「夏の紫外線にも冬の乾燥肌にも」というテキストにより、
オールシーズン必要であることを示唆できています。
これにより、季節の変わり目に悩むユーザーに対しても、購入の動機付けを強化する工夫がなされています。
美容系_LP
| 制作期間 | 0.5ヶ月 | |
|---|---|---|
| 使用技術 | Figma | PhotoShop |
| 対応機種 | PC | SP |
COMMENT
1. ターゲットの「共感」と「ベネフィット」
を繋ぐストーリー構成
30代女性」「乾燥・くすみ」とターゲットを絞り、
具体的な悩み(ざらつき、老け見え等)
を提示することで、「自分のための商品だ」
という共感を素早く生んでいます。
2. 清潔感と機能性を両立した「水」
のビジュアル表現
水滴や水面のビジュアルを多用し、白と水色で統一することで、
「高い保湿力」と「清潔感」をひと目で直感的に伝えています。
3. 納得感のある成分解説
選ばれる理由を4つに構造化し、専門成分(ヒアルロン酸等)と得られる変化(ふっくら、ハリ等)
をセットで記載することで、購入の決め手となる説得力を高めています。
ITスクール_LP
| 制作期間 | 0.5ヶ月 | |
|---|---|---|
| 使用技術 | Figma | PhotoShop |
| 対応機種 | PC | SP |
COMMENT
1. 報酬額を前面に出したキャッチコピー
「月60万以上稼ぐ」という具体的な金額を
メインビジュアルに配置し、理想の働き方
とセットで見せることで、ユーザーの収益
に対する期待感を強力に高めています。
2. 圧倒的な「お得感」によるハードル除去
本来2万円相当のコンサルが「1,000円」
で受けられるという割引キャンペーンを
強調し、「まずは話を聞くだけ」という心理的
ハードルを徹底的に下げて申し込みを
促しています。
3. 「稼ぐ」ための実践的カリキュラムの提示
なるデザインスキル(Photoshop等)の習得
だけでなく、「ロードマップ」「集客方法」
「案件取得方法」を3つの柱に据えることで、
「学んだ後にどう稼ぐか」という不安を
解消する構成になっています。
IT企業サイトデザイン
| 制作期間 | 1ヶ月 | |
|---|---|---|
| 使用技術 | Figma | PhotoShop |
| 対応機種 | PC | SP |
COMMENT
1. 視認性の高いマルチカラム配置
PCの横幅を活かし、サービスを2列、工程を3〜6列と
使い分けることで、スクロールを最小限に抑えつつ情報
を一覧できる構成にしています。
2. 信頼と親しみやすさの配色
IT企業の堅実さを表す「ブルー」と、相談しやすさを
感じさせる「オレンジ」を対比させ、プロ感と温かみ
を両立させています。
3. ユーザーを迷わせない導線設計
セクションごとの大きな数字(01〜04)や、
各所に配置した明確なボタン(CTA)により、
広い画面内でも次に読むべき場所を直感的に
伝えています。
1. モバイルに最適化した「1カラムへの再配置」
PC版で横並びだった要素(SERVICEやFLOWなど)
を縦一列に並べ替え、親指一本でスムーズに
閲覧できるレイアウトに変更しています。
2. タップを意識した「ボタンと文字のサイズ調整」
画面幅いっぱいに広げた大きなボタンや、
視認性を高めた文字サイズにより、小さな画面でも
誤操作を防ぎ、情報を確実に伝える工夫をしています。
3. 縦長画面を飽きさせない「視覚的リズム」
セクションごとの背景色の切り替えや、番号(01, 02...)
の配置を工夫することで、単調になりがちな
縦スクロールにメリハリをつけています。
1. 視覚的インパクトと情報の優先順位
最も伝えたい実績数値である「70」を赤色で強調し、寒色系の背景の中で際立たせています。
左側にテキスト、右側に写真を配置する王道のレイアウトを採用しつつ、
大きな数字を一番に目に入らせることで、
瞬時に「人気のあるサービス」であることを印象付けています。