KEN WEB BLOG ~WEB・DTPスクール パソコン教室 KENスクールのインストラクターがつづるブログ~

【こちらの記事は、約7分程でお読みいただけます。】

Webブログをご覧のみなさま、こんにちは！

サイト制作や作品制作の際、皆さんお悩みになるのは、
やはり「色作り」「色の組み合わせ」ではないでしょうか？

「ピンクを使って、可愛くしてみよう！」とか、
「ブルーでカッコよくしよう！」と思っても、いざ制作してみたら、
「こんなイメージじゃなかったんだけどなぁ...。」
なんてこともあるのではないのでしょうか。

今回は、「自然から色を学ぼう！」ということで、
花や草など、自然にあるものから色作りを、学びたいと思います。

例えば、バラの花を観察してみましょう。

この写真のバラの色を、一言で言ってしまえば「ピンク」なのですが、
花びらには「ビビットなピンク色」から「淡い白のようなピンク色」まで、
いろんなピンクがあることがわかります。

色の観察が終わったところで、
今度は、このバラの写真から、色を取ってきてみましょう。

Photoshopで、写真の画像を開きます。
そして、カラーピッカーを開きましょう。

そしてカラーピッカーで、花びら部分の色と取ってみましょう。

そのまま「スウォッチに追加」ボタンを押します。

まず、「ビビットなピンク」色を取りました。
同じ要領で、他の花びらの部分からも色を取ります。

今回は、５か所から色を取ってみました。
さて、スウォッチを見てみると...

先ほど、カラーピッカーで取ってきた色が、
スウォッチに追加されています。

あとはこの色を使って、作品制作に活かしてみましょう！

例えば、この色の組み合わせからグラデーションを作ってみると...

このような感じになります。
さらに、このグラデーションを使って、ボタンを作ってみます。

上が、今回作ったグラデーションを使用して作成したボタン、
下が、ビビットピンクと白の２色で作成したボタンです。

同じビビットピンクを使ったグラデーションでも、
上のボタンの方が、質感がぐっと上がって
素人っぽさが抜けたと思います。

初めて「色の組み合わせ」を経験する時は、
スウォッチに最初からある色を選びがちですが、
今回ご紹介したように、「自然の中にある色」を取ってきて、
作品に活用する方法もありますので、是非試してみてくださいね！

私のオススメは、お花のブーケから色の組み合わせを勉強する方法です。
フラワーショップの店頭に並んでいるブーケは、
色の組み合わせを考えて作られているものなので、
元々、色に一定のまとまりがあります。

ですので、今回の方法で色を取っても、まとまりがでるので、
色の組み合わせを勉強するには、非常に良い題材だと思います！

お花を買ったら、まずデジカメなどで撮影して写真を残し、
それから、お部屋に飾って楽しめる...一石二鳥のお勉強方法でした！

--------------------------------------------------------------------------------

現場のデザイナーも通うKENスクールで、あなたもデザインスキルを磨きませんか？？

⇒【「極」グラフィックPro講座】
「デザイン」と「アート」、その違いを考えることからスタート！
レイアウトや色彩・文字などの基礎知識はもちろん、Photoshopと
Illustratorを自在に扱い、極められるように指導します！

本日の更新者：
パソコンスクール KENスクール Web/DTPデザインコース
インストラクター 前田

【こちらの記事は、約6分程でお読みいただけます。】

Webブログを見てくださっている皆さん、こんにちは！

写真加工で頻繁におこなう合成写真。
Photoshopを使用して、合成写真を作ってみたのはいいけれど、
どこか不自然・・・。

このようなご経験ありませんか？

たとえば下のような写真 ↓↓

茶色のワンちゃんが不自然ですね。
この不自然さを修正してみたいと思います。

実は、ちょっとした知識で改善されます。
合成写真をよりリアルに魅せる方法を今回はご紹介します＾＾

まずは「遠近法」です。
透視法とも言うのですが、ルネサンス期からある絵画の表現方法です。

平面作品で、実際に目で見るのと同じような遠近感が現れるように、
構造物などを描く方法です。

ポイントは「消失点」を見つけることです。
「消失点」という言葉はなじみのない言葉ですね。

たとえば、下の写真のように
道路には二本の線がまっすぐ平行に走っていますよね。

ですが、遠くにいくにしたがって二本は間隔が狭まり、
しだいに一つに交わったかのように見えます。
その交わった点が「消失点」と呼ばれるものです。

「消失点」を見つけられれば、「消失点」から線をのばして、
現実に見える歪みを正しく表現できます。

さらに、遠近法には「空気遠近法」という技法があります。
これは、遠くに行けば行くほど霞（かす）んで見えるというものです。
上記の写真も遠くに写っている山は霞んでいます。

もうひとつが光の当たり方です。
人物や建物には必ず光が当たります。

光が当たるということは、影になる部分があります。
それがチグハグになっていると、不自然な写真になってしまいます。

下の写真では、一つだけ光の当たり方が違いますね。

では、先程の写真を
遠近法、光の当たり方に気を付けて、修正してみました。

修正点として…

・遠近感を意識して、大きさを調整します。

・光が当たっている方向を考えて、ワンちゃんに影をつけます。

・光の方向を意識し、他の被写体と違和感がないように床に影をつけます。

・他の被写体と比較した上で、若干のぼかしも適用しています。

ちょっとしたことではあるのですが、
上記のことに気をかけるだけで、合成写真は飛躍的にリアルになります！

是非、あなたもお持ちの写真を使って、試してみてくださいね＾＾

--------------------------------------------------------------------------------

現役デザイナーが直接マンツーマン指導！
KENスクールで、あなたも一からデザインスキルを磨きませんか？？

⇒【Photoshop（フォトショップ）講座】
グラフィックデザインを作成する際には欠かせないソフト、
Photoshopの操作をしっかり学習する講座です。
写真の補正、合成など課題を通して多種多様な制作を行います。
使えば使うほど楽しくなるのが、授業内で実感できます。

本日の更新者：
パソコンスクール KENスクール Web/DTPデザインコース
インストラクター 木村

【こちらの記事は、約4分程でお読みいただけます。】

皆さん、こんにちは！
GWも本日でいったん終わりとなりますね！

今年も、たくさんの受講生の方々にご来校いただきました。
この場を借りてお礼申し上げます。ありがとうございました＾＾
そして、お休みなのに、皆さん頑張りましたね！！

まだ連休が続く方も、ぜひお時間見つけて教室に勉強しに来てくださいね！

さて、この大型連休中に溜まってた制作を・・・ということで、
作品創りに励む生徒さんも、結構いらっしゃいました。

中でも最近、「木目」調のデザインの作り方を聞かれることが結構ありますので、
今回は、その作り方をご案内したいと思います。＾＾

それでは、Photoshopで「640px × 480px」の新規ファイルを作成します。

レイヤーパネルから「新規レイヤーを作成」を選び、
レイヤーを作成します。

描画色を黒、背景色を白に設定し、
「フィルター」→「描画」→「雲模様1」を選びます。

続けて、
「フィルター」→「描画」→「ファイバー」を選びます。
設定は初期設定のままで構いません。

「イメージ」メニュー→「色調補正」→「色相・彩度」を選び、
「色彩の統一」にチェックをいれ、
下記を参考に茶色にします。



「色相」でスライダーを動かすといろんな色の
木目を作ることができるのでぜひお試しください。

木目はこれで完成です。

テキストと合わせるとメニューやバナー、
ロゴなど作れます。

ぜひ、ウッドな雰囲気を出すのにご活用くださいね！＾＾

--------------------------------------------------------------------------------

現場のデザイナーも通うKENスクールで、あなたもデザインスキルを磨きませんか？？

⇒【「極」Professionalグラフィック講座】
「デザイン」と「アート」、その違いを考えることからスタート！
レイアウトや色彩・文字などの基礎知識はもちろん、Photoshopと
Illustratorを自在に扱い、極められるように指導します！

本日の更新者：
パソコンスクール KENスクール Web/DTPデザインコース
インストラクター 藤澤

【こちらの記事は、約5分程でお読みいただけます。】

皆さん、こんにちは！
GPGPU（General Purpose GPU）という言葉を聞いたことがあるでしょうか？

これは、今までグラフィック処理を行なっていたGPU（Graphics Processing Unit）
を他の目的で利用しましょうという試みです。

大手GPU開発メーカーのNVIDIAとATIではそれぞれ、
「CUDA」「ATI Stream」という名称で開発が進められています。
この機能に対応しているソフトウェアを利用することにより、
さまざまな処理に掛かる時間を大幅に短縮することができます。

これは、主に動画のエンコードに効果を発揮し、
今までは、CPUのみで行っていた処理をGPUと併用することにより、
時間短縮・負荷軽減させる事が可能となりました。

エンコードの処理速度を上げようと考えたとき、
これまではCPUを換装する程度の選択肢だったところ、
ビデオカードを変えるだけで大幅なパワーアップを狙えます。

Adobe社製ソフトウェアでは、
■Premiere Pro CS4以降
■After Effects CS4以降
■Photoshop CS4以降
の3つが主にNVIDIA「CUDA」に対応しています。

また、Photoshop CS4/CS5では、3D描画を拡張する機能「OpenGL」にも
対応しており、2D/3D処理のパフォーマンス改善が期待できます。

OpenGLは一昔前のハイエンドビデオカードのみの対応でしたが、
近年では、ミドルレンジ製品にも対応が広がっています。
 

それでは、Photoshop CS5でOpenGLを有効にする方法をご紹介します。
 

「編集メニュー」を選択

「環境設定」を選択

「パフォーマンス」を選択

【OpenGL描画を有効にする】　のチェックを入れます。

※このオプションが無効にいる場合は、お使いのビデオカードが
OpenGLに対応していない、またはビデオカードのドライバが古いためです。

この機能を有効にすることにより、
ズーム・手のひらツールのスムース表示、カンバスの回転、など複数の機能を
拡張することが可能となります。
標準設定よりも驚くほど動きの違いを体感できます！

拡張機能の詳細はAdobeのサポートサイトをご確認ください。
http://kb2.adobe.com/jp/cps/234/234358.html#anc_b

制作環境のパワーアップを検討している方は、
こういったアプローチも検討してみてはいかがでしょうか！

--------------------------------------------------------------------------------

現役デザイナーが直接マンツーマン指導！
KENスクールで、あなたも一からデザインスキルを磨きませんか？？

⇒【Photoshop（フォトショップ）講座】
グラフィックデザインを作成する際には欠かせないソフト、
Photoshopの操作をしっかり学習する講座です。
写真の補正、合成など課題を通して多種多様な制作を行います。
使えば使うほど楽しくなるのが、授業内で実感できます。
 

本日の更新者：
パソコンスクール KENスクール Web/DTPデザインコース
インストラクター 野村

【こちらの記事は、約4分程でお読みいただけます。】

WEB制作をする上で、大事なスキルの一つとして、
「スピード」が挙げられます。

「あの作業をもっと早くしたい！！」と思っても、
改善できずに続けてしまっている場合もあると思います。

そこで、WEB制作がもっと楽になる操作テクニックとして、
今回は選択範囲をとったり、拡大縮小したり、画像編集などで手間がかかることが多い
「Photoshop」のテクニックをご紹介します！＾＾

1、ウインドウを二枚使って、楽～♪に作業

ある写真の全体を見ながら、拡大縮小して作業したいときは、
【ウインドウ】→【アレンジ】→【○○（ファイル名）の新規ウインドウ】




このように、一つの写真で二枚のウインドウで作業できます。
これで細部の調整をしながら、全体の仕上がり具合を確認できますね。

2、レイヤーを残したまま、表示レイヤーを統合して楽～♪に作業

Photoshopで作業していると、レイヤーの数がどんどん増えてきて、
作業が楽に出来なくなってきます。

たとえば、同時に複数のレイヤーを選択しなければならなかったり、
グループ化する必要が出てきたりします。


レイヤーを統合してしまえばいい、という話ですが、
そうすると、後で作業のやり直しが出来なくなってしまい、不便です。

そこで楽なのが、新しいレイヤーに
「表示部分をスタンプ」してしまおう、という方法です。

たとえば、こんな感じにレイヤーがたくさんあったとします。




ショートカットキー「Ctrl」+「Shift」+「Alt」+「E」を押すと・・・

このような感じで、新しいレイヤーに統合したものを作ってくれます。

画像編集の基本は、「簡単にやり直せるようにする」ことです。

レイヤーが増えてきたら、表示部分をスタンプするようにして、
楽に作業するような配慮をしていきましょう！

--------------------------------------------------------------------------------

現役デザイナーが直接マンツーマン指導！
KENスクールで、あなたも一からデザインスキルを磨きませんか？？

⇒【Photoshop（フォトショップ）講座】
どんな写真でも、より「魅せる」ためには多少の
写真加工は必須となります。
既存の画像に特殊効果を施したり編集したりする際、
Photoshopはメインで使われます。デザイン業界で
仕事をしたい方に向けて、必須の機能を網羅した講座です。

本日の更新者：
パソコンスクール KENスクール Web/DTPデザインコース
インストラクター 木村

2011年へのカウントダウンも始まりましたね。
 

でもまだクリスマスという大イベントがあるので楽しみましょう。

クリスマスということで

フォトショップでクリスマスらしいものを作ってみました。

まずはクリスマスカラーでパターンを作成します。

サイズ「50px×50px」を作成します。
 

レイヤーを新規作成し、グリーン系の色で塗ります。

（背景レイヤーは削除して大丈夫です）
 

選択範囲を使い、赤と黄色でラインを作ります。
 

メニューから「編集」メニュー-「パターンを定義」でパターンを登録します。

ファイルを新規作成し、登録したパターンで

メニューから 「編集」メニュー-「塗りつぶし」で塗りつぶします。

床と壁面にレイヤーを分けます。
 

パターンで塗りつぶしたレイヤーをコピーし、床部分と壁面に分けます。

床部分のレイヤーは、上部1/3を長方形選択ツールで選択範囲を作成。
 

選択したら削除します。
 

壁面レイヤーは、Ctrlキーを押しながら床面レイヤーをクリックし、

選択範囲を読み込みます。
 

メニューから「選択範囲」メニュー-「選択範囲を反転」で選択範囲を反転し、削除します。

床面レイヤーをメニューから「編集」メニュー-「変形」-「遠近法」で

下記のように変形します。
 

Shiftキーを押しながら左右にドラックすると左右均等に変形します。

床面にレイヤースタイルで影をつけます。

背景は完成です。
 

これに先日ご紹介したクリスマスツリーを配置すると

グッとクリスマスらしさを演出できます。

クリスマスカードやポスターにぜひ使ってみてください。

ハッピー　メリー　クリスマス！

--------------------------------------------------------------------------------

パソコンスクール KENスクール池袋校　Webインストラクター 
http://www.kenschool.jp/school/ikebukuro/index.html

KENスクールでPhotoShopを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

最近めっきり寒くなってきて、温泉でゆっくりして、

おいしいものを食べて、癒されたくなる季節ですね。

旅の思い出に写真撮ったりして、楽しいですよね。

でも、せっかく撮ったすごくきれいな景色。
 

家に帰って写真見てみたら、実際に目で見たのと違う！！

なんて経験ありませんか？

そんなときにPhotoshopで便利な機能があります。

HDRという技法を使うことで実際に見たものに近くしてくれます。

HDR「ハイダイナミックレンジ」という技法をご紹介します。

ここでいう「レンジ（範囲）」は、

写真の一番明るい部分と一番くらい部分までの範囲を言います。

このレンジを操作して

見た目に近い写真を作り出そうっていうのがこの技術のことです。

HDR写真は、違う明るさの写真を数枚使ってそれらを元に合成されます。

では今回はこちらの写真を使ってHDR写真を作ってみましょう。

まず、レベル補正を使って暗い画像と明るい画像を作り、準備をします。

用意ができたら、Photoshop CS5から機能が強化された

「HDRProに統合」という機能を使ってHDR写真を作成します。

【ファイル】→【自動処理】→【HDR Proに統合】をクリックします。

ダイアログボックスが開かれるので【参照】をクリックして

先ほど作った明るい画像と暗い画像と元の写真を選んで【OK】

下の画面になるので

「＞」で画像を選び

「露出時間」を

• 暗い画像を1/1000
• 明るい画像を1/15
• 普通の画像を1/60

に設定して【OK】を押します。

ここで注意していただきたいのが右上の「ゴーストを除去」のチェックボックス。

ここは必ずチェックいれてください。

そしてさらに左下にある3つの画像の真ん中をクリックします。
 

あとは右側のバーで自分好みに色々動かします。

そして完成したのがこちらです。

元の写真はこちらです。

なかなかの見栄えですよね。

これで旅の思い出もばっちり！！


最近では、iPhone4で

「HDR写真が簡単にとれるようになった」など注目されています。
 

簡単にできますし、知っておいて損は無い機能ですよ～

--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでPhotoshopを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html
 

皆さんこんにちは。

特にＷＥＢデザインを始めたばかりの方に多いのですが、

ＷＥＢの素材を作成してもどうしてもチープになってしまう、

素人が作ったみたいになってしまう・・・と悩んでいませんか？

今回から「脱・素人デザイン」として、三つのポイントを挙げていきます。

その一「ドロップシャドウ」

Webの素材を作成する際は「Photoshop」を使用する機会が多いです。

簡単に素材に効果を出せる効果として「ドロップシャドウ」という効果があります。

この「ドロップシャドウ」ですが、レイヤースタイルで効果をつけると

浮き出たような効果が現れ

「こんなに簡単に質感がついた！photoshopってすごい！」

とこのまま適用してしまうパターンが多いです。

実は、これが「素人っぽいデザイン」の原因なんです！

きれいに素材を作成する為にはこの「ドロップシャドウ」の設定に

手を加える必要があります。

ドロップシャドウのデフォルトの設定は

• 不透明度が75％
• 距離とサイズがそれぞれ5％

になっています。

まず、この「不透明度75％」は濃すぎます。

濃い影はどぎつい印象を与え、素人っぽくチープに見えてしまいます。

付いた時に効果が分かりやすいようにこの設定になっているのだと思いますが

大体20～30％くらいに「薄めに」設定します。

また距離をなくしてサイズを大きめにし、ぼけた影が全体に付くよう設定します。

どうですか？

ふんわりとやさしい質感になったと思います。

このように、さりげなくやさしく質感をつけていくと

きれいなパーツデザインが可能になります。

デザインを始めたばかりだと、ひとつの効果に過大な結果を求めがちで

過剰な効果をつけてしまう傾向があります。

一つ一つの質感を抑えてトータルでデザインしていくと

「脱・素人デザイン」になっていくはずです！

次回は、グラデーションについてお話しする予定です。

--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでWebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html
 

意外と簡単に人の顔をきれいにできるテクニックを紹介します。


今回使うソフトは写真の加工といえば「PS」ということで

フォトショップを使っていきます。

 


初めはこんな感じの写真ですが・・・クライアントから

化粧品の広告に使いたいと申し出がありました。

あなただったらこの人を美しくすることはできますか？


自信がない方は、このやり方を知っていると解決するかもしれません。


1. きれいにしたいお顔を選択ツールで選択する

選択に使うツールは「なげなわ」や「ペンツール」

なんでもOKですが、できるだけきれいに！


2. 元画像を複製して、複製した写真（レイヤー）を選びマスクレイヤーに設定




3. マスクレイヤーのサムネイルをCtrlキーを押したままクリック




先ほど作った選択範囲が戻り、顔の選択がされます。


4. レイヤーのイメージのサムネイルをクリックします。




5. ここからが真骨頂です。
    フィルターを使い一気にお顔をきれいに仕上げます。

　「フィルター」メニュー→「ノイズ」→「ダスト＆スクラッチ」を適用します。

　ダイアログボックスの値は「半径」のみ操作しましょう。



お化けのようになってしまいまいたが、

消しゴムで目や鼻、口の部分を消せば・・・



興味のある方はチャレンジしてみてください。


またこういった実務に近い学習を希望の方は、

「極グラフィック」コースがおすすめです。

 --------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでPhotoshopを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html
 

前回ご紹介したStripe Generator 2.0 betaを使ったパーツデザインに挑戦します。
 

今回はパソコンスクール　Ken Schoolのトップページにある

「無料体験レッスン」のバナーを作ってみましょう。

まずはPhotoshopを起動し、190x50程度のキャンバスを新規作成し、

任意の色で塗りつぶします。（サンプルは#e74f30）

Internet Explorerを起動しStripe Generator 2.0 betaを開きます。
 

下記の設定をし、ダウンロードして保存します。

• stripe size:4
• spacing:4
• stripe color(s):e95919
• background color(s):f19061
• stripe orientation:左から３番目

保存したファイルをPhotoshopで開き、パターンとして登録します。
（「編集メニュー」→ 「パターンを定義」 ）

レイヤーを新規作成し、パターンで塗りつぶします。
（「編集メニュー」→ 「塗りつぶし」→「パターン」 ）

上下左右を１ピクセルずつ削除します。
（一行選択ツール・一列選択ツールが便利）

今作成したレイヤーのサムネイルを

Ctrlキーを押しながらクリックし、選択します。

新規レイヤーを作成し、白で塗りつぶします。

選択範囲を１ピクセル縮小し削除します。
（「選択範囲メニュー」→ 「選択範囲を変更」→「縮小」 ）

ここまできたら完成間近です！

任意の書体で内容を書きます。
（サンプルは「無料体験レッスン・個別相談を予約する」）

レイヤースタイルのドロップシャドウを適用します。
 

ここでのポイントはさり気なくかけるところです。

• 距離：2px
• サイズ：1ｐｘ
• 不透明度：30％程度

いかがでしょうか？

好みで三角形や丸などの記号も入れてください。

このようにサイトのデザインを模写するトレーニングをたくさんすると、

テクニックやスピード、デザインの引き出しが増えます。

是非、チャレンジしてください！

--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでグラフィックデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html
 

就職用のサイトを制作している受講生のデザインカンプをチェックしている際に、

「ちょっとサイトの横幅が小さいんじゃないか？」

とご指摘させていただきました。

結構適当に作ったらしく（こらっ!!)、

せっかく他の競合サイトを分析してから作成しているのに、

そのサイトの業種の標準サイズにあっていません。

もし作成がある程度進んだ段階で気付いたとしたら、

写真もボタンもすべて作り直しになってしまうのでとっても手間です。
 

まだ初期段階で気づいて良かった…。

とりあえず画面サイズを測って、という話になって

Photoshopで作業していただきましたが、

いちいちPhotoshopを起動しなくてもサイズを測れる方法があります。

例えばFirefoxのアドオンを使う方法などもありますが、

ブラウザに関係なく測りたい、とか画面外のこの部分のサイズを知りたい、

という場合に便利なフリーソフトをご紹介します。

Screen Ruler

http://wonderwebware.com/screen-ruler/

試しに「Screen Ruler」のサイトの一部を測ってみました。

おお、ページの上の余白は56pxなのね。

という具合に調べられます。
 

ちょっとサイトが英語なのでやだなあ、という方や、

いまいち使い勝手が…という方は

「画面サイズ　測る」などのストレートなキーワードで検索すると

他にも似たような機能を持つソフトがヒットします。

画面サイズだけではないですが、

検索してみると意外と便利なソフト（しかも無料）で見つかるかもしれませんよ。

 --------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでPhotoshopを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html
 

Adobe Photoshop Suite5

ついにCS5の全貌が明らかになる日が来ます。
 

オフィシャルサイトが立ち上がりカウントダウンされていますが、
4/12に正式にお目見えとなるようです。

http://cs5launch.adobe.com/?sdid=FDUNP

今回はその中でも私が大好きなPhotoshopの新機能を紹介しているビデオを！

写真を加工する上で、拡大縮小をするとどうしてもパースが歪んでしまう・・・

また写真に写っている人物が太ったり、やせたりしてしまう・・・

そういった加工を簡単に行える機能がついているようです。
 

下記のビデオでコンビニ（スーパー？）の飲料水売り場の前にいる男の子の
写真を縮小する機能紹介を見ると・・・「なんて便利なんだ！」と

http://www.youtube.com/watch?v=dgKjs8ZjQNg

今後もこのブログで少しずつ新機能に触れていければと思います。

--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでPhotoshopを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Office/index.html

アドビシステムズの「Photoshop」が、2月19日で20周年を迎えました。

ということで、特設サイトがオープンしています。

http://www.adobe.com/jp/joc/ps20th/

「Photoshop」は、トーマス・ノールが開発した、
ピクセル画像処理プログラム「Display」が元となっています。

1988年に Adobe Systemsがライセンスを取得して
「Photoshop」と名付けました。

記念すべき第1弾は1990年に発売されました。

現在もAdobeに在籍しているトーマスは、

「アドビは20年前、Photoshopの販売本数を1カ月当たり500本
と予測していましたが、この予測は外れ、それを上回る数を販売することができ、
現在のユーザーは数百万人に達しています」

と語ってます。

このことからも分かる通り、
デザインツールとしてAdobeがスタンダードになっています。
 

他のメーカーの入る余地は、なかなか無さそうです。

そして、このソフトの開発は趣味から始まっているのです。

「好きこそモノの上手なれ」というように、まずはのめり込むこと、
そこからがスタートです。

そして誰もが未経験からスタートしています。

恐れずに、やりたいことにチャレンジして見てください。

--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html
 

KENスクールでPhotoshopを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html
 

突然ですが、問題です。

以上のような天気図で雲の形だけを利用したい。


そのときPhotohopを使って、
あなたならどうやって雲の部分だけを残しますか？

・
・

選択範囲の取り方は様々なので、決まった正解はありません。
 

ただ、その都度効率の良い範囲の取り方というのは存在します。

今回の場合は色の三属性のうちのひとつ、
「彩度」を利用すると良いでしょう。

まず「彩度」を上げてみます。
 

すると以下のような効果が得られます。

海の青、台地の緑が強調され、地表がはっきりとします。

今度は「彩度」を下げてみます。

色身の強かった地表の部分は黒くなり、雲の城だけが残りました。

このようにペンツールや自動選択ツールを使用するほかに
色調補正をうまく利用して、選択範囲を取ることも可能です。
 

色々な方法を覚えておけば、作業の効率化を図れます。

自分でやってみてもピンとこない、うまく出来ない、などという方には
画像補正を重点的に行なう「極グラフィック講座」もご用意しております。

ご興味のある方は、お気軽にスタッフにお声かけください。

--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでPhotoshopを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

iPhoneのアプリでこんなのがあるんですね。

TiltShift Generator for iPhone

撮った写真をミニチュアのように見せるものみたいです。

iPhone持ってないので実際には使っていませんが、
たまたまネットニュースで拾ったので、ご報告です。

iPhone持っていなくても使えるオンラインソフトもありました！

すごい…簡単に使える！

しかも保存もできますからね～～。

まあ、Photoshopでも、色調補正とぼかしを駆使して作ってみましたが、
ソフトの方がもちろんお手軽、カンタン。

ブログにアップする写真とか、統一感を持たせたい加工された写真などは
このソフトがとても便利かも。

以下、元写真とPhotoshopで加工したもの、tiltshiftで加工したものです。

元写真


 

Photoshopで加工したもの



 

tiltshiftで加工したもの




仕事では使えませんが、

「どう加工されているものがミニチュアみたいに見えるんだろう？」

と研究してみるのもいいですよ♪

 --------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでPhotoShopを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

WEBブログの内容にも秋らしさを付け加えてみたいと思いまして、
無料写真素材のサイトから写真をお借りして、何か作ってみようと思いました。

PHOTO Index
S-Hoshino.com
足成
 

今回使ったのはこちらです。

3つ目の足成は人物写真使いたいときにおすすめです。
 

他にも写真がいろいろあったのですが、
とりあえずこの3つの無料写真素材の中から
今の気持ちをボタンにしてみました。

うーん、同じだけど、結構違って見えますね！　
どうですか？
 

みなさんもよくボタンを観察してみてください！　
ちょっとした工夫が施されていたりしますよ！

--------------------------------------------------------------------------------

 パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでグラフィック加工を学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Office/index.html

以前、携帯を全く使いこなせない話をし、
これではいけないと、
少し反省。

とりあえず、携帯を触ってみる事に･･･。
あっ、なんか待ち受けが替わった･･･。
でも、元に戻せない･･･。 ど～しよ～･･･。

ってことで、前回に引き続き、
今回はPhotoshopでデジカメや携帯で取った写真を印刷用にして見よう!!です。
まず、Photoshopで写真を開きます。

「イメージ」メニューの中の「画像解像度」を選択します。
「画像解像度」のダイアログボックスが表示されます。

この時の「ドキュメントサイズ」が印刷される大きさになります。

さて、この画像をはがきサイズである「100mm×148mm」にするためには、
「ドキュメントのサイズ」をこの数字に変更すればいいのですが、
このままだと、この写真のピクセル数を捨てることになってしまい、
結果、綺麗に印刷できません。
そこで、「画像の再サンプル」のチェックをはずし、
それから「ドキュメントのサイズ」を変更します。
そうすると、「ドキュメントサイズ」を変更しても、
ピクセル数を破棄することはなくなり、
解像度が72ppiから346.71ppiに跳ね上がり、
印刷に耐えられる画像になります。

でも、このままだと幅が150mmになってしまいますので、
余分な2.04mmは 「イメージ」メニューの中の「キャンパスサイズ」で、
キャンパスサイズを縮小するなど微調整が必要になります。

そろそろ年賀状の季節です。
自分で取った写真を、年賀状に載せて見てはいかがでしょうか？
ちなみに待ち受けが変更されてしまった私の携帯
結局もう良いや･･･。
と、投げてしまいました。
 

まぁ、マニュアルを読めばいい話なんですけどね^^；

であ。

携帯電話のデコメ、みなさん少なからず見たり使ったりしたことがあるのではないでしょうか。

無料であったり、月額いくらとかで、かわいいアニメーションをダウンロードしたりした経験もあると思います。
もしも、その画像がオリジナルで作れたら楽しいと思いませんか？

というわけで、今回はフォトショップを使って、簡単なオリジナルの作品作りにチャレンジしてみましょう。

※PS以外にもＧＩＦアニメは作れます。
　お絵描きソフトですが、これはWindows標準ソフトの「ペイント」でOKです。
　ペイントで書き上げた絵は、BMPと言う拡張子が付きます。
　その為、この拡張子をGIFに変換しなければなりません。
　ですから、BMP → GIFの変換ソフトが必要になります。

まずPhotoshopで簡単な画像を作ります。
（携帯の画面サイズの参考はこちらhttp://kurippa.hp.infoseek.co.jp/tekitoh03.html）

こんな感じ
↓

これは１枚の画像にレイヤーを３枚用意して、作成しています。

次にImage ReadyでPSDファイルを開きます。

Photoshopで編集中のデータをImage Readyで開きます。
メニュー：ファイル ⇒ ImageReadyで編集【ショートカットキー】Shift + Ctrl + M

アニメーションパレットをつかって編集です。
表示レイヤーを切り替えてコマを増やしていきます。

アニメが切り替わる秒数を設定します。
１秒くらいだと、少しゆっくりでちょうどいいかもしれません。

最後にできたアニメーションをGIF形式で保存します。
メニュー：ファイル ⇒ 最適化ファイルで保存

これを自分の携帯に送信すればOKです♪

絵心があれば簡単にできますよ！
コレを機に、みなさんもグラフィックの世界にデビューしてみませんか!?★

出来上がり作品

参考サイト
初めてでも簡単！デコメのつくりかた
http://www.loftwork.com/special/decome_howto.aspx