DESIGN IT YOURSELF.

BUROKI


top

design

  • top
  • design
  • よりオリジナリティを引き立てる。ステンシルのアイコンデザイン

よりオリジナリティを引き立てる。ステンシルのアイコンデザイン

graphic

  • top
  • design
  • よりオリジナリティを引き立てる。ステンシルのアイコンデザイン

よりオリジナリティを引き立てる。ステンシルのアイコンデザイン

2020.09.08.

スポンサーリンク

スポンサーリンク

またまた先月公開したwebサイト「ナノナノファクトリー」の制作関連の実績になるのですが・・。

ナノさんのwebサイト制作実績にも書いた通り、木工や木材へのレーザー加工を中心としたサービスを展開されているクライアントさまなので、「木工、手づくり感と工房感」を伝えられるようなサイトデザインを心がけて制作しました。

webサイトをつくっていく上でアイコンを用いることは訪問ユーザーを迷わせない、視覚的に伝えやすいといったメリットがあり、現代のwebサイトには欠かせないものになっています。

ですが、ボクは同じ意味を持つアイコンであったとしてもいろんなwebサイトで使い回すようなことは絶対にしません。アイコンひとつのデザインですらデザイン面からのブランディングに貢献できるはず・・。そんな考えからwebサイトを制作する毎にアイコンのデザインもすべてイチから制作させていただいています。

アイコンももちろんコンセプトに合わせたものをデザインする

各サービスを紹介するページの制作時にアイコンが必要になったので、まずはそのサービスを伝えるために、比較的わかりやすいイメージでアイコンを制作します。下記の画像は「看板・サイン制作サービス」を承っていることを伝えるために制作したアイコンです。

まずは看板のアイコンを制作(写真左)。木工なので立て看板のイメージでできるだけクセを省きながら誰でもわかるような形を意識してつくります。

左のアイコンからナノナノファクトリー用にオリジナリティを出すには、「木工や手作り、工房」というキーワードをヒントにどのような加工を施すことがいいのかを導き出します。今回は木工と馴染みの深いステンシル調の加工を施すことにしました。

ステンシルアイコン制作ステップその1
ステンシル調に加工する

ステンシルは基本的に文字をシートに転写し、カッターでシートを文字の形にカットし、スプレーや塗料をくり抜いたシート越しに塗装することで味のある加工を施すことができる技法です。

文字をくり抜くので、「O」や「4」などをそのままくり抜いてしまうと文字の中のスペースがなくなってしまうので、文字をカットしてくり抜けるようにする必要があります。この立て看板のアイコンは2箇所くり抜けないスペースがあるので、アイコンをそれぞれカットしました。ひとまずステンシル調のアイコンができました。

ステンシルアイコンをさらに加工する

このままでも充分オリジナリティのあるアイコンにはなっていますが、もう少しオリジナリティを出したい。

木材に文字やマークのレーザー加工を施した場合、マークの周辺に少し焦げたようなにじみができるんですね。そのにじみを少しでも表現できないか?と考え、アイコンの線も少し加工し、「にじみ」を表現することにしました。

ステンシルアイコン制作ステップその2
レーザー加工っぽく線を揺らす加工をする

グラフィックソフトのillustrator(イラストレーター)にてラフ加工と角を丸くする加工を施し、レーザー加工の風合いに少しでも近づけたアイコンが完成しました。

ひとつアイコンができたら他のアイコンも加工を合わせて、統一感を出すことを意識しつつ制作していきます。線の太さやサイズ感を全体的に合わせながらつくるとよりアイコンのデザインに統一感を出すことができます。

スポンサーリンク

BUROKI写真

BUROKI写真

はじめましてBUROKIです。

ベンチャー企業にて11年間webやグラフィックデザインとブランディング経験を経て、2019年5月よりフリーランスデザイナーになりました。完全独学でフリーランスになった異色の経歴の持ち主だと思います(笑)

制作実績やインハウスデザイナーのことなど日々更新しています。デザイン制作のご依頼やお問い合わせなども受け付けてますので、なんでもお気軽にご相談ください。

ベンチャー企業でマスターデザイナーとして働いた後、フリーランスになりました。制作実績やインハウスデザイナーのことなど日々更新しています。制作のご依頼なども受け付けてますので、なんでもお気軽にご相談ください。

ご依頼・お問い合わせ

ご依頼・お問い合わせ

related contents

関連コンテンツ一覧
スポンサーリンク

文鳥とデザイナー

スポンサーリンク

design list

デザイン作品一覧

graphic

学校法人様向けに制作した展示会用A1ポスターデザイン

制作したのは2013年ごろだったと思いますが、今でもボクが「いいデザインしたな」と思えるポスターデザインを久しぶりに発掘したので制作実績として…

2021.04.17.

goods

のぼり刃物店さんの手ぬぐいデザイン。職人さんが使うことを想定して制作しました

少し前にのぼり刃物店さんの50周年ロゴデザインを紹介しました。 創業50周年を祝う。のぼり刃物店さんの周年ロゴデザイン この時にステッカーを制作…

2021.04.07.

graphic

トンマナを意識し明るい印象を与える。TBSラジオさんの媒体資料デザイン

日本で一番リスナーが多いラジオ局である「TBSラジオ」さん。 おそらく名前を聞いたことがないという人はほとんどいないと思います。 そんなTBSラジ…

2021.04.03.

logo

創業50周年を祝う。のぼり刃物店さんの周年ロゴデザイン

昨年はECサイトを制作させていただき、2019年にフリーランスになってからいろんな制作物をお任せくださっている「のぼり刃物店」さん。 のぼり刃物店…

2021.03.28.

graphic

よりオリジナリティを引き立てる。ビスケット風タイポグラフィデザイン

先日実績として紹介させてもらった「びすけっと保育園」のwebサイト。 梅田ディアモールで開催されたDIA CONNECT(ディアコネクト)のロゴデザイン w…

2021.03.06.

web

やわらかい雰囲気で伝える。びすけっと保育園のwebデザイン

2021年の一番はじめのwebサイト制作実績となります。 昨年末にお話をいただき、2月10日に無事公開となった「企業主導型保育園 びすけっと東戸塚」。…

2021.02.26.

designをもっと見る

制作のご相談・お問い合わせはフォームから

デザインのご依頼や予算のご相談、お問い合わせなどお気軽にお問い合わせください。
また、書いてほしいブログのリクエストやファンレター(笑)もお待ちしております。

問い合わせフォームはこちら

topトップページ

aboutブロキについて

designデザイン

voiceお客さまの声

blogブログ

films制作動画

cassetteカセットテープ

snsソーシャル