From d780ee4081eda7120c7487b42755b19778c8e88b Mon Sep 17 00:00:00 2001 From: "James R. Cogley" Date: Sun, 10 Nov 2024 10:36:09 +0900 Subject: [PATCH] deno fmt tidyup --- src/showcase/fire-extinguisher_flyer.vto | 76 +++++++++------ .../kanshin-breaker-shikyuu_flyer.vto | 73 ++++++++------ src/showcase/kanshin-breaker_flyer.vto | 95 ++++++++++++------- 3 files changed, 155 insertions(+), 89 deletions(-) diff --git a/src/showcase/fire-extinguisher_flyer.vto b/src/showcase/fire-extinguisher_flyer.vto index e30123f..ce81922 100644 --- a/src/showcase/fire-extinguisher_flyer.vto +++ b/src/showcase/fire-extinguisher_flyer.vto @@ -12,20 +12,28 @@ metas:
- thumbnail -
+ thumbnail +
- work/大田区役所

+ work/大田区役所 +
+

家庭用消火器のあっせんチラシ

- 現職の仕事で、家庭用消火器のあっせんチラシを制作しました。
+ 現職の仕事で、家庭用消火器のあっせんチラシを制作しました。

- 担当:　企画→情報設計→デザイン
- 期間:　2週間(2024.7)
- ソフト:　Figma

+ 担当:　企画→情報設計→デザイン
+ 期間:　2週間(2024.7)
+ ソフト:　Figma
+

更新: 2024年09月28日

@@ -35,7 +43,7 @@ metas: (1)デザインコンセプト - 『インパクト×事業内容が伝わるチラシ』 + 『インパクト×事業内容が伝わるチラシ』
@@ -43,20 +51,25 @@ metas: (2)制作経緯

- ▼背景
- ・新規で消火器のあっせん事業を開始。このあっせん事業を活用することで、対象者は消火器を安く購入できる。
+ ▼背景
+ ・新規で消火器のあっせん事業を開始。このあっせん事業を活用することで、対象者は消火器を安く購入できる。
・事業開始に伴い、チラシを制作することに。 -

- ▼課題
- ・新規の事業であるため、事業の存在自体が浸透していない。
+
+
+ ▼課題
+ ・新規の事業であるため、事業の存在自体が浸透していない。
・消火器の購入を促すためには、事業内容だけではなく、『家庭用消火器を備えることの重要性』も押し出す必要がある。 -

- ▼方針
- ・事業の存在をアピールするために、インパクトのあるデザインにする。
- ・事業内容や事業のターゲットが誰なのか明確に伝える。
+
+
+ ▼方針
+ ・事業の存在をアピールするために、インパクトのあるデザインにする。
+ ・事業内容や事業のターゲットが誰なのか明確に伝える。
・『家庭用消火器を備えることの重要性』を短い言葉で表現する。 -

-

+
+
+

@@ -64,22 +77,29 @@ metas:

- ▼インパクト
+ ▼インパクト +
三角形を配置して画面を２分割し、シンプルかつインパクトのある構図を実現しました。 -

+
+
- ▼消火器らしさ
- 消火器に関係するチラシだと伝えため、三角形にグラデーションをかけて、消火器から消化液が噴射されている様子を表現しました。

+ ▼消火器らしさ +
+ 消火器に関係するチラシだと伝えため、三角形にグラデーションをかけて、消火器から消化液が噴射されている様子を表現しました。
+
- ▼情報設計
+ ▼情報設計 +
上半分、下半分、三角形の内側に情報を配置して、事業内容やターゲットが誰なのか一目で伝わるデザインに。 -

+
+
- ▼キャッチコピー
- 『「もしも」のために、「いま」、備えよう。』という言葉を使い、いつ起こるかわからない災害のためにいま対策しようというメッセージを込めました。 + ▼キャッチコピー +
+ 『「もしも」のために、「いま」、備えよう。』という言葉を使い、いつ起こるかわからない災害のためにいま対策しようというメッセージを込めました。

- diff --git a/src/showcase/kanshin-breaker-shikyuu_flyer.vto b/src/showcase/kanshin-breaker-shikyuu_flyer.vto index 13fc10e..c382524 100644 --- a/src/showcase/kanshin-breaker-shikyuu_flyer.vto +++ b/src/showcase/kanshin-breaker-shikyuu_flyer.vto @@ -12,20 +12,29 @@ metas:
- thumbnail + thumbnail
- work/大田区役所

+ work/大田区役所 +
+

感震ブレーカーの無料支給チラシ

- 現職の仕事で、感震ブレーカーの無料支給事業に関するチラシを制作しました。
-

- 担当:　企画→情報設計→デザイン
- 期間:　1週間(2024.6)
- ソフト:　Figma

+ 現職の仕事で、感震ブレーカーの無料支給事業に関するチラシを制作しました。
+

+ 担当:　企画→情報設計→デザイン
+ 期間:　1週間(2024.6)
+ ソフト:　Figma
+

更新: 2024年09月28日

@@ -43,18 +52,21 @@ metas: (2)制作経緯

- ▼背景
- ・感震ブレーカーを無料支給する事業に従事。
- ・当年度から事業の対象者が拡大。
+ ▼背景
+ ・感震ブレーカーを無料支給する事業に従事。
+ ・当年度から事業の対象者が拡大。
・新たなターゲットに向けたチラシを制作。 -

- ▼課題
+
+
+ ▼課題
・新たに対象者となった層は、感震ブレーカーという器具や事業について知らない可能性が高い。 -

- ▼方針
- ・事業について知るきっかけとなるようなデザインに。
+
+
+ ▼方針
+ ・事業について知るきっかけとなるようなデザインに。
・行政目線ではなくターゲット目線で情報設計をする。 -

+
+

@@ -63,20 +75,27 @@ metas:

- ▼情報の強弱
- 「まずは名前を覚えてもらう」ことを目標に、感震ブレーカーというキーワードを一番に強調しました。 -

+ ▼情報の強弱 +
+ 「まずは名前を覚えてもらう」ことを目標に、感震ブレーカーというキーワードを一番に強調しました。 +
+
- ▼ユーザー目線
- 「事業の対象者が拡充しました」等、行政目線の表現を使わないようにしました。
- 「感震ブレーカー、知っていますか?」とターゲットに問いかけることで、事業を身近に感じてもらい、自分事として捉えてもらえるよう工夫しました。

+ ▼ユーザー目線 +
+ 「事業の対象者が拡充しました」等、行政目線の表現を使わないようにしました。
+ 「感震ブレーカー、知っていますか?」とターゲットに問いかけることで、事業を身近に感じてもらい、自分事として捉えてもらえるよう工夫しました。
+
- ▼地震や揺れのイメージ
- 感震ブレーカーは、地震の揺れを感知して電気を自動で遮断する器具です。
- 感震ブレーカーの機能がイメージできるよう、背景に薄く同心円を配置し、「地震の揺れ」を想起させるデザインにしました。 -

+ ▼地震や揺れのイメージ +
+ 感震ブレーカーは、地震の揺れを感知して電気を自動で遮断する器具です。
+ 感震ブレーカーの機能がイメージできるよう、背景に薄く同心円を配置し、「地震の揺れ」を想起させるデザインにしました。 +

- diff --git a/src/showcase/kanshin-breaker_flyer.vto b/src/showcase/kanshin-breaker_flyer.vto index cf409e7..7aee385 100644 --- a/src/showcase/kanshin-breaker_flyer.vto +++ b/src/showcase/kanshin-breaker_flyer.vto @@ -12,22 +12,36 @@ metas:
- thumbnail - thumbnail + thumbnail + thumbnail
- work/大田区役所

+ work/大田区役所 +
+

感震ブレーカーの普及啓発チラシ

- 現職の仕事で、防災用品「感震ブレーカー」のチラシを制作しました。
- 感震ブレーカーとは、分電盤に取り付けて、設定値以上の揺れを感知すると自動で電気を止める器具です。
+ 現職の仕事で、防災用品「感震ブレーカー」のチラシを制作しました。
+ 感震ブレーカーとは、分電盤に取り付けて、設定値以上の揺れを感知すると自動で電気を止める器具です。

- 担当:　企画→情報設計→デザイン
- 期間:　1週間(2024.8)
- ソフト:　Figma

+ 担当:　企画→情報設計→デザイン
+ 期間:　1週間(2024.8)
+ ソフト:　Figma
+

更新: 2024年09月28日

@@ -37,7 +51,7 @@ metas: (1)デザインコンセプト - 『一目で感震ブレーカーの機能が伝わるチラシ』 + 『一目で感震ブレーカーの機能が伝わるチラシ』
@@ -45,20 +59,23 @@ metas: (2)制作経緯

- ▼背景
- ・急遽、１週間後までにチラシのデザイン・印刷まで対応することに。
-
- ▼課題
- ・短い納期でチラシを制作する必要がある。
- ・旧バージョンのチラシは情報が整理されておらず、一目で感震ブレーカーのチラシだと分からない。
-
- ▼方針
- ・タイトスケジュールだからこそ、細かいスケジュールを立てて「何をいつまでに」を明確にする。
- ・ぱっと目をひき、感震ブレーカーだ！とわかるデザインにする。
- ・チラシが見られる場面を想定して制作する。
+ ▼背景
+ ・急遽、１週間後までにチラシのデザイン・印刷まで対応することに。
+
+ ▼課題
+ ・短い納期でチラシを制作する必要がある。
+ ・旧バージョンのチラシは情報が整理されておらず、一目で感震ブレーカーのチラシだと分からない。
+
+ ▼方針
+ ・タイトスケジュールだからこそ、細かいスケジュールを立てて「何をいつまでに」を明確にする。
+ ・ぱっと目をひき、感震ブレーカーだ！とわかるデザインにする。
+ ・チラシが見られる場面を想定して制作する。
・情報の取捨選択を行い、必要な情報が伝わるチラシにする。 -

-

+
+
+

@@ -68,25 +85,35 @@ metas:

- ▼「電気」や「ブレーカー」のイメージ
- 「ブレーカー」「配電盤」「制御盤」「分電盤」を表す電気図面記号をデザインに取り入れて、
- 電気やブレーカーのイメージが視覚的に伝わるようにしました。

+ ▼「電気」や「ブレーカー」のイメージ +
+ 「ブレーカー」「配電盤」「制御盤」「分電盤」を表す電気図面記号をデザインに取り入れて、
+ 電気やブレーカーのイメージが視覚的に伝わるようにしました。
+
- ▼洗練された印象
+ ▼洗練された印象 +
敢えて写真を使わず、色数もシンプルにまとめることで「役所っぽいデザイン」からの脱却に挑戦しました。 -

+
+
- ▼場面を想定したデザイン
- このチラシは、印刷して役所窓口前のラックに配置する予定でした。ラックに配置すると、チラシの下側は隠れしまいます。
- このため、上3分の1に最も伝えたい情報(=感震ブレーカーの機能)を入れました。

+ ▼場面を想定したデザイン +
+ このチラシは、印刷して役所窓口前のラックに配置する予定でした。ラックに配置すると、チラシの下側は隠れしまいます。
+ このため、上3分の1に最も伝えたい情報(=感震ブレーカーの機能)を入れました。
+
- ▼見やすさ
+ ▼見やすさ +
役所には、老若男女、様々な方がいらっしゃいます。 - 誰でも読みやすいチラシにするため、強調したい部分の文字サイズは14pt以上、大きめにしました。
- フォントは、読みやすいZEN角ゴシックを使用しました。
+ 誰でも読みやすいチラシにするため、強調したい部分の文字サイズは14pt以上、大きめにしました。
+ フォントは、読みやすいZEN角ゴシックを使用しました。

-