Design
Photoshopで円に沿った文字を入れる方法とそれを使ったTシャツデザインの作り方
スポンサーリンク

Tシャツやwebサイトのデザインで丸い円に沿うように文字が並んでいるのを見て、自分もやりたくなった事はありませんか?この効果パッと見は難しそうに感じるかもしれませんが、フォトショップなら簡単に誰でも出来てしまいます。ただ円に沿って文字を入れると言っても、何に使って良いかイメージも湧きづらいかもしれないので、今回Tシャツデザインの作りかたを例に、円に沿って文字を入れる方法を説明していきます

スポンサーリンク

曲線や図形のパスにそった文字を書くのは
パスの上からクリックするだけでOK

楕円形ツールで円を描きます

形状はパスにします

文字ツールにして図形のパス上にカーソルを合わせるます

S字のような点線が現れたらクリックして文字を書きます。


カーソルがS字のような点線になります

「テキスト カーソル」の細い縦棒が点滅したら、パス上に文字が挿入できます

テキストを入力するとパスに沿って文字が書けます

入力した文字にカーソルを近づけると、カーソルの表示が変化して文字の移動が出来ます

パス上で円に沿って時計回りや反時計回りが出来るようになります

パスに文字ツールを近づけるとこのように変化します。三角形が両側についているようなアイコンです

下側にもパスに沿った文字をいれていきます

ここでもカーソルをパス上にもっていきます
カーソルがS字のような点線になったらクリックすれば、パスに沿って文字が挿入できます
文字を入力するとこうなります

文字を反転した状態にしていきます

入力した文字にカーソルを近づけると、カーソルの表示が変化して移動が出来るようになります
この表示時ではパスに沿って回転や反転もできます

反転しました
ベースラインシフトを調整(マイナス側)してパスの外側に出し、文字間を調整

文字をTシャツ用にデザインして行きます

背景を黒にして文字にフチをつけます

文字のレイヤーを選んで【レイヤースタイル】→【境界線】でフチの太さと色を調整します


下のMOTORS文字も同じようにフチをつけて行きましょう

文字以外の素材も組み合わせていきます

フリー素材サイトで探した車のイラストを配置


イラストの大きさを調整
調整レイヤーの色相・彩度で色味を合わせます

色相・彩度でイラストのトーンを合わせて【レイヤースタイル】→【境界線】でフチをつけました、
小さな文字を追加したらTシャツのデザインが一旦完成

Tシャツの完成イメージをつくる

最後に完成したデザインを実際のTシャツ画像に合成して完成イメージを作っていきます



黒いTシャツの画像に合成します

境界線でフチをつけた場合
縮小した時にフチが元の大きさのままなので縮小にあわせてサイズを下げましょう

背景はヴィンテージ感あるアメリカの風景を選びました
これもフリー素材です

合成してみるとTシャツのデザインが浮いてみえたので
色味を少し落として、
フィルターのノイズを使って全体と馴染ませました

下にGARRETT MOTORSの文字をデザインと同じ色で入れ、
ベベルとエンボス加工で少し立体感を出しました

完成

フォトショップで円に沿って文字を入れる

円や曲線に沿って文字を入れる見せ方は、簡単なわりに実際デザインの現場でも使える場面が多いです。パス自体の変形もパス選択ツールで出来ますので、いろんな形に合わせて文字が入れられます。表現ありきで考えるのが基本だと思うでしょうが、意外にツールの機能で表現が思いつく事って多かったりしますよ!誰にですぐに出来るのでぜひ試してください!!

スポンサーリンク

Twitterでフォローしよう

おすすめの記事