[illustrator]シームレスのボーダーパターンを作る

アニマル柄など、複雑な柄のパターンを自分で作るのはテクニックが必要で難しいのですが、直線のボーダー柄なら簡単に作る事が出来ますので共有します。

今回のポイントは二つ。
■ラインを引く時はshiftを押しながら直線にする
一番下に正方形を配置する(その正方形のサイズに切り取られて登録されます)

【手順】
1)正方形を描きます。(shift+長方形ツール(M))

2)新規レイヤーを作り、そのレイヤーに正方形からはみ出すよう、shiftを押しながら直線にラインを引きます。

3)正方形の線と塗りを消し、透明ボックスにします。
四角形レイヤーの横の○をクリックし、四角形を選択、塗りと線を消します。
(レイヤー横の○をクリックすると、そのレイヤー上のオブジェクトが全て選択されます。)

※パターンの背景を透明にした方が流用できるため塗りも削除していますが、
色を残したい場合は、線だけを削除してください。
参照:【illustrator】汎用的パターンの作り方と簡単登録


4)選択ツールで正方形とライン両方を選択し、スウォッチライブラリにドラッグすると、シームレスのライン登録完了です。



この正方形を一番下に配置する事が最大のポイントで、パターンに登録する際は、一番したの画像サイズにあわせて正方形に切り取られている様です。
試しに、正方形を一番上に持ってきて、ラインを下のレイヤーにすると、別のパターンになってしまいました。

知らなかった時は横にながーーーーいパターン作って対応していたんです。
無駄だったなぁ。あの長さ…

AWWWARDS(アワーズ)

AWWWARDS

ウェブサイトのアワードサイト。日本でもゴメスなどがジャンル別にサイト評価を行っていますが、こちらは評価する人たちが何者かが見えていて、かつ閲覧している一般の方もvoteできる(登録制)ところが特徴。サイトのデザインも非常に洗練されていて、情報デザインが秀逸です。

専門家だけの評価だと、評価する母数が少ないのと、一般の方からみた印象、評価をずいぶん離れた結果になることもしばしば、ですので、バランス的には悪くないんじゃないかと思います。

また、自分のサイトを評価してもらうにはお金がかかるところも変わってますね。このサイトで吊し上げられる(笑)だけだと、15€(ユーロ)=21ドルくらいです。

勇気ある方や企業のご担当者さま、チャレンジしてみては?

AWWWARDSサイトのイメージ

Simon Foster Design

Simon Foster Design

ロンドンで活動を行っているフリーランス・ウェブデザイナーのウェブサイト。
非常に大胆で、シンプルな構成。不要な要素を限りなく排除している点は、ミニマルデザインを目指す方にとっては参考になるのではないでしょうか。中間的明度での無彩色背景が、大きなグラフィカル要素を強調し、テーマパークのサインデザインを思わせるようなアイキャッチがなかなか素晴らしいですね。

Personal Workページのキャプチャ

各ソーシャルアプリへの誘導なんて、こんなんですから(笑)
この潔さ、久しく忘れていた気がします。
※実際に見て頂くと、「潔さ」がより理解できますよ〜。

ソーシャル

[Photoshop]画像縮小時の画像の欠けを回避

Photoshopで画像を縮小すると、特に丸い部分で、画像が切り落とされた様に直線的になる事があります。

これを回避する方法を共有します。

【手順】
1)長方形選択ツールで、充分余白をあけて四角形で囲みます。(囲った線を最後に消すので、余白ある方が消しやすいです)

2)上部メニューから「編集/境界線を描く」を選択し、画像と同レイヤーに四角形を描きます。
この時、縮小した時ラインが消えてしまわない様、少し太めに設定します。



3)四角形を書き込んだ画像を、自由変形(コマンド⌘+T)などで縮小します。

4)縮小後、書き込んだ四角形だけ消します。

なぜか一番外側の画像部分が欠けてしまうので、
ラインで囲って一番外側じゃなくせば、端まできれいにアンチエイリアスが掛かります。

この方法だと、形が複雑な画像を縮小する際も、一番外側の部分が欠けること無く、きれいに縮小できるので、とても有効です。

なお、スマートオブジェクトに変更しないので、一度縮小すると拡大できませんので、ご注意ください。
※スマートオブジェクト:元データを劣化させずに編集が可能。縮小→拡大(元サイズまで)しても画質劣化しないので便利なんです。(でもデータ容量大きくなるけど…)

じじんらめん、です。

じじんらめん最近、芦田愛菜ちゃんのチキンラーメンのCMがかわいくて仕方ありません。別に触発されて対抗心を持ったわけではありませんが、全く新しいコンセプトのキャラクターを考えてみようかと。で、できました。その名も「じじんらめん」。

「じじんらめん」は、背脂ちゃっちゃ系の食べ物を受け付けられないようで、あっさりオンリー。ただ、その性格は意外と「ねちっこい」という噂。

*******************************
じじんらめん スペック

■体長:2cm
■体重:5t
■出身:大阪
■趣味:狩猟

*******************************

2050年から某インスタント食品のメインキャラクターとして採用される予定があるとかないとか。絶対にない。

ヾ(゚Д゚ )ォィォィ

はい、怒られる前にボツ。

[Photoshop]コピー出来ない→レイヤー確認

Photoshopで、任意の範囲を「選択範囲」で囲い、コピー(コマンド⌘+C)、ペースト(コマンド⌘+V)しても、

 「コピー出来ていない」「違う画像がコピーされた」

なんて事がたまにあります。

そんな時は、経験上、次の理由が考えられます。

■レイヤーを複数選択している。(複数レイヤーが選択出来るバージョン)

■レイヤーを全く選択していない。(複数レイヤーが選択出来るバージョンになってから、この現象が発生)

■コピーしたいと思っている画像とは別のレイヤーを選択している。(意外と胃一番多いかも)

つまり、レイヤーを確認すれば、コピーに関するトラブルはほとんど解決するって事かも。

あれ?って思った時、イライラする前に確認してみるといいかもしれませんね。

[illustrator]汎用的パターンの作り方と簡単登録

illustratorでは、簡単にパターンを作成できますが、
登録方法もとても簡単だったので、共有します。

■流用出来るパターンは「背景色透明」

パターンを作る時は、基本パターンの背景色は透明にしています。
これは、photoshopで作るパターンでも同じ。
汎用性がとても高くなります。

好きな色の上にパターンを置けるし、背景をグラデーションにも出来るし。
一つのパターンでいろいろ流用できますね。

■登録はスウォッチライブラリにドラッグで完了!
まずはパターンを作ります。

1)パターン用画像を用意

2)全てを囲むよう、線、塗り無しの透明な四角形を配置

3)パターン用画像と四角形両方を選択し、「スウォッチ」フォルダにドラッグするだけ。

登録しているパターンを編集したい場合は、
「スウォッチ」から画面にドラッグすれば、変更できます。
グループ化されているので、グループ解除して変更してください。

今までは、作ったパターンを上部メニューの「編集/パターン設定」から登録していたのですが、この登録方法を知ってからは、作ったパターンを何度も微調整するなんて作業も苦にならなくなりました。

事務所移転のお知らせ

この度、2011年6月に千葉市のインキュベーション施設を卒業し、事務所を移転することとなりました。

予定より少し早めに引越することになりましたので、直近ですがお知らせいたします。

———————————————————
【新事務所】
〒103-0013
東京都中央区日本橋人形町2-28-5-701
Tel: 03-6661-6644
Fax: 03-3661-0611
———————————————————

これまでは千葉市産業振興財団のもと、インキュベーションマネージャーの方々に様々な教えを賜りながら業務を行って参りましたが、これからはそのような支援もなく、「心機一転」益々気を引き締めていく所存です。

小さな会社ですが、今後ともどうぞよろしくお願いいたします。

[googlemap lat=”35.68719560272628″ lng=”139.7850501537323″ align=”undefined” width=”500px” height=”500px” zoom=”17″ type=”G_NORMAL_MAP”]35.687196,139.78505[/googlemap]

[Photoshop]レイヤー効果をマウスで調整

レイヤー効果の位置や角度は、マウスで操作できます。

1)レイヤー効果ウィンドウ(レイヤースタイル)で、変更したいスタイルを左メニューから選択し、スタイルの設定画面を表示させます。
(ドロップシャドウを変更したければドロップシャドウの設定画面を、パターンオーバーレイならパターンオーバーレイの設定画面を表示させておくこと。)

2)効果ウィンドウを表示させたまま、マウスで画面上をドラッグすると、角度や位置の設定がある効果は、位置や角度が変更できます。

例えば、ドロップシャドウの場合。

レイヤー効果のドロップシャドウ設定画面を表示させ影部分をマウスでドラッグすると、変更出来ます。

【注意】
ドロップシャドウの位置などは、「包括光源」にチェックが入っていると、PC上で「包括光源」にチェックが入っている全ての影の向きが変わってしまうため注意が必要です。

関連記事:[Photoshop]レイヤー効果の注意点(包括光源)

実際はドロップシャドウにはほとんど使用しません。

■パターンオーバーレイの位置調整で大活躍

この機能が一番役立つのは、パターンオーバーレイでの柄調整です。
柄が途中で切れている部分などは、視覚的にマウスで微調整できるため、とても便利です。