チュートリアルの最近のブログ記事

Radar-40.jpg

Photoshop(フォトショップ)で、レーダー探知機のアイコンを作るチュートリアル。

飛行機や潜水艦の操縦室にありそうなレーダーです。

主に「ベベル」&「覆い焼き」2種類の描画モードと、各ステップでのレイヤースタイルの設定で構成されています。

 

UP↑

Candle-32.jpg

この度の「東北地方太平洋沖地震」におきまして、被害にあわれた皆様に心よりお見舞い申し上げます。

現在も各地で計画停電が実施されていますが、停電中に明かりを灯すアイテムの一つに「ロウソク」があると思います。

そこで今回は、Photoshop(フォトショップ)で、淡い火が灯るリアルなロウソク(キャンドル)の作り方チュートリアルをご紹介します。

 

UP↑

mt5_manual.jpg

案件でMovableTypeを使ったCMSサイトを構築する時、納品後のクライアントワークで、管理画面の使い方を一つ一つ教えるのはとても大変な作業です。

Movable Type 4.2x系の時は、大御所「CSS HappyLife」さんに大変お世話になりましたが、Movable Type 5.xではそういった類いのサイトがない!!あらら... どうしましょ。

「そんなら自社(weSKA)で作っちまえ!」という事になり、弊社デザイナーS君による渾身の一作が出来あがりました。

Movable Type 5.x 基本操作マニュアルサイト

利用環境によって若干の違いはあるかもしれませんが、Movable Type 5.xの基本的な操作方法を分かりやすく解説しています。是非ご利用下さい。

 
Glossy3D-23.jpg

【簡単テキストエフェクトシリーズ vol.3】

Photoshop(フォトショップ)CS3で、光沢のあるガラス風の3Dテキストエフェクトを作るチュートリアル。

2010年流行の一つ「3D」と、昔から好まれてるグロス系「光沢感」「キラッと感」の合わせ技です。
文字にはあえて「3D押し出し」など使わず、簡単で汎用性が効くように「3D風」で表現します。
TIPSとしてすぐ使えるよう、作った後はスタイルパレットに登録を。

 

UP↑

Wrinkle-20.jpg

Photoshop(フォトショップ)CS3で、しわが寄って、今にもめくれそうなステッカーを作るチュートリアルです。

「覆い焼きツール」と「焼き込みツール」は、Photoshopで物を作るときに非常にパワフルなツールです。今回のチュートリアルでは、主にこの2つのツールを使い、しわが寄ったリアルなステッカーを作ってみたいと思います。

 

UP↑

Bubble-img.jpg

Flash(フラッシュ)CS3+ActionScript 3.0で、ランダムな動きをする光のFLASHアニメーションを作るチュートリアルです。

まだまだAS3勉強中です。さらっと作れて尚かつリッチ!そのうえ使い回しが効く小ネタをアップして行く予定です。

 

UP↑

Neon-small.jpg

【簡単テキストエフェクトシリーズ vol.3】

Photoshop(フォトショップ)CS3で、ネオンサインのテキストエフェクトを作るチュートリアルです。

BARの看板にありそうな、味のある質感のネオンサインです。

TIPSとしてすぐ使えるよう、作った後はスタイルパレットに登録を。

 

UP↑

Bar_graph-31-1.jpg

前回の『Illustrator|きれいな3Dの円グラフの作り方チュートリアル』に続くグラフシリーズの第2弾です。

今回はIllustrator(イラストレーター)CS3で、きれいな3Dの棒グラフを作るチュートリアルです。

"棒グラフ"と"目盛" それぞれ別々に『3D・押し出しベベル』効果をかけて、3Dの棒グラフを作ってみました。

 

UP↑

Plastic-Text-15.jpg

【簡単テキストエフェクトシリーズ vol.2】

Photoshop(フォトショップ)CS3で、ポップなプラスチック風のテキストエフェクトを作るチュートリアルです。

アメリカの映像制作会社『ピクサー』アニメのタイトルで使われそうな感じになりました。

TIPSとしてすぐ使えるよう、作った後はスタイルパレットに登録を。

 

UP↑

Gold_style_17.jpg

【簡単テキストエフェクトシリーズ vol.1】

Photoshop(フォトショップ)CS3で、上品なゴールド(金色)のテキストエフェクトを作るチュートリアルです。
ゴールドのテキストエフェクトは沢山でていますが、その中でも使いやすいものをご紹介。

TIPSとしてすぐ使えるよう、作った後はスタイルパレットに登録を。

 

UP↑

Pie-charts-00.jpg

Illustrator(イラストレーター)CS3で、きれいな3Dの円グラフを作るチュートリアルです。

Webデザインだけでなく、DTP&グラフィックデザインにおいてもグラフ作成は必要不可欠なファクターです。

今回は平面の円グラフにひと手間かけて、3Dの円グラフを作ってみました。

 

UP↑

Copper-43.jpg

Photoshop(フォトショップ)CS3で、劣化してさびた銅の質感のテキストエフェクトを作るチュートリアルです。

このチュートリアルでは『錆:さび』をデザインする為に、テキストにたくさんのレイヤースタイルをかけます。

一度作ってスタイルに登録しておけば、ダメージ&グランジ系デザインのアクセントとして使えると思います。

 

UP↑

Safari_icon-28.jpg

Illustrator(イラストレーター)CS3でSafariブラウザアイコンである『コンパス』の作り方チュートリアルです。

Web2.0(もはや死語?)が流行っていた少し前に、Aquaアイコン系の海外チュートリアルで頻繁に取り上げられていました。

今更ですが、イラレの基礎『パス&マスク&グラデーション』でほぼ出来ているので比較的簡単に作れると思います。

 

UP↑

trump-20.jpg

Photoshop(フォトショップ)CS3で、汚れて古くてボロボロになった感じのトランプを作るチュートリアルです。
このチュートリアルには『よごし』をデザインする時によく使われる『グランジ系ブラシ&空模様&焼き込みカラー』といった王道(多分)の手法が網羅されています。

古びた紙などを作る際に役立つかも。

 

UP↑

wavy-12.jpg

Illustrator CS3で、カラフルで波打つようなストライプリボンの作り方のチュートリアルです。

身近にあるストライプ(ネクタイ、ベルト?とか)をヒントに作っても面白いかも。

 

UP↑

Retro-13.jpg

Photoshop(フォトショップ)CS3で、写真をレトロでポップなアメコミ風にする方法を解説するチュートリアルです。
このチュートリアルを参考に、自分のお気に入りの写真を加工すれば、よりいっそう楽しめると思います。

 

UP↑

moofx_demo.jpg

今回は、moo.fx [JavaScript] を使って、タブメニューでアコーディオン表示を切り替えるサンプルを作ってみました。
チュートリアルの内容的には新しい物ではありませんが、主要ブラウザ(Safari3・Firefox2&3・IE6・IE7)にも対応していて、カスタマイズしやすく、軽い!
デザインのネタに是非どうぞ。

まずは、デモサイトを見てください。

 

UP↑

Bokeh-13.jpg

Photoshop(フォトショップ)CS3で、光とぼかしを使ったクールなエフェクト画像の作り方のチュートリアルです。
このチュートリアルは、比較的簡単な手法で作れるので、バリエーション次第でいろいろ使えそう。

 

UP↑

Starburst-22.jpg

Photoshop (フォトショップ)CS3で、Leopard風のロゴの作り方のチュートリアルです。

チュートリアルの真ん中辺り、"星雲"と"星の爆発"を作るのに少し手間が掛かりますが、応用のききそうなやり方なので一度やっておくと自分の引き出しが増えそう。

スペイシーなデザインをする時はぜひ参考に。

 

UP↑

アーカイブ

2011年10月

            1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31          

プロフィール

ダイナマイト・ドラマー

名前:ダイナマイト・ドラマー
職業:Webデザイナー
好物:牛のたたきとビール