アメブロ向上企画書ーCSSでカスタマイズ、オリジナルなスキンに挑戦！ -88ページ目

説明の都合で最初に説明しちゃいましたが・・

本来ならヘッド画像を作ってそれから画像に合わせてタイトルロゴを作ります

http://www.pixlr.com/

高機能で無料のオンライン画像編集ツール

オンライン上で作業できる割には高機能なんです

特に・・レイヤーが使えることがこれを選んだ最大の理由です

また文字も日本語が使えてパソコンにインストールされているフォントが使えます

ただ・・ただの文字なのでタイトルに使うには・・物足りない

ということで・・タイトルロゴは別ので説明しました

来週の週末目指して使い方の説明からしていきます・・・

pixlrのトップ画面で　→Open image editor←　をクリック

これが・・作業画面です・・

最初に日本語のメニュに変更します

×をクリックで窓を消します

画像を選んだ後で日本語にしてもいいのですが・・　

小窓が変な位置に固定されちゃう場合がありましたので・・先に日本語表示にします

上のメニュから　Language　→　日本語

なんか・・見にくい明朝の日本語メニュになりました・・

ところどころでおかしな日本語になっていますが・・気にしない気にしない

練習兼ねた説明なので新規画面を選択します

練習なので画面サイズは適当に・・・

最初にじゃまなナビゲータとヒストリ（ヒストリー）の窓を消します

※この２つはたぶん今後も使わないと思います・・・

　もし・・必要なら上のメニュのビューからまた表示させることができます

　毎回この3つの小窓が表示されますが・・

　まだじゃまにはなりませんが・・実際の作業ではじゃまになります

　毎回消しちゃってください・・

今回の説明ではまだ・・使いませんが・・必要なのはレイヤーだけです

窓はドラッグで自由に位置を変更できます

作っていくうちに窓の位置がじゃまになったら位置を動かして作業します

最初の練習です・・

鉛筆ツールを選択します

ツールを選択するとそのツールで使えるオプションが上に表示されます

鉛筆ツールの場合は「ブラシ」と「不透明度」

まずは・・ブラシ（鉛筆の先端の形とサイズ）を選択します

ブラシの窓が他のツールと共通なので紛らわしいのですが・・

鉛筆ツールで使うのは形のはっきりしたブラシです

（ぼんやりしたのはブラシツールで使います・・　　間違っても大丈夫です・・似たようなのになります）

あとはマウスで線を描くだけ・・・

不透明度を変更したり・・いろんなブラシを使ってみて練習（遊んで）ください

間違ったり・・気に入らなければ

メニュ→　編集　→　取り消し　で・・前の状態に戻せます

色の変更は・・・カラーピノカ（カラーピッカーのことです・・・変な日本語訳ですが気にしないで）

または・・前景色をクリックするとカーソルがスポイトに変わりますから・・

画面上の使いたい色の部分にスポイトをあててクリック

（スポイトの先端部分に位置する部分の色が抽出されます）

（この場合・・画像の中だけでなくウインドウの中ならどこの色でも取れます）

画像画面の右上の□をクリックで全画面表示に

キーボードのCtrlキーを押しながら　＋(プラス)キーで画像が拡大表示されます

細かな部分を作業するときには＋キーを何回かおして作業しやすいサイズまで拡大します

結果を見る場合はCtrlキーを押しながら-(マイナス)キーで表示を100%にすれば実際の見た目になります
（これはあくまでも作業上の見た目の拡大縮小です・・）

次はブラシツールの予定です・・・・

ちなみに・・

エッジにぼかしのない輪郭のはっきりした線を描くには鉛筆ツール
エッジにぼかしがある線を描くにはブラシツールを使います
いろいろ描いてみて違いを確認ください

わからなかったら・・　自分で何とかしましょう・・・？　質問はナシよ・・・

パソコンにインストールするわけではありませんので

自由に遊んじゃってください・・・

また・・あまり大きく拡大すると動きがカクッカクッってなる場合があります・・

作業しにくかったら表示を少し小さくすればなおります

ヘッド画像を作る1 タイトル　Cool Text

以前からヘッド画像の作り方を教えてくださいってコメントをいただいていましたが・・

そのたびに・・わたしには画像を作ることを教えられるほど技量がありませんので・・

って・・断ってきました

画像を作る技量もセンスもありませんが・・・

やり方だけなら大丈夫かな・・？

なんて・・

センスの無さが発覚するおそれ大なんですが・・・

無謀にも記事にしてみたいと思います

どなたにでも可能なオンラインで無登録で使えるサイトだけでトライします

来週の週末にはみなさま新しいヘッド画像が作れるようにガンバリます

・・・あまりにも自分のセンスのなさに恥ずかしくなったら

途中で中止もありえます！期待しないでくださいな・・

最初は・・説明の都合で・・

タイトルのロゴです

あとで・・画像の中に合成します

Cool Text (クールテキスト) はフリーの画像ジェネレーターです

まずは・・希望のロゴスタイルをクリックします・・

スタイルが決まったら・・タイトルを入れてフォントを選びます・・

フォントサイズとかは後からやり直せますので適当でかまいません

日本語のフォントだけで↓こんなにあります！

文字色を決めます

今回はヘッド画像に後で合成するタイトル画像ですので背景色や背景画像は選びません

※ロゴによってはハイライトの色も選択する必要があります

保存は・・合成しやすくするために　.PNG 透明付き　を選択して保存します

↓色の名前をクリックして選択します

スポイトのボタン　カラーピッカーはブラウザーによっては動作しません（FirefoxはOK）

[描画する　デザインしよう]　をクリックして少し待つと・・・

出来上がりを見てサイズが小さいとか・・思った風でなかったら　このロゴを編集で　前の画面に戻ります

やり直してＯＫなら　画像をダウンロード　（画像の上で右クリック→名前をつけて保存でも可）

↓こんなのが出来上がりました・・・

まわりが黒いのは・・　IE6を使っているからです（IE6はPNG画像の透過処理ができません・・）

でも・・ちゃんと透過処理はされていますから気にしないで大丈夫です・・あとで合成しますから・・

IE6以外でしたら・・・↓　周りは透過されて白くなっているはずです

もし・・メニュや表示が英語とかになっちゃった場合は・・画面下にある　日本　をクリックします

たぶんつづく・・・　と　思います・・・？

記事を書くのに時間がかかっちゃっていますので回答コメント・・だいぶ遅れます

表示がおかしくなっている方の回答を優先します

すみませんがよろしくお願いします　m(_ _)m

チカ画を作る・・・

リク記事です・・

チカ画ってどうやって作るんですか？

正直・・チカチカは・・個人的に好きではありませんが・・

作り方・・なんておこがましいことではありません

ただ・・サイトを紹介するだけです（このサイト知らないうちにチカ画なんてできちゃった）

http://www.bannerkoubou.com/chikaga/

「参照」をクリックして画像を選択した後「送信」するをクリックするだけ・・

　こんな画像が・・・　　→　

簡単でしょ・・・　

もうチョット前でしたらアニメーションGIF画像の作り方から説明しなければならないところでした・・

このサイトさまのおかげで助かりました・・

<< 前のページへ最新 | 86 | 87 | 88 | 89 | 90 | 最初次のページへ >>

ブログ画像一覧を見る

このブログをフォローする

アメブロ向上企画書ーCSSでカスタマイズ、オリジナルなスキンに挑戦！

ヘッド画像を作る2 Pixlr 鉛筆ツール

ヘッド画像を作る1 タイトル Cool Text

チカ画を作る・・・

ヘッド画像を作る2　Pixlr　鉛筆ツール

ヘッド画像を作る1 タイトル　Cool Text