情熱大陸に出れるってすごいじゃん。。

情熱大陸（TBS）　宮崎学　8月10日　PM11：00放映

「今度gakuが情熱大陸に出るよ」と知人に言ったら、すごいすごいを連発されて、
そんなすごいことならちゃんと告知しないとね・・・
というわけで、お知らせと、裏話などもちらっと。。

最初に取材依頼の話があったときは、なんとあっさりと断ってしまいまして。
かなりの長時間拘束を受けるということで、面倒くさがりの宮崎学は「ＴＶ局の取材はこりごり」と逃げ腰。
番組企画者の方がとても熱心に依頼してくださったんですが、ずっと放置してしまいまして・・・・

これで終わりかな・・・と確定したかと思ったある日とつぜん、駒ヶ根のアトリエまで訪ねてきちゃったのです。
「宮崎さん、それでもどうしても取材させてください」
そのときはちょうど旅先で取材中だったので焦って、とりあえず別の日にアポを。
その熱心さに押されて結局取材を受けることになりました。

それから始まった長い取材の日々・・・・・。
春の森の撮影現場、むささび荘で展覧会の準備、原稿に追われて缶詰状態になってるところ、都会のけもの道で取材する様子、講演会場での様子、仲間と飲むところまで潜入、おいたちも...........etc　ほんと日本中何処にでも取材スタッフがついてきた約４カ月。
私もいくつかの現場に同行して取材してる様子を外から見てましたが・・・・
ときにはヒルに襲われパニックになり（カメラマンさん）
早朝から深夜まで、こちらがいいご機嫌で飲んでいるときもひたすら取材取材・・・
ＴＢＳ取材班の皆さんの取材にかける"情熱"には、私モモンガのほうが驚きでした。

4カ月ほぼ毎日、いったい何百時間のフィルムを回したことか・・・・。それが
たった30分に編集されるんですよアータ。。。└(T_T;)┘ほんとスタッフの方々のほうが情熱大陸です。

というわけで、
どんなふうに編集されてくるのかとても楽しみです。
興味のある皆さんお見逃しなく・・・

↓動画はすっごい懐かしいCM　レアだと思います・・


宮崎学公式サイト

宮崎学　講演のご案内

ブログ　gakuの今日のヒトコマ

ツキノワグマ事件簿

野生動物のライブカメラ

森の仲間コミュニティ（gakuの裏日記も読めるSNSです。仲間募集中）

スタイルが効かない・・何がいけない・？

先日、CSS初心者の友人がメッセで泣いていたので、
下記のサイトを紹介してあげたところ、無事解決した・・とのことでとても喜ばれました。

初心者が陥りそうなCSSの７つの間違い

スタイルが効かない理由はいくつかあって上記のブログに書いてある項目をチェックするだけでほとんど解決するので、慌てずにひとつひとつ確かめていくといいかもしれません。


□外部CSSファイルを読み込み忘れた。（CSSファイルの読み込みパスが違う）

□IDとclassの指定を間違えた。

□子孫セレクタの構造が間違ってた。

□途中のプロパティのセミコロンを付け忘れてた。

□別のところで優先度の高いセレクタで書いているのを忘れていた

↑これが一番やっかいですね。サイトが大きくなってきたり、しばらく時間おいてから
更新したりするときに、以前どんな手順で構築していったか忘れてしまって、ありがちです。

ここから引用-------------------------------------------

●通常セレクタ(bodyとか) 1点
●クラスセレクタ(.contentとか) 1点
●IDセレクタ(#containerとか) 100点
●直接指定(style="color:#fff"とか) 1000点

（例）
#container #headLine .contents { ... }

という指定があったとすると、IDセレクタの優先度は100なので、

#container(100) #headerLine(100) .contents(1)

となります。
優先度は単純に足し算なので、この場合は優先度は「201」となります。

なので、#articles .contents { ... }と書いたとしても、当然優先度の高いスタイルが適用されるのでいくら更新してもスタイルは変更されません。


-------------------------------------------ここまで

というわけで、上記のブログ便利なので。
他にとーーーってもありがちな「CSS勉強する上でぶつかる壁」なポイントを押さえてくれてるので
初心者さんは押さえておくと良いかと・・・・




参考になったよ！って方はwebの森のfacebookページへイイネをしてね(v^ー゜)

アニマル黙示録の写真展と講演会

板橋区のエコポリスセンターにて、環境月刊特別企画として、
宮崎学の写真展と、講演会が行われます。

写真展では、衝撃の問題作「アニマル黙示録（講談社刊・現在廃刊で発売されていません）」の写真をもう一度みたい・・という方は必見です。
６月１日は宮崎学が会場におります。

講演会は席に限りがあります。
先着順となっていますので、お早めにお越しください。
100枚近くの写真上映を見ながら、楽しみながら環境問題に興味を持ってもらえる講演です。


＜写真展＞アニマルアイズ〜動物たちからの警鐘〜
6月1日（日）〜15日（日）9：00〜17：00
エコポリスセンター地下１Ｆホール　【入場無料】

＜講演会＞
●とき／６月１日（日）午後１時〜２時半まで
●テーマ／「動物の目から見た環境問題」
●講師／自然界の報道写真家　宮崎学
　スライド上映を楽しみながら、環境問題について考える内容となっています
●ところ／エコポリスセンター地下１Ｆ視聴覚ホール
●対象／小学生以上
●費用／無料
●定員／120名（先着順です。当日会場へお越しください）


板橋区エコポリスセンターホームページ

地図と交通案内

Flashで手描きイラスト

動画講座で、無謀にもFlashを初めてしまいました。自己流で、FlashMXを使っていた頃から技術的にはなんも進歩してないので、とてもFlashのマニュアルを作るほどのテクはないんだけど、
わたしのよく使っている機能くらいなら紹介できるので・・。
初回はとりあえず、イラストを描く方法・・ということで基本機能を紹介しました。
イラストに興味がない方も、この基本機能を知っておかないと、ナビを作ったり、動かすためのパーツを作ったりするのに、かなり戸惑うと思うので、面倒でも一度各ツールの使い方に慣れておいたほうが効率良いと思います。

ちなみに左のマンガは、Flashで描いてみました。


（１）新規Flashドキュメントの作成

フラッシュで新規にドキュメントを作成し、画面の大きさを設定、
鉛筆ツールを使って、フリーハンドで線を描いてみる方法です。
消しゴムツールの使い方も一部紹介します。

（２）Flashでの線の修正方法

Flashでの線の修正方法にはいくつかあります。
選択ツールで、角度やなめらかさを調整する方法、
選択ツールで選択しておいて削除したり移動したりする方法、
ダイレクト選択ツールでアンカーポイントの移動もできます。
今回は、選択ツールでなめらかにする方法をやってみます。
こういう感覚的な操作は、illustratorやFireworksにはできない、Flash独自の動きですね。

（３）Flashのブラシで色を塗る

Flashでのブラシの使い方は、独特です。
イラストレーターでブラシで絵を描くと、全部に細かいアンカーポイントが付き、けっこうな容量にもなるし、修正方法も楽とは言えません。
逆にフォトショップでブラシで絵を描くと、消しゴムで消したり、色を変えたり・・などはできますが、ビットマップ画像（写真のようなドットの集まり）なので、拡大することはできないし、変形など繰り返せば劣化します。
ところが、フラッシュのブラシは、ブラシで描いた直後に、ビットマップのように合体され、一つの塗りとして認識されるので、容量は食いません。
しかも、イラストレーターのベクターデータのようにアンカーポイントがついて、拡大縮小、変形自由。
同じ階層で上にブラシで塗り重ねると下の色は消えるというのもびっくり。（下の色を消さないで、色の下の空間だけに色を入れることもできます）
とても独特な性質をもったブラシ機能です。
最終的にムービーとして動かすことを目的としたソフトなので、容量を自動的に減らしてくれるというありがたい機能です。

（４）塗り色の修正

１～３までで描いたイラストの色を修正してみます。
線が上にのると、自動的にカットされるあたりが、これまたFlash独自の操作感ですが。
慣れるといろんな処理が早くできてかなり便利です。

（５）イメージのillustratorデータへの書き出し

とっても便利な機能、フラッシュで描いたイラストのaiデータへの書き出しを紹介します。
ちゃんと線の情報と、面の情報が保たれているので、
拡大縮小、線の太さや色など、自由に再加工できとても便利です。
わたしはこの方法で、Flashでイラストを描いて、illustratorデータに書き出しして、仕上げをすることが多いです。

モモンガの描いたイラストはこちら

大阪・カタログハウスの学校で環境セミナーがあります 5月17日（土）

通販生活・・わたしも愛用しているカタログ通販の会社ですが、このカタログハウスで年間通していろんな興味深いセミナーを開催してます。
今回、宮崎学が講師になって環境セミナーを開きますので、ご案内します。
関西圏の皆様、興味があるかたはぜひお越しください。

●カタログハウスのホームページ
http://www.cataloghouse.co.jp/
●講演案内のページ（地図などもこちら）
http://www.cataloghouse.co.jp/study/index.html

-------------------------------------------
自然と人間の共存をテーマに４０年以上にわたり
「自然界の報道写真家」として活躍中の宮崎学さんは、「黙して語らない」自然界を知るためにその懐へ自ら入っていきます。
人間とあらゆる生物をおなじ土俵において、人間中心でなく動物たちからの視線で自然界を見つめつづけ、そのメッセージに耳を傾けています。
「どうしてクマは人里に出現するようになったのか。」
「工場の轟音や車の騒音も恐れない野生動物が増えている。」
「人間が持ち込んだ生物が原因で 天然記念物の野鳥が絶滅の危機に瀕している。」
都市化、飽食、ゴミ問題、国際化、過疎化…人間の生活が豊かになると共に日々変化し続ける自然環境の中で、野生動物は新しい環境に適応し、強かに生きているのです。
野生動物たちをつぶさに観察してきた宮崎さんとたいせつな自然のいまを見つめ直してみませんか。
日本中を巡った冒険談もお話いただけます。

２００８年５月１７日（土）
午後１時３０分〜３時
講師：宮崎学さん（写真家）
●定員：８０人
●参加費：１０００円
●場所：〒556-0011大阪市浪速区難波中2-10-70　なんばパークスタワー3階

お申し込みお問い合わせ

-------------------------------------------
宮崎学の講演案内　（環境問題セミナー講師）

gakuの今日のヒトコマ

公式サイト・森の365日

Fireworksで金色のシールを作ってみる

Fireworksのチュートリアルリンクに載っていた「ゴールドシール」を作る方法を試してみたので、それを動画マニュアルにしてみました。
↓参考サイトはこちら
http://www.designwalker.com/2008/04/fireworks-tutorial.html

チュートリアルの公開元は英語のサイトなので、よくわからなかったところは自己流にアレンジしちゃってます。
ありがたいチュートリアルを公開してくれた元サイト様には感謝です。

Fireworksで金色のシールを作る方法

（１）金色のシール－ギザギザの円を描く
（２）金色のシール－立体感をつける
（３）金色のシール－箔押ししたような文字
（４）金色のシール－文字を丸く並べる
（５）金色のシール－グループ化して回転

１〜５まで順番に見ていただければできるようになっています。

webデザイン・初心者のためのテーブルレイアウトのコツ

ホームページを作る上での基本形に、ヘッダー＋フッター＋２カラムの形がありますね。
よくブログでみかけるこの形です。

ブログはCSSデザインで構築してある場合がほとんどですが、初心者にとってCSSデザインを覚えるのは壁が高い・・・かも？？
というわけで、初心者さんにオススメなのがテーブルを使って作る方法。
今回はテーブルデザインのポイントと初心者さんが間違いやすい部分のお話です。

（１）基本形はこれになります



ソース

---

<table width="500" border="1">
<tr>
<td height="22" colspan="2">ヘッダー</td>
</tr>
<tr>
<td width="129">サイドナビ</td>
<td width="355">メイン</td>
</tr>
<tr>
<td colspan="2">フッター</td>
</tr>
</table>

---

（２）１を改良するコツとしては、すべてのセルに valign="top"を入れて上にくるようにすること

---

<table width="500" border="1">
<tr>
<td height="69" colspan="2" valign="top">ヘッダー</td>
</tr>
<tr>
<td width="132" height="113" valign="top">サイドナビ</td>
<td width="352" valign="top">メイン</td>
</tr>
<tr>
<td height="46" colspan="2" valign="top">フッター</td>
</tr>
</table>

---

（３）で、サイドナビを入れたいですよね・・・。基本枠の中にさらに枠を作りたいときの基本は、こんなふうにするのではなく

---

（これは悪い例です）
<table width="500" border="1">
<tr>
<td height="69" colspan="2" valign="top">ヘッダー</td>
</tr>
<tr>
<td width="145" valign="top">メイン</td>

<td width="339" rowspan="5" valign="top">メニュー１</td>
</tr>
<tr>
<td valign="top">メニュー２</td>
</tr>
<tr>
<td valign="top">メニュー３</td>
</tr>
<tr>
<td valign="top">メニュー４</td>
</tr>
<tr>
<td valign="top">メニュー５</td>
</tr>
<tr>
<td height="46" colspan="2" valign="top">フッター</td>
</tr>
</table>

---

（４）このように、さらに中にテーブルを入れると制御しやすくなります

---

<table width="500" border="1">

<tr>
<td height="69" colspan="2" valign="top">ヘッダー</td>
</tr>
<tr>
<td width="203" height="113" valign="top"><table width="200" border="1">
<tr>
<td>メニュー１</td>
</tr>
<tr>
<td>メニュー２</td>
</tr>
<tr>
<td>メニュー３</td>
</tr>
<tr>
<td>メニュー４</td>
</tr>
<tr>
<td>メニュー５</td>
</tr>
</table></td>
<td width="281" valign="top">メイン</td>
</tr>
<tr>
<td height="46" colspan="2" valign="top">フッター</td>
</tr>
</table>

---

制御しやすいからと、テーブルの入れ子入れ子入れ子・・・をどんどん繰り返していると、
複雑なソースになって、あとで修正したいときなどに混乱する場合もあるので
入れ子は最低限に使うようにしましょう。

この方法の応用編を動画マニュアルにて解説しています。
ドリームウィーバーを使ったテーブルデザインの方法
（１）から（６）まで順番で見ていただくと、どんな手順でやったら効率が良いかわかっていただけると思います。