日本一、いや世界一簡単に無料でイラストを添える方法

こんばんわ。

昨日はサボってしまいました。
フットサルのフェイントをどうしても練習したくて、
夜中の公園で一人ロナウジーニョになりきってエラシコエラシコ

---

今日は、Web制作をする上で、基本中の基本の
コスト削減方法についてのお話。

凄く簡単に、誰でもちょっとしたデザインが出来るので、
デザイナーでない方、例えばWebディレクターさんや、
営業さんの方でもできる方法です。

先日、私はこのブログにてExcelでイラストを描いてみる
という企画を行いました。

ブログからのコメントはいただけませんでしたが、
会社では、デザイナーに驚かれた次第です。

しかし、問題点がいくつもあります。

・ギザギザしてしまう点
・手間がかかる点
そして、
・センスに依存しなければならない点

がありました。

でも、今回ご紹介するのは、最も簡単なやり方です。

　X　ペンタブレットは必要ありません。
　X　マウスも殆ど使いません。
　X　新たにフリーソフトをダウンロードする必要もありません。



必要なものは、
キーボードと、ペイントソフトもしくはOfficeソフトです。

勘の言い方はもうお気づきかもしれません。

そうです、Wingdingsを使えば、

美しいイラストが瞬時に描けるのです。

Step１　ワードを起動してください



Step２　フォントタイプをWebdingsあるいはWebdings2,Webdings3に指定してください



Step3　色を付けたり、大きさを変えれば完成です。

加えて申し上げると、FireWorks、Illustrator、Photoshop、GIMPを
使用すればもっとインタラクティブなイラストが手軽に作れます。

方法は、文字をアウトライン化すればいいというだけの話です。

ではまた。

サイトマップXMLでSEO

みなさんどうもこんばんわ。
昨日は、フットサルの後、飲み放題でへべれけに酔っ払ってしまい何もかけませんでした。

今日は、ちょっと真面目にフリーについて語ります。

SEO対策の基本として必要とされている操作に、
サイトマップをアップして、Googleウェブマスターツールに登録する。
というものがあります。

サイトマップ（できれば、完全に網羅しているもの）をGoogleのクローラーに知らせる事で、
「あ、このサイトはこういう風になっているんだ。じゃあいっちょ行って見るか。」となります。
しかし、サイトマップをいちいち、チェックするのって大変ですよね。

僕は日本一フリーでしかも一括でそういうことをやってしまいたい
Webディレクターなのでまず、サイトマップ制作などやりたがりません。

Sitmap Generator　Free　で検索をかけて、
さくっと終わらせます。

検索して見ると、

サイトマップを自動で生成してくれる無料のウェブツールは多数存在します。

その中でも日本一フリーが好きな私が

特に使いやすい、深いところまで見に行ってくれるものを
厳選したのでご紹介したいと思います。

XML SITEMAPS（英語）
http://www.xml-sitemaps.com/
サイト内を500ページまで巡回してサイトマップを生成してくれます。
時間はそれなりにかかりますが、これは使えそうです。
XMLファイルと、HTMLファイル双方でサイトマップを生成してくれます。
残念ながら、HTMLファイルのサイトマップは日本語に対応していない模様です・・・。
強引な手段としては、ダウンロードしたサイトマップファイルのcharsetをEUCに変更すれば、
何とか文字化けせずにタイトルを表示してくれます^^;

無料登録ドットコム　サイトマップラス（日本語）
http://www.sitemaplus.com/
こちらも無料でサイトマップを作ってくれます。
が、あまり深いところまでインデックスしてくれません。
せいぜい100ページくらい。
小規模サイトでしたらオススメです。

ではでは。。。

フリーソフト先生

みなさんこんばんわ
今日は知人にオープンソースによる無料アプリケーションの代表格であるopen office orgの使い方がわからないという相談メールが届きましたので、これから説明に行って来ます！
お駄賃代わりの夕食つきです！
ジーク・フリーソフト！

Windowsをフリーソフトを使って無料でMac風にカスタマイズする

ども、皆さんこんばんわ。

インフルエンザをもらいそうなくらい体調が悪いです。

多分、昨日夜更かしして、洗濯物をたたんだのがいけなかったのでしょう。

普段から片付けはちゃんとしておかないと・・・。

片付け、と言えばデスクトップ！こちらも片付いてません（＾＾；

使わないのは捨てたり、任意のフォルダにしまえばいいものを、

どうしてこうもデスクトップにおいてしまうのでしょう・・・。

デスクトップに置くのは賛否両論あるかと思いますが、

個人的には百害あって一利無しと思っています。

何故なら、デスクトップにファイルがあると、

1.スタートが遅くなる

2.見た目がごちゃごちゃして何がどこにあるか分からなくなる

やはり、データはDドライブに、

img画像

doc文章

xls表

pptパワーポイント

といった風にまとめるのが、一番、Cドライブに負担をかけないのでいいかと思います。

しかし、よく使うファイルやソフトはすぐに呼び出したいなぁ。

そういう場合、厳選した5〜6個のショートカットをデスクトップに置くと思います。

それを、Mac風にしてくれるソフトがあります。

しかも、無料ソフトです！

Macユーザや、Macを一度でも触った事がある方ならご存知かと思いますが、

Macには、Docsというマウスを近づけると、画面の下からフワ〜っと上がってくる

ショートカット集があります。

これのWindows版があるんです！

今の所、Windows XPでも、Vistaでも問題なく動作しております。

英語サイトですが、別段何か登録しなければならない事もなく、

操作も簡単なので安心して始める事ができます。

僕は自分が触れる全てのパソコンにRocket Dockを入れています＾＾；

ダウンロードはこちらから↓
http://rocketdock.com/

無料ドローソフトInkscapeでプーさんを描いて見た

こんばんわ！

今日は、仕事の途中でめちゃめちゃ親知らずの周りが痛くなり、

いつもは8時半に退社するところを7時15分であがらせてもらい、

歯医者さんに行って来ました。

診断結果は、「親知らずの向きがおかしい。」

まぁ、よくあることなんでしょうけど、やっぱ痛い。

来週の火曜日抜歯する事になりました。

週末しなかった理由は、飲み会とフットサルがあるからです。

---

では、今日のお題に移りたいとおもいまーす。

今日は、

「誰でも、簡単に、無料で、イラストレーターになれる、
illustratorの無料版的存在、Inkscape　（完全フリーソフトです！）」

について、

実際の制作画面をご覧頂きながら紹介したいと思います。

使い方は知ってるよ！フリーのドローソフトInkscapeの名前を忘れただけだよ！
っていうあなたは、こちらからInkscapeのダウンロードが可能ですp^.^q
//www.forest.impress.co.jp/lib/pic/piccam/paint/inkscape.html

---

今回の題材は、くまのプーさんです。


8ステップでざっくりとご説明します。

---

Step1　ロゴを作成します。


左メニューから、テキストツールを選び、お好きな文字を入れてください。
（日本語も対応しています！）

まっすぐだとプーさんの丸みが表現しきれないので、
ベジエツールで、波線を作成します。

---

Step2　ロゴの作成続き


テキストとパス（波線）を選択し、
テキスト＞テキストをパス上に　を選択してください

---

Step3　ロゴを作成する続き


パスの上に文字が乗りました。
この後で、パスを変形させると、文字はそれについてきます。

---

Step4　輪郭の作成


ベジエツールで、輪郭を描きます。
大雑把に円を描いて、後から修正するという流れです。

この輪郭は後で色を入れたりするので、コピーを2つほどとっておいて下さい。
Ctrl+Cでコピーできます。

---

Step5　顔のパーツを入れる


これも、ベジエツールや円ツールを使って、描きます。
だんだんプーさんっぽくなってきましたねぇ〜。

左耳（向かって右側）は別途ベジエツールで描く必要があります。
そうしないと、耳の前を濃い線が貫通してしまいます^^；

---

Step6　色を加える


先ほどコピーしてとっておいた輪郭に色を加えます。
濃い目の黄色単色でもいいのですが、

ふくらみを出すために、放射グラデーションを用いて、
中心を限りなく白に近い黄色から始めて段々と濃い黄色にします。

---

Step7　輪郭と背景色を重ねる


輪郭か背景色どちらかを選んで重ねます。

---

Step8　周囲の絵などを入れる


額縁やハチのイラスト、最初に作ったロゴを配色してから、
メインの背景に入れて完成です！

---

＜保存方法＞
基本的に、Inkscapeは.svgという拡張子で保管されます。
この場合、レイヤーも勿論有効。

JpegやPng化する場合は、
ファイル＞ビットマップにエクスポート
と、進み、保存先、ファイル名（拡張子まで）を指定してから
エクスポートする必要があります。

---

＜こんな方にオススメ＞
・会社で主にPhotoshopやIllustratorを使用しているが、自宅では価格を抑えてデザインしたい。
・・・という、Webデザイナー、グラフィックデザイナーのあなたに！

・低価格なイラストソフトでは物足りない。
・・・という、最近ちょくちょく売り上げが伸びてきたネットショップ店長のあなたに！

・日本一フリーソフトが好き。
・・・という、ここ3年間くらい5000円以上のソフトを買った事のないあなたに！

・イラストの勉強がしたい。
・・・という、学生さん、芸大生さん、全国の女子高生のみなさーん！

・学校の教材で、自分が思い描いているイラストが中々ないので、フリーでイラストが作りたい。
・・・という、グレートティーチャーなあなたに！

つまりは、世の中で芸術とか、パソコン・ネットとか、教育とかに携わったり、
興味持ってる人が対象です。

おっと、今日もだらだらとかいてしまいましたが、
Inkscapeのダウンロードは

こちらから↓
http://www.forest.impress.co.jp/lib/pic/piccam/paint/inkscape.html

無料のワイヤーフレームで、指示書作成

ワイヤーフレームの結構いいやつが急ぎで欲しい！
という方はこちらからどうぞ^^;

http://www.iainstitute.org/tools/
ページ真ん中より少し下のWireframe Templatesから
色んなタイプのワイヤーフレームがダウンロード可能です。

---

では、本題

（本文とは無関係のイメージ写真です）

世界中には、とっても心豊かな方がおられます。

僕自身、アフリカ・アジアと合計１０年くらい

海外で生活をした事がありますが、

みんなとっても暖かい。

だからといって、日本が嫌いではありません。

やっぱ、日本の侘び寂び感覚とかは、

他の国には無いとても素敵な文化だと思うし。

と、何か壮大なカタチで始まりましたが、

今日は、ワイヤーフレーム（WireFrame）についてです。

フリーソフトの提供者は圧倒的に海外の方が多いので、

外人さんは優しいなぁという事で詩的な7行を入れました。

さて、Webディレクターが行う作業の中で

結構時間がかかる割りに、「分かりづらい」とか「色つけすぎ」とか

文句を言われながらも、頑張って作る「ワイヤーフレーム(WireFrame)」

についてご紹介させていただきます。

Webサイトを構築する際、たいがい第一フェーズくらいの段階で

営業さんもWebプロデューサーもWebディレクターもWebデザイナーもWebプログラマーも

みーんな関わるのが、

情報アーキテクチャ（Information Architecture）

です。

サイトを正しく設計し、ホームページに訪れたユーザを迷わせることなく、

目的の場所まで導く事に力を注ぎます。

ブレインストーミング、付箋紙にページタイトルを書いて模造紙に貼ってみる、

あーあじゃない、こーじゃない。。。

時には空気が悪くなる事もありながら、、、。

そして、やっとまとまった話は、ワイヤーフレーム（Wireframe）という形で、

設計されて、デザイナーさんに渡されます。

基本的にはWebディレクターがワイヤーフレームを担当する事が多いです。

お客様の要望、ペルソナによって出来たユーザニーズ、プロデューサー（基本的に上司）からの要求

それらを加味して作ります。

が、ここに結構時間がかかる。

多くの人は、パワーポイントやエクセルのオートシェイプを用いて

作成する事が多いと思いますが、時間がかかる。

プルダウンメニューっぽいオートシェイプとか、送信ボタン、ロゴ、タブ。。。

一度作って、パーツ集を徐々にためていくという方法もありますが、

日本一、面倒くさがりで、フリーが大好きなWebディレクターしんぷる

としましては、

何のためらいも無く世界のドアをノックします。Googleで。

まず、Wireframe　Sample Free　ppt　などと英語で入力します。

すると、出てくる出てくる！

数万件の結果のうち、Meta descriptionに書かれている

Free Wireframe for Power Pointという文字を探し、アクセス！

後はサムネイルを見て気に入ったWireframeをダウンロードすればいいだけ！

http://www.iainstitute.org/tools/
ページ真ん中より少し下のWireframe Templatesからダウンロード可能です。
ここまで読んでくださってありがとうございます。



ダウンロードしたワイヤーフレーム（Wireframe）のスクリーンショットです。

他にもたーくさん、取り扱ってるサイトがあるので、是非探して見てください。

キーワードはこんな感じかな。。。
Free, WireFrame, Sample, Download, Powerpoint, PPT, AI, PNG, PSD

---

笑顔のおじさんのお写真は下記URLよりおかりしました。
（http://gancancer.iinaa.net/kansaibougan/index.html）

無料マニュアル作成ツールWinkで嬉しい熱帯魚？

このまだまだイケてないブログをご覧の方々の中には、

ウェブ関係のお仕事をされている方も多いかと思います。

フリーで便利なツールねぇかなという方にイチゲンさんでもいいので、

このブログを通過して欲しいという庶民的な願いを込めて苦手ですが、


それなりに５日分くらい日記かいてます^^;


将来的には、フリーソフトとか探すのにヒットしてもらえればメチャ嬉しいナァなんて思っています。

だって、僕自身がそういう「これ便利だよー」って紹介されている方々のご意見や


コラムを読んで、いいなぁ、ダウンロードしよー！！

ってなるので、せめてもの恩返しのつもりです。

さて、今日はフリーソフトのご紹介をお届けしまーす。


■質問です。みなさん、ソフトのマニュアルって作った事ありますか？

　・うーんエクセルで作った事ならあるよん。
　・パワポでキャプチャー、オートシェイプで説明そしてPDF化かなぁ。
　・Pukiwikiとか使って作成してるよん。

など、皆さんそれぞれだと思います。

でも、正直面倒くさくないですか？

一連の動きって、一こま一こまプリントスクリーンで画面キャプチャして、
吹き出しでコメント書くって面倒です。

特に面倒なのが、「プルダウンメニューとかフラッシュ！後、動画もウマくキャプチャーできなかったりする！」
ですよね？

そんなアナタにオススメなのが、Winkというソフトです。


「悲しい熱帯魚」





ではありません！


「嬉しい無料画面キャプチャソフト」です！

このソフトを使っていて感動する事はいくつもあります。

ソフトの立ち位置としては、僕的にはFlashとパワポの間って感じです。

その優れた機能を箇条書きします。

１．画面キャプチャーをまるで録画するように撮ってくれる。

２．一秒間に何コマキャプチャするかせっていできる。

３．キャプチャした全コマがスライドショーのようになり、不要な画面は削除できる

４．音声を入れる事ができる（後で編集、再録音も可能）

５．吹き出しや注意書き、画像の追加、マウスポインタの表示表示ができる

６．日本語に対応している

７．一瞬でSWF+HTMLのファイルを作成してくれる（1分くらいの動作を10秒程でSWF化）。

８．PDFやHTMLに変換してくれる

９．サイズを小さくする事ができる

１０．キャプチャ忘れがあれば、追加できる

１１．コマ送り、戻し、何秒表示させる、外部リンクなどが簡単に行える

１２．無料である

★再生中のYoutubeもキャプチャできます（多少途切れます）

http://www.debugmode.com/wink/download.php

英語サイトですが、Download direct from SnapFiles.com

をクリックすればダウンロードできますし、

日本語化はFile > Languages >　Japanese ＞ソフトを再起動で、可能です。簡単でしょ？


カスタマイズもかなり自由にできるので、みなさん、

素敵なマニュアル作りトゥギャザーしましょう！

画面は編集中の画面をキャプチャしたものです。
アムロがもしプログラマーならすねていいかねなさそうな一言にしてみました。