ニックネーム:   パスワード:
| MyDoblogトップ | Doblogポータル | Doblogガイド | ユーザ登録 | 使い方 | よくある質問 | ツールバー | サポート |
Tripartite Man
Blog
[ 総Blog数:290件 ] [ このMyDoblogをブックマークする ] [ RSS0.91   RSS1.0   RSS2.0 ] [ ATOM ]
2005/09/14のBlog
[ 08:43 ] [ ネットワークコンテンツ科 ]
●CGI
・Perlの記述方法
 テキストはshift JISではなく、EUCで記録する。
 
1.#!/usr/local/bin/perl を1行目に必ず書く
2.関数を指定した後に、 ; セミコロンを入れることでひとつのステップと認識
3.# のあとに!を入れなければ、自由にコメント入れることができる
4.prinr('test'): で半角英数文字(この場合はtest)を出力
5.jprintで日本語も表示できる
6.複数行文字列(ヒアドキュメント)
 jprint(<<_EOS_); ←「EOS」はなんでもよい
 とすることで<br>
複数行の<br>
 文字列を書ける
 _EOS_ ←「EOS」が再度でてきたところで終了。

7.print(3,14 ."<br>") ←数値に続けるときは「.」を使う
8.print(1+1. "<br>") ←計算結果を表示

・httpdでのログ参照
 [ファイル]から[ログを開く]でエラーとサーバーへのアクセス記録が見れる。
2005/09/13のBlog
[ 20:17 ] [ ネットワークコンテンツ科 ]
●HP作成(HTML)
・Web作成のためのラフレイアウト
 テーブル作成タグを使って、ページをつくっていくための参考として、ブラウザにFirefoxを用いて、Yahooなどのポータルサイトを見る。
 Firefoxでは、 webdeveloperプラグインをinfoaxiaからダウンロードすることで、そのページで使われているテーブル要素(枠とセル)を表示させることができる。[枠表示]―[テーブルのセルを枠で囲う]

 一見単純なレイアウトにみえても、実は空白の表(セル)を使って余白をつくっていたり、表内にさらに表(テーブルネスト)を使っていたりと、いろんな工夫が確認できる。
 一番外側の表枠には赤、その中の表には青、と色分けして表示されるのがおもしろい。

・photoshop上でページレイアウト(ラフ線引き)
 チラシをもとにwebページをつくる作業の続き。
 ただし今度は、あらかじめページ上の表に切抜きした画像をはめこんでいく工程をとる。
 手順としては、まずチラシの元レイアウトを参考に、だいたいの割付(幅・高さ・行数・セル数)を考えてHTMLで表をつくる。その後に切り抜いた(スキャンなどから)画像を表中にはめこんでいく。
 素材を切り抜く際は、photoshop上で、元画像の上にレイヤーをつくり、鉛筆ツールなどでラフレイアウトの線をひいてみる。そうやって、どの素材を切り抜く必要があるか、また、表としてつくる際はどんなふうに行やセルを設定したらいいか、考える。

 また、<td>□</td>というかたちで、<td>タグの間に全角スペースを入力しても余白はできるが、全角スペースに使ったフォントサイズが小さいと、ブラウザの文字サイズ変更をされた場合、余白のサイズが上下してしまうことがある。
 それを防ぐために、GIFなどで透明なドットを背景画像として表に入れ込む。(この画像をスペース用の画像:スペーサーという)


</td>
2005/09/12のBlog
映画を見てからもう一ヶ月近く経ってしまった。
 それでもなお脳裏に残っているのは・・・

 ソ連軍の侵攻に備え、官舎内のすべての書類を焼き払うため、窓という窓から紙吹雪が舞う。

 官邸地下の要塞でヒトラーが言う。「前線で死ぬのは、゛若者゛の務めだ」

 なぜかこのふたつのシーンが忘れられない。
 それは、滅びと狂気という主題を端的に映し出したシーンだからか。

 映画の中で延々と続く、ヒトラーの誇大妄想と周囲への罵倒、そして絶対に「姿を見せない」爆撃機とソ連軍。
 閉鎖空間での生活感は、観客に常に圧迫感を与え続ける。
 そこに、遊興としての映画のカタルシスはありえない。
 
 だが、だからこそ瞬間瞬間のセリフとカットにわれわれ観客は目と耳を注ぐ。
 常に「死」と「狂気」の影にとり憑かれた人間ヒトラーに、そして紙くずのように死んでいく兵士たちに。
 敗戦を意識するほどに、捨て鉢の高揚と絶望を行き来する重臣や側近たちの姿。

 そこに陰惨さは少なく、滅ぶものの美しさ、可笑しさだけが伝わってくる。
 なぜ、こんな事態になったのか?
 なぜ、国民はここまでヒトラーを信奉したのか?
 そのプロセスは一切描かれないのだ。

 そう考えれば、「事実」を伝えるドキュメント映画としては失敗かもしれない。
 でも、この映画の目的は、「真実」を伝えることであって、「事実」を伝えることではないのだろう。
 
 最期の、本当の最期の瞬間に至るまで、人間ヒトラーにどんな日常と感情があったのか。
 劇中の台詞、「総統の内面は謎だわ」
 誰もがそう思い、それを知りたがるからこそ、監督はヒトラーが自殺するまでの「経緯」を丹念に追っていったのではないだろうか。そこに「答え」はないとしても・・・


 
 

(備考)

映画にもちょっとだけ出てくる伝説の女性パイロット、ハンナ・ライチェ

世界で最初の女性飛行テストパイロットであり、ドイツ軍のものなら、ヘリコプターからV1ロケット(試作機)まで、乗らなかったものはなかったという逸話があるそうです。

彼女自身による著作として、"The Sky My Kingdom" (Greenhill Military Paperback S.)も出版されています。




[ 12:50 ] [ ネットワークコンテンツ科 ]
●HP作成
・テーブル(表)作成
<td colspan="">:表の横にまたがるセルをつなげる。colspan="2"とした場合、セル2つを1つに統合する。
</td><td rowspan="">:表のたてにまたがるセルをつなげる。

・表をブラウザ画面中央に常に表示させる
テーブルのタグ全体を、さらに<table>でかこむ。記述は以下のように。

<table border="0" cellpadding="0" width="100%" height="100%" cellspanding="0">
<tr>
<td valign="middle">
<table align="center"><tr><td>~</td></tr> </table>

</td>
</tr>
</table>
<!-- -->:コメントアウト。ここに書いたテキストはHTML上に表示されない。のように使うとよい。


●CGI
・環境設定
 ActivePerlのインストール
 UNIX系にあわせたパス構成にするため、以下のような構造でフォルダ作成
C\home\web\cgi-bin
C\home\web\public_html
C\usr\local
 httpd(ローカルサーバー)との連動。
 ez-HTMLとの連動。</table></td>
2005/09/11のBlog
[ 18:14 ] [ ネットワークコンテンツ科 ]
●画像作成(photoshop)
・チラシからWEBページをつくる
 クライアントから、「この広告チラシから、HTMLのページつくってね」といわたれたという設定。
 素材となる画像やアイコン、見だしなどを紙のチラシから切り抜き。
 ただし、単に切り抜いたまま使うのではなく、影や白枠をつけたり、複数枚をかさねたりと工夫する必要がある。
 [イメージ]-[回転]-[角度補正して切り抜き]を利用すると、角度のずれ直しと切り抜きがいっぺんにできる。

・白縁取りの方法
 レイヤーエフェクトを使わないでやる方法。
 矩形選択ツールで、写真の内側を選択。その状態で、[選択範囲の反転]をした後、[編集]-[境界線を描く]で「内側」を選択する。画像は「覆い焼き」を選んだ場合。

●HP作成(HTML)
・テーブル(表)の作成
<table></table>:表の開始
<tr></tr>:行、row
<td></td>:セル data?
ソース上は以下のように書き連ねる

<table>
<tr>
<td>
</td>
</tr>
</table>

<table>タグの属性
<table cellspacing="ピクセル数">:罫線の太さ
<table cellpadding="ピクセル数">:セル内の文字などまでの余白

<td>タグの属性
</td><td nowrap>:</td><td></td>間の要素が次の行に折り返しになるのを防ぐ

</table></table></table>
なにかを成そうとするとき、
みんな(個人)で新しいアイデアを
生み出そうとするときは、
ロジックだけでもだめなので、
発想の枠を広げていく必要がある。

でも、たとえ質の高いブレインストーミングでも、
個々(グループ)の暗黙のコンテクストや、
無意識の制約をのりこえることは、
なれないと難しいと思う。

そこで、「魔法」を使うことを提案してみたい
いや、魔法っていってもホントの魔法じゃなくって、
「思考停止」を防ぎ、「無意識の制約はずし」のための
考え方なんだけど。

たとえば「1億円ほしい!」と思ったとする。
そして、様々な手段を考えることだろう。
けど、結局は「能力」「運」「人脈」とか
いった制限にしばられがちだ。

でも、もし自分が「魔法」を使えたらどうだろう
ドラえもんの四次元ポケットでもいい。
・悪人、悪徳政治家の金庫から魔法で奪い取る
・ほれ薬でセレブをたらしこむ
・さわったものを黄金に変えられる
などなど・・・もりもりアイデアがわいてこないだろうか?

もちろん、このままじゃただの妄想なので、
もう少し具体的に落とし込む必要がある。

たとえば、悪人からお金をうばいたいんだったら、
エリン・ブロコビッチ」じゃないけど、
企業に裁判をふっかけて金をふんだくるという手もありそうだ。


セレブと逆玉の輿をねらう、という発想を生かすなら、
お金を個人所有のものじゃなく、複数の人間でシェアするもの、
という発想につなげられそうだ。
マネーシェア

まだまだ荒唐無稽に感じるけど、
少なくとも思考は前に進むし、
普段自分が何に制限されているか
(逆にかえせば、なにに優先順位をおいてるか)
がわかると思う。

以上、Think Bigというスキル(2) ― チャレンジの4ステップ「TESS」というコラムにからの発想でした


2005/09/10のBlog
[ 18:40 ] [ 日々・つれづれ ]
小石川植物園で寝転がってぼーっとしてたら、
白くて大きい鳥が、
カラスの一団におわれながら
すーっと上を横切っていった。

首を折り曲げた、独特の飛行姿勢。
シロサギであろう。

しばらく園内の高木にとまっていたが、
やがて悠々と飛び去っていった。
東京港野鳥公園にでも行く途中の個体であったのか・・・



東京の真中で、シロサギを見れるとは!
でも、200年くらい前は、小石川(文京区)のあたりも
鷺が群れ飛ぶところであったのです。↓

「文京区の坂」より
吹上坂(ふきあげざか)下は「播磨たんぼ」といわれた水田であり、しかも小石川が流れていた。この水田や川は、鷺の群がるよき場所であり、大正時代でもそのおもかげを止めていた。
 雑然と鷺は群れつつおのがじし
 あなやるせなき姿なりけり 古泉千樫(1886~1927)



うん。今は、こうだけど、
身近なところから命を紡いでいければ、
きっとまた鷺のくる場所をつくれると思うのです・・・
2005/09/08のBlog
[ 23:45 ] [ ネットワークコンテンツ科 ]
●画像作成(photoshop)
・ディズニー(?)エフェクト
 デコラティブ&コミカルなかんじを出したいときに。
 これまでやってきた文字輪郭の選択⇒別レイヤーで選択範囲拡張&範囲塗りつぶしという手順を何層かくりかえす。(画像参照)レイヤーエフェクトは適宜使用。

・フリーフォントのインストール
 世の中にはいろんなフォントがあることを知っとけ、ということで。

『フリーフォント最前線』

あくび印「うちのフォントは萌え系ふぉんと(爆)」

インストール手順
1.サイトなどからフォントデータをダウンロード
2.[コントロールパネル]-[フォント]フォルダ-[ファイル]から「新しいフォントをインストール」を選ぶ。
3.ダイアログに従ってフォントをインストール
 以上でダウンロードしてきたフォントがアプリケーション上で使えるようになる。
 ただし、1byteフォントだと、英字&ひらがな対応だったとしても、日本語は「直接ひらがな入力」しかだめ。ローマ字入力受け付けない。2byteならローマ字入力のひらがなもOK。
さらに、
TrueType:ふつうはこっち使っとけ。
OpenType:DTPで使われる。対応ソフトないとだめ。



●HP作成
・色の知識
 色の3属性。PCCS24色相関による相性のいい色の説明。
 同系色:色相環上でのずれは少ないか、ほぼ同じ。色相は同じで、明度や色を変えた色。
 類似色:色相環情でのずれは20~30度。色相が近い色の組合せ。
 補色(反対色):色相環で対象の位置にある組合せ。180度のずれ。

・photoshopのカラーパレットを使ったHSBの説明。

 色相Hue
 彩度Saturation
 明度Brightness 

photoshopのHSBにこんな意味があるなんて・・・
なるほろ!
色相Hue、彩度Saturation、および明度Brightness
パステルカラーで同系色なんかをつくりたい場合、
彩度、明度を固定したまま色相(H)を動かせばいいわけだ

↓色相や配色を感覚的に把握できるすごいサイト
「色彩・配色レッスン 」

・WEB上で2色の色を使ってて、もう1色増やしたい、というような場合。
1.1色を使ってシェイプ(なんでもいい)をぬりつぶす。
2.もう1色を使って別なシェイプを別レイヤー上でぬりつぶす。
3.上でつくったレイヤーのうち1つの透明度を下げて、シェイプ(色)をかさね合わせる。
4.重なり部分の色を使うと違和感のない配色ができる。
[ 22:23 ] [ ネットワークコンテンツ科 ]
●画像作成
・大きさ、解像度の違う画像をウィンドウ間で移動
 元画像が大きすぎる場合、規定の大きさにトリミングするか、解像度をあらかじめ小さくする。

・タイトル文字のエフェクトを手作り
 テキストエフェクトの「スプレーステンシル」を手で効果をつけてみる。
0.準備としてテキストレイヤーの上に、新規レイヤーを作成しておく。
1.テキストレイヤーをCtrlを押しながら選択。文字の外郭部分が選択される。
2.文字の輪郭の選択範囲を維持したまま作業をするレイヤーを新規レイヤーに移す。
3.選択範囲を拡張する。
4.描画色(もとの字と違う色で)で塗る。
5.いったん選択を解除し、フィルターの[ぼかし]-[ガウス]でぼやかせる。
6.テキストレイヤーをぼやかしたレイヤーの上にもってくる。または、再度テキストレイヤーで文字の輪郭を選択し、ぼかしレイヤー上に選択範囲をもってきて、文字のあるところをdeleteして空白部分をつくってもよい。
・ヘッダー部分をつくってみる
 おおまかなラフレイアウトで、タテ、ヨコをきめ、ボタンの数もきめておく。ヘッダー画像の下にボタンを配置すると、それらしく・・・見えるはず。

●HP作成(HTML)―リンク作成
・ファイルの指定方法
 画像ファイルなどを指定するとき、ファイルのある場所によって指定方法が異なる。
 1.sample.gifが同じ階層にある <img src="sample.gif">または"./sample.gif" と表記。 "./"は自分と同じ階層を示すが、省略可。
 2.一つ上の階層にある "../sample.gif" "../"をつける
 3.二つ上の階層にある "../../sample.gif"
 4.同じ階層のimgというフォルダ内にある"./img/sample.gif"。例によって"./"は省略可。
 5.一つ上の階層のimgフォルダ内にある"../img/sample.gif"

・リンクにつかうタグ
<a> aはアンカーの意味らしい。
 </a><a href="index.html"></a>:リンク先を指定。hrefはhyper reference?
<a href="mail to:xxx@yahoo.co.jp">問い合わせ</a>:メールソフト起動
 <a href="http://www.yahoo.co.jp">やふー</a>:外部サイトへのリンク
 <a href="http://www.yahoo.co.jp" target="_blank">でクリック時に新しい画面を開く。

 <a name="●●"></a>でページ内のリンク先(アンカー)を指定。
<a href="#●●"></a>でそのアンカーに移動できる

 <a target="_blank" href="img/a01.jpg">~</a>で画像タグ<img src="">を囲むことで、画像にリンクがはれる。(新しいウィンドウ開く)
 また、<img>タグ内に<img border="0" src="img/a01.jpg">のようにborder="0"を入れることで、リンク可能を示す枠線の色を消すことができる。
2005/09/06のBlog
[ 18:58 ] [ 植物園・動物園・水族館 ]
ニューヨーク植物園のサイトがきれいだったので、ダーレム植物園(ベルリン)もさぞきれいなHPを持ってるだろうと探してみたら・・・

これはどういうことだ!!
Help for the Berlin Botanic Garden is still needed

財政難なのか・・・
それにしてもこのHPはひどいな・・・
[ 12:41 ] [ ネットワークコンテンツ科 ]
●画像作成(photoshop)
・iモード用画像表示
 [ファイル]-[自動処理]-[iモード画像作成]-[ソース画像を選択]
 同様に[自動処理]-[PDFスライドショー]でPDFファイルのスライドショーつくれる

・ボタン作成
 1.シェイプを利用して外枠を作成
 2.テキストを打ちテキストレイヤーつくる
 3.シェイプに対して[レイヤースタイル]から[ベベル]などで効果
 4.必要があればテキストに対してもドロップシャドウ
 5.画像などもテクスチャとして使える(下のレイヤーとグループ化)
 6.いったんpsdファイルとしてレイヤーを保持しておけば、テキスト、テクスチャを変えることでどんどん違うパターンのボタンができる



・選択範囲をつかったエフェクト
 レイヤーエフェクトの「ベベル」を使わなくても似たようなかんじのエフェクトができる。

 1.円形の選択ツールで円を描き、描画色でぬりつぶす
 2.レイヤーをCtrlキーを押しながら選択し、円の外縁部分が選択範囲になってることを確認
 3.円の左斜め上に選択範囲を移動させてから、[選択範囲の反転]
 4.[イメージ]-[色調補正]-[明るさ・コントラスト]を選んで、円の右下の影の部分をつくる(選択範囲を暗くする)
 5.右上に明るい部分をつくるときは、3.で選択範囲を右斜め下に移動させてから選択範囲を反転。以下同じようにして選択部分を明るくする。

 画像は左がレイヤーエフェクト「ベベル」を使った場合、右が選択範囲+明るさ調節したもの。
 もっと自然にグラデーションをつくりたい場合は、上の3の後に[選択範囲]から[境界をぼかす]を選んで、同じように明暗をつける。

・文字のアウトラインを人力でつける
 レイヤーエフェクトのテキストに対する効果を、自分でできるようにする

 1.テキストをかいてテキストレイヤー作成
 2.さらに新規レイヤーを作成
 3.テキストレイヤーをCtrlをおしながら選択し、文字の縁取りを選択する
 4.そのまま、新規レイヤー上で文字の縁取り選択を維持。[選択範囲の拡張]でふちどりのあつみをだしてから、描画色でぬりつぶす。
 5.テキストレイヤーを再度Ctrlをおしながら選択。選択範囲を維持したままふちどりのある新規レイヤー上に選択範囲を移す。ふちどりと違う色で文字ふちどりの選択範囲をぬる。あるいはそのままDeleteすれば、透明なアウトラインができる