以前にブログ内でホームページを作るのには写真と文章が必要と書きましたが一つ忘れているものがありました。
イラストやアイコンです。
他にもブログなどで文章だけだと説明不足なときや長文だと読むのに疲れてしまうので変化をつける意味でイラストを差し込んでいきます。
イラスト、シルエット、アイコン、ロゴなど呼び方は様々ですが、WEB上に無料素材があふれていてそれぞれおススメサイト一覧などのブログも情報もあります。
検索でイラスト、シルエット、アイコン、模様にスペースを空けて無料と入れば自分で作らなくもある程度見つかります。
ただ、イメージするものとピッタリのものは見つからないことが多い事と他との差別化の意味でも自分で作った方が方がいいです。
指輪に使う模様やレーザー刻印のデータを作るためのCADの操作の練習も兼ねてライノセラスで作ってJPEGにしています。
まずはホームページで使うイラストの作り方です。
描くことに関してはどのソフトでもいいですし、本もWEB上に方法も多数あるのでどんなデザインにするかなど考え方を中心に説明していきます。
まずイラストですが、極力シンプルでアイコンのような形で色は2色で作ります。
色を足したり、複雑にするのはいくらでもできます。
理由は
・作るのが簡単
・短時間で作れる
・流行に左右されない
・組み合わせて使う時も
ゴチャゴチャしない
からです。
具体的には説明します。
写真だと画面がうるさい事があります。
例えば最初、ホームページのTOPでは特典、アフターフォローについては上の画像を使ってリングケース、刻印、サイズ直し、新品仕上げの4つが付くことを1枚の写真で説明できるようにしていました。
ただ、写真に統一感がないのでなんとなく収まりが悪くなっています。
別角度の写真や
イラスト+写真+文字なども試してみました。
お客様の気を引きそうなお洒落に見える写真も思いつかず、最終的にできあがったのが、
このイラストです。
画面を4分割して、一つにまとめています。
一度このテイストで作ると統一感を出すため今後もこれと同じように作ることになります。
作り方ですが、まず他のサイトをよく見ます。
このサイトも無料でダウンロードできます。
幸い無料サイトがあるので使えそうな画像をダウンロードします。
その画像を参考にとにかく「どこまでシンプルにできるか」で作っていきます。
画像は参考にダウンロードしたフリー素材のケースに入った結婚指輪と婚約指輪です。
指輪で例えると地金を何種類も使ったり、色石をたくさん入れて個性的にすればするほど上手くバランスをとらないと野暮ったくなります。
一方、シンプルな甲丸の結婚指輪は流行にも左右されず、重ねつけなどにも向いています。
イラストを作るデザイナーのように経験と知識があるわけでもないのでバランスが悪くならないようにとにかくシンプルにします。
画像のように正方形のマス目があるのでその上でスケッチしています。
CADには輪郭、レンダリング、ペン画などボタン一つで表示切替の機能があるのでそれも生かします。
画像を見た人にも文字の説明がなくても分かってもらえる絵を見て分かるようなデザインを考えます。
修理のイラストを8個作ってみました。
時間短縮のために指輪を一つ作ってコピペして作り替えます。
左が加工前や加工途中、右が加工後の画像で右向きの三角形が左から右に変化したことを表しています。
サイズ直しは指輪の真下を切って同じ幅でラインを2本だと分かりにくい気がしたので地金を挟んで伸ばしたことがわかるイラストにしました。
新品仕上げは使っていて傷がついている状態を真円の外側に凹み、仕上げ終わると光るので指輪の周りに光の効果を
刻印は指輪の下半分に20××、11、22(20××年、いい夫婦の日)という文字を入れて刻印が入っていることを表しました。
指輪を置いたときに正面から見たイラストも考えましたが、指輪だと分かりにくそうなのでサイズ直し、新品仕上げと同様に上から見たイラストにしました。
修理のアイコンは同じ考え方でメッキ、石留め、チェーン修理、糸替え、パーツ溶接なども作りました。
この考え方で今後使いそうな結婚指輪と婚約指輪も作りました。
婚約指輪はダイヤモンドが入るのでアウトラインの取り方で3つほど考えました。
ホームページで使う結婚指輪のイラストも考えました。
画像は無料ダウンロードを組み合わせて作っています。
1、エクセル内で画像を配置、
2、スクリーンショットで撮影
3、画像修正ソフトで編集
という手順で作っています。
お店のロゴのようにグレー地に白抜きではどうだろうか考えて背景をダークグレーでイラストを白にしてみました。
このように
・色を反転させる
・文字を合わせる
・イラストを組み合わせる
などで試行錯誤していきます。
こういったイラストも「ルール」というかテイストを揃えた方がホームページの統一感が出ることに気が付いたので少しずつ修正していこうと思っています。
前の記事 | > View More |
次の記事 | > View More |
職人向け 記事一覧 | > View More |