仕事の効率を上げる blog

秋元@サイボウズラボ・プログラマー・ブログ: Invisibilia - 人物を線画により

上記のページで写真の人物画を線画にした画像が多数掲載されているサイトと、フォトショップなどのグラフィックソフトを使って線画を起こす方法が記載されたサイトが紹介されています。

Invisibilia（写真の人物画を線画にした画像が多数掲載）
http://www.themanwhofellasleep.com/Invisibilia.html
Invisibilia（グラフィックソフトを使って線画を起こす方法）
http://www.themanwhofellasleep.com/invisibilia_tutorial.html

フォトショップなどグラフィックソフトを使った加工技術の一つとしてご参考まで。

大変分かりやすいPhotoshop（フォトショップ）のチュートリアル（使い方講座）集をまとめました。

Photoshop初心者の方は使い方を覚えるための学習用に、既に使いこなしている人にはtips集として最適かと思います。
学習用に使う場合は、分かりチュートリアルは飛ばして進めることをお勧めします。

【チュートリアル集】

動画で学ぶPhotoshop （27のテクニック）

1. Web2.0サイトでよく見かけるのロゴの作成方法
2. 写真のエフェクト
3. 写真に古い雰囲気を出す方法】
4. 球体をガラスのように見せる方法
5. 写真の彩度や明るさが高い場合に補正する方法
6. レタッチの方法
7. 白黒写真でコントラストを付ける方法
8. 写真を白黒にする方法
9. 写真に映っている余計なものを削除する方法
10. 写真に枠を付ける方法
11. 写真に効果的なレイヤーやエフェクトを使う方法
12. お肌などの荒れなどを隠し綺麗に見せる方法　等

http://www.popxpop.com/archives/2007/02/youtubephotoshop.html

Photoshopのテキストエフェクト　ベスト80
http://choco--late.com/archives/218

テキストをかっこよく魅せるPhotoshopのチュートリアル集
http://coliss.com/articles/build-websites/operation/design/961.html

光を効果的に使用したPhotoshopのチュートリアル集
http://coliss.com/articles/build-websites/operation/design/925.html

サイトデザインのアクセントに使える6つのPhotoshopのチュートリアル
http://coliss.com/articles/build-websites/operation/design/855.html

フォトショップ基本操作 動画マニュアル.com　β版
http://www.dougamanual.com/archives/0078_/00781_/

フォトショップ早わかり　Photoshop Tips & Manual　-　目次　-　by StudioGraphics
http://aska-sg.net/pstips/index.html

らくがき本舗/Photoshop講座
http://www.raku-gaki.info/photoshp/

美しいアートを作成するためのPhotoShopチュートリアル100
http://phpspot.org/blog/archives/2008/01/photoshop100_1.html

Adobe Photoshop Tutorials - Best Of | Tutorials | Smashing Magazine
http://www.smashingmagazine.com/2008/01/10/adobe-photoshop-tutorials-best-of/

photoshopチュートリアルを100個集めた「100 wonderful photo effects Photoshop tutorials」
http://design-develop.net/design/100-wonderful-photo-effects-photoshop-tutorials-2.html

hereticanthem co.,ltd. » Photoshop&Illustratorのチュートリアルまとめ
http://www.hereticanthem.com/webdesign/332/

【Tips】

サイトをクシャクシャにしてしまうPhotoShopチュートリアル
http://phpspot.org/blog/archives/2008/04/photoshop_61.html

よごれた感じのフォトショップチュートリアルとブラシ
http://e0166.blog89.fc2.com/blog-entry-459.html

写真画像を見栄えよくするPhotoshopのチュートリアル集
http://coliss.com/articles/build-websites/operation/design/897.html

ボタン画像のPhotoshopのチュートリアル集
http://coliss.com/articles/build-websites/operation/design/864.html

photoshopで作る45のボタンメニューチュートリアル
http://gura5.blog120.fc2.com/blog-entry-56.html

ナビゲーション画像を作成するPhotoshopのチュートリアル集
http://coliss.com/articles/build-websites/operation/design/870.html

ゴールドに輝くエフェクトをテキストに与えるPhotoshopのチュートリアル
http://coliss.com/articles/build-websites/operation/design/763.html

iPodのCM風の人影風イメージを作るPhotoShopチュートリアル
http://phpspot.org/blog/archives/2008/01/ipodcmphotoshop.html

柔らかな光がパーッと差すような効果をPhotoshopで実現する方法
http://gigazine.net/index.php?/news/comments/20080207_light_photo/

Photoshopを使った萌え絵の髪の毛の塗り方チュートリアル
http://gigazine.net/index.php?/news/comments/20080208_colouringhair/

炎や爆発を表現するPhotoshopのチュートリアル
http://coliss.com/articles/build-websites/operation/design/846.html

5つの偉大な光と炎のphotoshopチュートリアル
http://e0166.blog89.fc2.com/blog-entry-405.html

水をきれいに表現するPhotoshopチュートリアルいろいろ
http://www.designwalker.com/2008/02/water-tutorial.html

WindowsVista風のガラス風ボタンを作成するPhotoShopチュートリアル
http://phpspot.org/blog/archives/2007/12/windowsvistapho.html

PhotoShopで輝く美しい球体を作成するチュートリアル
http://phpspot.org/blog/archives/2007/10/photoshop_26.html

美しい光を描くためのPhotoshopのチュートリアル集
http://coliss.com/articles/build-websites/operation/design/629.html

Photoshopで人物の髪の毛を切り抜く
">http://blog.woopsdez.jp/2007/09/photoshop_1.php

風景画像をCDジャケット風の超クール画像にするPhotoShopチュートリアル
http://phpspot.org/blog/archives/2007/10/cdphotoshop.html

Photoshopの『カラーの適用』で写真に劇的な効果を加える方法。
http://d.hatena.ne.jp/starocker/20071013/p2

映画のタイトルロゴのような非常に美しい光と文字を描画するPhotoShopチュートリアル
http://phpspot.org/blog/archives/2007/09/photoshop_24.html

Photoshopぼかしフィルターの効果的な使い方
http://www.designwalker.com/2007/08/photoshop-blur.html

紙がやぶれた感じを表現するPhotoshopチュートリアルいろいろ
http://www.designwalker.com/2007/08/photoshop_tear_tutorial.html

光のモーションで画像を超カッコよくするPhotoShopチュートリアル
http://phpspot.org/blog/archives/2007/08/photoshop_18.html

PhotoshopでWeb2.0風バッジを作成するチュートリアル
http://freephotoshopguides.com/interface-elements/web20-badges/

Photoshopで輝くグラス風文字を作成するチュートリアル
http://phpspot.org/blog/archives/2007/07/photoshop_12.html

スポットライトが当たったような画像を作る方法
http://www.popxpop.com/archives/2007/05/popxpop.html

Photoshopの無料ブラシを使って、たった３分でプロが作ったようなグラフィックを作る方法
http://www.designwalker.com/2007/01/photoshop-brushes.html

Photoshopの無料グラデーションファイルを使って、簡単にボタンを作る方法
http://www.designwalker.com/2007/05/photoshop_gradient.html

Photoshopチュートリアル ミニチュア模型を撮影したような写真に加工する - DesignWalker
http://www.designwalker.com/2007/06/tilt_shift.html

「飛び出す写真」を簡単に作るPhotoshopチュートリアル | P O P * P O P
http://www.popxpop.com/archives/2007/01/post_28.html

Photoshop でつややかな表現をわりと簡単に実現する - 2xup.org
http://2xup.org/log/2006/05/05-2005

Photoshopを使ったWeb2.0風ロゴの作り方ムービー
http://gigazine.net/index.php?/news/comments/20061113_web2_logomaker/

Photoshopで写真をベクターアートにするチュートリアル
http://gigazine.net/index.php?/news/comments/20060930_vectorart/

Photoshopでポップアート風の画像を作るチュートリアル
http://gigazine.net/index.php?/news/comments/20061008_popart/

以下英語のサイトですが、図解が多く分かりやすいと思います。

一枚の写真から、HDRの加工をするチュートリアル
http://www.nill.cz/index.php?set=tu1

Web2.0風なロゴの作り方
http://blog.typpz.com/2007/05/11/create-a-web-20-logo-using-abobe-photoshop/

普通の写真から、映画のようなエフェクトがかかったように見せるチュートリアル
http://ebin.wordpress.com/2007/03/21/how-to-turn-your-photo-into-movie-like-effect-using-photoshop/

けむりを描くチュートリアル
http://www.noscope.com/journal/2007/05/photoshop-howto-smoke

国旗の画像と、生地の写真を合成して、ゆらめく旗をつくるチュートリアル
http://www.photoshopsupport.com/elements/tutorials/displace-filter/displacement-map.html

llustratorとPhotoshopを使って、フラッシュしたような加工をするチュートリアル
http://www.abduzeedo.com/displace-filter-vector-effects

Web2.0風なサイトを作る過程のPhotoShopチュートリアル
http://phpspot.org/blog/archives/2008/04/web20photoshop_3.html

Photoshop用ボブ・ブラシを使ってボブの絵画教室みたいな絵を描いてみる
http://www.designwalker.com/2007/08/bob_brush.html

Photoshop（フォトショップ）で使え、クオリティの高いレイヤースタイル、ベクトルデータ、ブラシ、プラグインを紹介しているサイトをまとめました。

デザインのアクセントにお役立てください。

レイヤースタイル（集）

ボタンに使えるPhotoshopレイヤースタイル42種類
http://www.designwalker.com/2008/02/button-layer-styles.html

Web2.0風のボタン等がクリック一発で作れるPhotoShop用レイヤースタイル
http://phpspot.org/blog/archives/2007/05/web20photoshop_1.html

有名サイトのボタンデザイン21個をPhotoshopのレイヤースタイルファイルにしてみました
http://www.designwalker.com/2007/06/button_style.html

ベクトルデータ（集）

無料で使えるベクターデータを配布しているサイト27選
http://www.simplexsimple.com/archives/2007/02/27.html

クォリティの高いフリーで使えるベクトル画像１１選*ホームページを作る人のネタ帳
http://e0166.blog89.fc2.com/blog-entry-107.html

クールなアクア風ボタンのベクトルデータが無料で72個！
http://www.simplexsimple.com/archives/2007/02/72.html

ブラシ（集）

PhotoShopのブラシやパターンがいっぱい「myphotoshopbrushes.com」
http://phpspot.org/blog/archives/2008/01/photoshopmyphot.html

１００のすさまじい高画質Photoshop用ブラシ
http://e0166.blog89.fc2.com/blog-entry-322.html

和風なPhotoshopブラシまとめ
http://www.designwalker.com/2007/12/japanese-brushes.html

100以上のクールなPhotoShop用ブラシがダウンロードできる「getbrushes.com」
http://phpspot.org/blog/archives/2007/08/100photoshopget.html

春の訪れを感じさせるPhotoShopブラシ集
http://phpspot.org/blog/archives/2007/07/photoshop_17.html

フリーで使える超絶クールなPhotoShopブラシ
http://phpspot.org/blog/archives/2007/04/photoshop_2.html

Photoshop用ブラシが180種類以上ある無料サービス「PS Brushes」
http://gigazine.net/index.php?/news/comments/20061012_ps_brushes/

閃光、爆発などの光や風などを表現できるPhotoshopのブラシ
http://coliss.com/articles/build-websites/operation/design/738.html

プラグイン（集）

トイカメラ風にデジカメ画像を変換するPhotoshop用プラグイン
http://www.gizmodo.jp/2007/08/photoshop.html

いろいろなフィルム効果を施すPhotoshop用プラグイン「PixelSampler」
http://gigazine.net/index.php?/news/comments/20070205_pixel_sampler/

無料で使えるPhotoshopプラグイン20選『Free Photoshop Plugins』
http://blog.creamu.com/mt/2007/05/photoshop20free_photoshop_plug.html

グラデーション

無料のPhotoshop用のグラデーション ファイル集
http://coliss.com/articles/build-websites/operation/design/625.html

Photoshopのグラデーションファイルを日本の伝統色で作ってみた
http://www.designwalker.com/2007/05/japanese_color_gradient.html

塗りつぶしパターン（集）

Photoshopにさまざまなパターンを追加できる「JanSport Patterns」
http://gigazine.net/index.php?/news/comments/20071205_jansport_patterns/

アクション（集）

デザインを高速に行える技巧的なPhotoShopアクション集
http://phpspot.org/blog/archives/2008/02/photoshop_52.html

画像にいろいろな効果を与えるPhotoshopのアクション集 | コリス
http://coliss.com/articles/build-websites/operation/design/857.html

以下の記事にて、グラフィック関連、HTML/CSS関連、アクセス制限設定ファイル関連など様々なWebツールやジェネレータが紹介されています。
特にグラフィックス関連のものはブラウザだけでハイクオリティなロゴやボタンが簡単につくれてしまうので、絵心の無い人にもおすすめです。

【Webツール（集）】

YouTubeからムービーをAVI・MP4・MOV・3GP・WMV・FLVなどの形式でダウンロードできる「iDesktop.tv」
http://gigazine.net/index.php?/news/comments/20080214_idesktoptv/

WYSIWYG型オンラインCSSデザインツール【CSSEZ】
http://jp.cssez.com/

ブラウザ上でPDFの高度な編集ができる『PDFescape』
http://www.100shiki.com/archives/2008/02/pdfpdfescape.html

【ジェネレータ（集）】

ローディング中のアニメーションGIFを生成する「Load Info - gif generator」
http://gigazine.net/index.php?/news/comments/20080205_loadinfo_gif/

また新しいのが出た。ローディングイメージ作成のお供に『gif generator』
http://e0166.blog89.fc2.com/blog-entry-248.html

Web 2.0っぽいロゴがさくっと作れる『LogoCreatr』
http://www.simplexsimple.com/archives/2007/06/web_20logocreatr.html

これは楽しい！10秒でWeb2.0風のボタンをサクサク作れちゃうボタン・ジェネレータ・サービス | My cool button
http://d.hatena.ne.jp/hmiyaza1/20070525/1180078958

Web2.0風ボタン作成サービス
http://phpspot.org/blog/archives/2006/05/web20_6.html

Web 2.0風バッジジェネレータ
http://www.web20badges.com/

ストライプの次はタータンチェック？『Tartan Maker』
http://www.100shiki.com/archives/2007/07/tartan_maker.html

WYSIWYG型オンラインCSSデザインツール【CSSEZ】
http://jp.cssez.com/

Forgot the Milk. - Faviconをサクサク作ってくれる８つの Faviconジェネレータ サイト
http://d.hatena.ne.jp/hmiyaza1/20070603/1180808921

.htaccess ファイルを簡単作成「.htaccess Editor」
http://www.htaccesseditor.com/

もうPhotoshopは要らない？ブラウザだけでできるグラフィックジェネレータ15選
http://www.simplexsimple.com/archives/2007/05/photoshop15.html

有料ソフトとデザイン作業を無力化させる30のブックマークまとめ*ホームページを作る人のネタ帳
http://e0166.blog89.fc2.com/blog-entry-213.html

WEBデザインに便利なオンラインジェネレーター＆ツール集
http://phpspot.org/blog/archives/2007/08/web_28.html

faviconをオンラインで作れるサイト２０選
http://choco--late.com/archives/259

なにかと使えるWebジェネレータのまとめ　その１
http://www.hereticanthem.com/webtools/315/

なにかと使えるWebジェネレータのまとめ　その２
http://www.hereticanthem.com/webtools/316/

下記のページで様々なチートシート（覚えるべきものを1枚のシートにまとめたもの。カンニング・ペーパー）が紹介されています。

良く使うのもをピックアップして印刷して手元においておけば作業効率アップに役立つのではないでしょうか。

【チートシート（集）】

Linuxの各種コマンドのチートシートに日本語版登場
http://gigazine.net/index.php?/news/comments/20070814_linux_command_cheat_sheet_jp/

１ページに情報が集約されたCSSチートシート「CSS Cheat Sheet」[英語]
http://phpspot.org/blog/archives/2007/01/csscss_cheat_sh.html

PHP正規表現（PCRE）チートシート[英語]
http://phpspot.org/blog/archives/2006/07/phppcre.html

Googleチートシート[英語]
http://gigazine.net/index.php?/news/comments/20060422_google/

バックエンド系(Apache・PHP・MySQL)のチートシート
http://coliss.com/articles/build-websites/operation/work/353.html

ウェブ制作・プログラマー・デザイナーのためのチートシート集
http://coliss.com/articles/build-websites/operation/work/796.html

約３００個のCheat Sheetが手に入るリンク集。Google、Firefoxからプログラミング言語まで盛りだくさん！[英語]
http://google-mania.net/archives/330

• PhotoshopCS2のショートカット
• Windows、Linuxのコマンド
• 各種ブラウザのショートカット
• Microsoft Officeのショートカット
• CSS、HTML/XHTML、XMLのリファレンス
• Apacheの設定
• 検索エンジンのリファレンス

etc..

英語のものが多いですが、簡単な単語ばかりなのでそれほど理解に苦しむことは無いと思います。

#意外と日本語版少ないのはチートシートというもの自体がまだまだ認知されていないからでしょうか

2008年3月27日に公開されたPhotoshopのオンラインWebアプリ版「Photoshop Express」の使用感のレビュー記事をまとめました。

ベータ版ということもあってか、英語版のみの提供でCS3程高度な編集機能は望めませんが、オンラインならではの利点（2GBのストレージやサブドメインも無料利用可など）もあるので使ってみる価値はありそうです。

オンラインでどこまでできる？　Photoshop Expressを使ってみた
http://www.itmedia.co.jp/bizid/articles/0803/27/news100.html
編集メニューの簡単な用途が日本語で解説されています。

SaaS版Photoshopがついに公開、早速使ってみた
http://www.atmarkit.co.jp/news/200803/27/pse.html

オンラインだからこそ、Photoshop Express の使い道
http://creazy.net/2008/03/photoshop_express_beta.html

Adobe「Photoshop Express」ベータ版公開
http://netafull.net/tech/025110.html

待望のAdobe Photoshop Express ベータ版公開
http://pea-nuts.org/2008/03/27/photoshop-express/

本家Photoshop Expressはこちら
Adobe Photoshop Express - Made You Look.
https://www.photoshop.com/express/landing.html