Internship Blog June 2017

インターンシップ生ブログ

未分類

ワンパターンからの脱出

投稿日:2017年6月26日 更新日:

こんにちは、北野です。
実習15日目です。

パーツ作りをしていると、どうしてもワンパターンになってしまいます。
同じ「お問い合わせ」のパーツでも、違う雰囲気にするにはどうしたらいいのか。
サイトのデザインが変わってしまうようなパーツでは、いくらワンパターンでなくてもデザインとして問題外でしょうし、全体のイメージをそろえつつ違うデザイン。
なかなか難しいです。

文言はパーツによってほぼ決まっているし、フォントも使えるものは使ってしまいました。
文字へのスタイルも、読みやすさを考えるとだいたい一緒になってしまいます。

写真やイラストを入れてみますが、イメージを逸脱しないようにすると、やっぱりなんだか同じよう。

一番面積をとっているのは背景ではありませんか。
今日は、パーツの背景を変えることにしました。

背景にパターンを入れてみる

背景にグラデーションを使ってバリエーションを増やそうと試みていたのですが、もうこればっかり。
次に水玉模様や縞模様などを入れてみることにしました。

Photoshopで四角形をつくり、そこにパターンを入れます。

四角形を選択し、レイヤーから、
スマートオブジェクト→変換
をします。

そのまま
レイヤースタイル→パターンオーバレイ
で任意のパターンを選びます。

このとき、比率を変えるとパターンを細かくしたり大きくしたりできます。

色もここで選びます。
レイヤースタイル→カラーオーバーレイ
で任意の色へ。

細かいパターンにすると、同じ色でも少し違って見える上に使用色と合わなくなることも少ないので、背景にパターンを入れる方法は使えそうです。
パターンが入るだけで、少しバリエーションが増えたような気がします。

枠を作ってみる

リボン

よく見かけるリボンを作ってみました。

Illustratorで四角形と三角形の組み合わせでできます。

曲線のリボンの方がやわらかい感じがでますが、今回は硬い感じで。
リボンにグラデーションをかけて、ゴージャス感はちょっと出してみました。

額のような枠線を作ってみました。

こちらもIllustratorで、四角形と円形の組み合わせでアレンジします。
パスファインダーの、刈り込み、型抜き、交差などを使っていろいろできます。

オブジェクトから、
パス→パスのオフセット
なども使えました。

ブラシパネルのオプションから、
ブラシライブラリを開く→装飾
を選ぶと、いろいろな飾り線がでてきて楽しいです。
ペンツールで描いた線に適合させ、組み合わせれば、アンティーク風な額模様もできました。

背景のパターンと装飾枠で、少しはワンパターンから脱出してみたいです。
ただ、これだけではまだまだ足りないでしょう。
バリエーションを増やすためにも、いろいろなデザインをよく見ることを心がけたいと思います。

-未分類

執筆者:


comment

関連記事

パーツがいっぱい

こんにちは、北野です。 実習7日目です。   今日からは、パーツの作成です。 グローバルナビゲーションや、ボタン、アイコンなどなど、サイトを構成するいろいろなパーツです。   &n …

自己紹介

はじめまして、北野と申します。 本日より、株式会社ふたっぱ様にて実習生としてお世話になります。 実習生といいましても、年季が入っておりまして、サイトってなに?サーバーってなに?と、そもそもからはじめな …

Webサイトを企画する際に考えておきたい4つのP

こんにちは。MIYAです。 実習5日目。本日の実習では、Webサイト企画の考え方について教えていただきました。 そこで、そもそもWebサイトを制作して叶えてようとしていることが、本当にWebサイトが持 …

人物写真をデッサン風に加工する方法

こんにちは。MIYAです。 実習15日目。今週もWebサイトのパーツをゴリゴリ作成しております。 今回は、Photoshopを使って人物写真をデッサン風にアレンジする方法をご紹介します。 ちなみに、も …

ハンコ風にロゴをデザインする方法

こんにちは、MIYAです。 実習9日目。本日もWebサイトのパーツ作成を行っております。 その中で覚えたテクニックがこちら。 ハンコ風にロゴをデザインしてみました。・・・ハンコのように見えますかね!? …