Works Details

Works Details 作品詳細

LP

PC表示 1/2
2/2
スマホ表示 1/3
2/3
3/3

LP(ランディングページ) | 架空の書店

内容

架空の書店「Holos Books」のコーポレートサイト。
ブランド想定:「ホリスティックなあり方を探る本屋」がコンセプトの、個人経営の書店。
ギリシャ語で「全体性」を意味する「ホロス(holos)」が店名の由来。心・体・環境など、全体的なつながりをテーマとする書籍を取り扱う。

デザイン

書店のコンセプトである「全体性」を表現するため、ページ全体に空間のつながりが感じられるよう、余白を広めにとりました。また、知的・静寂さを感じさせるよう、明朝体を使用しました。
ブレイクポイントを2つ設け、レスポンシブ対応を行っています。特に「access」の表示は、画面幅の変化に合わせて見やすくなるようにレイアウトしました。

制作期間

約2週間

使用ツール

XD / Illustrator / Photoshop

Website

Webサイト | ポートフォリオ

内容

自身のポートフォリオサイト(本サイト)。職業訓練校での学びや作品をまとめました。

デザイン

クリックすることなく、スクロールのみで必要な情報が伝わるように構成しました。PC版ではヘッダーのメニューを利用することで、ワンクリックで「進む」「戻る」が可能です。
CSSやHTMLを追加し、レイアウトや装飾を整えました。

サイト用として、自身の性質を表現するロゴマークを制作しました。イニシャルA.Sをモチーフとし、正方形に収まるかたちにすることで安定感を表現。正方形の中にA.Sの文字が浮かび上がります。柔らかさだけではなく鋭さも併せ持つ性質を、曲線と鋭角の形状で表しました。また、落着き・柔らかさを表すモーブ系の色を使用しました。

制作期間

6か月(訓練期間中更新)

使用ツール

WordPress(テーマ:Cocoon)/ Illustrator / Photoshop

バナー | 架空の通信会社プラン

内容

架空の通信会社の通信プランのバナー。
目的:現在は比較的年配の利用者が多い。若年層にも訴求したい。
ターゲット:20代~30代の男女。携帯電話利用料の安さを重視している。

デザイン

ターゲット層と同年代の女性の写真を使用。
若者向けではあるものの、従来の利用者に対しての会社のイメージを損なわないよう、また、「コスパ重視の堅実派」に好印象を持たれるよう、落ち着いた色味を使用しあまりポップになりすぎないようにしました。

制作時間

1時間

使用ツール

Photoshop

ロゴ | 架空のジュエリーブランド

内容

架空のジュエリーブランド「Hogi(ホギ)」のロゴ。
ブランド想定:ターゲットは30代から40代女性。テーマは「いつものわたしを祝ぐ(ほぐ)」。シンプルで繊細な、日常使いできるジュエリーを扱う。

デザイン

「祝(ほぎ)」からイメージし、お祝い事に用いられる水引をモチーフにしました。水引でよく用いられる「あわじ結び」は、和風の印象が強く、ブランドのイメージにそぐわないと考えました。そこで、水引や結びの形を残しながら、よりシンプルな形・色に落とし込みました。
ロゴタイプにはセリフ体を使用し、シンプルかつ繊細なイメージを表現しました。

制作時間

4時間

使用ツール

Illustrator

Business Card

名刺 | 架空のジュエリーブランド

内容

架空のジュエリーブランド「Hogi(ホギ)」の名刺。
ブランド想定:ターゲットは30代から40代女性。テーマは「いつものわたしを祝ぐ(ほぐ)」。シンプルで繊細な、日常使いできるジュエリーを扱う。

デザイン

ロゴに合わせて明朝体を使用。シンプル・大人の女性向けのブランドイメージに合わせ、かっちりとしたシンプルなレイアウトにしました。

制作時間

3時間

使用ツール

Illustrator

DM

DM | 架空のジュエリーブランド

内容

架空のジュエリーブランド「Hogi(ホギ)」オンラインストアのサマーセール告知はがき。

デザイン

既にブランド名やそのテイストを理解している顧客向けDMのため、商品画像や金額などは載せず、商品(指輪)を身に付けた腕に金魚をあしらい、夏のイメージを表現しました。
ブランドイメージを損なわず、セール期間などの情報が伝わるようにしました。

制作時間

3時間

使用ツール

Photoshop / Illustrator

Pictogram

 

ピクトグラム | 図書館

内容

図書館で利用するためのNDC(図書のテーマごとに数字を割り当てた図書の分類法)を表したピクトグラム。
図書館利用者向けに、書架の掲示や案内に利用する。

デザイン

公共図書館では多様な人々が利用するため、複雑な形にならないようにし、単色で構成しました。
「2類は地理・歴史」のように、様々なテーマが含まれることもあります。その場合一つのモチーフに絞るのが難しかったですが、よりイメージが合うと思うものをチョイスしました。

制作時間

3時間

使用ツール

Illustrator

Thumbnail (eyecatch)

 

サムネイル(アイキャッチ) | 訓練日誌

内容

本サイトの投稿ページ「訓練日誌」のためのサムネイル。
その日の職業訓練校での学びをまとめたページ。

デザイン

成績考査までの期間を一つのタームとして、同じ配色を使用。フリーイラストを使用し、訓練の課題がわかるようにキャッチフレーズをつけました。

制作時間

1点 0.5~2時間

使用ツール

Illustrator

Others

その他 | 習作・模写など

学習のため、Webサイトより画像をお借りして制作した作品をまとめました。すべて、Photoshopにて制作しました。

バナー(サイトへの当て込み)

FANCL マイルドクレンジングオイル
参照元:FANCL公式ショップ 楽天市場店 様(https://www.rakuten.ne.jp/gold/fancl-shop/)

制作バナー
ショップサイトトップへの掲載イメージ

内容・制作時間

2種類のクレンジングオイルの特徴をシンプルに表現しました。
制作時間:1.3時間

野菜をMOTTO お歳暮
参照元:モンマルシェ楽天店(「野菜をMOTTO」ブランド公式ストア)様(https://www.rakuten.ne.jp/gold/monmarche/)

制作バナー
ショップサイトトップへの掲載イメージ

内容・制作時間

赤の背景には和紙のテクスチャを使用。ショップで使用されているものに近いフォントを選び、雰囲気を損なわないようにしました。
制作時間:1.3時間

バナー

夏のギフト・レビュークーポンキャンペーン
参照元:アンリ・シャルパンティエ楽天市場店 様(https://www.rakuten.ne.jp/gold/henri-charpentier/)

内容・制作時間

夏の商品であるゼリーの爽やかさが伝わるような配色にしました。
また、2種類の商品画像を、背景として違和感なく見えるように配置しました。
制作時間:1.6時間

内容・制作時間

ショップで使用されているバナーをアレンジしました。テイストは変えずに、すっきりとしたデザインを心掛けました。金額の表示
制作時間:1.3時間

サムネイル(ECサイト内の商品画像)

スタイ
参照元:MarineBlue 様(https://item.rakuten.co.jp/marine-blue/babys081/)

内容・制作時間

ベビー用品であること、また商品の雰囲気に合わせてパステルカラーを使用。「回して使える」という商品特徴が伝わりやすいよう、矢印をあしらいました。
制作時間:1.5時間

腕時計
参照元:つきのとけいてん 楽天ストア(株式会社ペリオド) 様(https://item.rakuten.co.jp/gryps-/s-mtpvt01l/)

内容・制作時間

ショップ内の他商品のサムネイルとテイストを合わせて制作しました。シンプルでユニセックスな商品を扱うショップのため、装飾を使用せず、すっきりとまとめました。
制作時間:0.5時間

バナー模写

内容・制作時間

Photoshopの操作・バナーの構成習得のため、模写を行いました。文字のジャンプ率や配色、レイアウトに注目しながら制作しました。
制作時間:2.3時間