ＨＰコンテスト用にソフトメニュー作成

　某県内のＩＴ技術関係でＨＰコンテストがあることを知り、
さっそく、アクセスＵＰも期待して、応募することに。

コンテストの分野が２分野あり、１．一般と、２．Ｗｅｂ技術
で、２の技術分野で行くかどうか迷ったけど、協賛が
ＦＬＡＳＨメーカなので、おのずとＦＬＡＳＨを使った
ＨＰを期待してのことかなと思い、１．一般で応募した。

　応募するに当たって、現在のＨＰでは、なんとなく
物足りないので、ユーザビリティを強化することに。

でいろいろ考えて、以下の２点で行くことにした。

１．ソフトメニューの導入。
２．トップ画面をマルチサイズ画面対応に。

まず、１．ソフトメニューは、

なにしろ、年代毎にコンテンツが増えていく構成になっているため、
年が経つにつれて、コンテンツの選択が複雑になる。

また、各ページに進むと、そこから他のページへ行くのは、
一旦トップページまで戻ってから進むことになるので、
操作が大変だし、時間も電話代も掛かる。

そこで、考えたのがＰＣでも使われているソフトメニュー。
これを各ページの頭に配置し、各ページから任意のページに
飛んで行けるので、操作性は格段によくなるはず。

操作性としては、

ＰＣでは、まずウィンドウ上部の固定位置のソフトメニュー上を
クリックして、プルダウンメニューを出して、目的のものを選択するが、

ＨＰ上では、ソフトメニューを配置しても、固定にするのは、
表示領域を狭めるので論外。そのため、スクロールすれば、
どっか行っちゃうので、ＰＣのように、ソフトメニュー上で
クリックするというのは、初めて来た人には、分からないはず。

で、ソフトメニューの上にマウスが乗ったら、プルダウンメニュー
を表示する方式を考えた。

あとは、これをどうやって実現するかだけど、まずＩＥでもNetscapeでも
動かすことを考えると、テーブルを使ってはどうもできなそうなので、
レイヤで作ることに。一応、ゲーム等で経験済みなので、
簡単に作れると思ったが、

これが難題。まずメニュー内に表示する文字の書式をＣＳＳで
指定するが、これがよく分からない。で当然ＩＥとNetscapeでは
挙動が違うので、この問題を解決するのが大変。

さらにマウスイベントを取得しながら制御しているが、
マウスを素早く隣の項目に移動するとか、ゆっくり移動するとか、
、するとマウスイベントが来なかったり、
順番が入れ替わったりとかあるので、
この辺は、フラグ制御とタイマ制御でなんとか
おかしくならないように出来た。

まあ、試行錯誤しながらなんとか動くものを作った。

さらにどうせなら、画像を使わずにボタン風に見せたい
ということで、ソフトメニューを５段階のレイヤ構造にして
位置を少しづつずらしながらボタン風にみせられた。

ところが、すべてボタン風に表示すると、１００ＭＨｚクラスの
ＰＣでは表示が凄く時間がかかる。ということで、
ボタン風に表示するのは止めました。T T);;

ということで、かなり素早く表示してくれるのが出来ました。
一応満足ということで。

ＨＰコンテスト用にソフトメニュー作成

　某県内のＩＴ技術関係でＨＰコンテストがあることを知り、
さっそく、アクセスＵＰも期待して、応募することに。

コンテストの分野が２分野あり、１．一般と、２．Ｗｅｂ技術
で、２の技術分野で行くかどうか迷ったけど、協賛が
ＦＬＡＳＨメーカなので、おのずとＦＬＡＳＨを使った
ＨＰを期待してのことかなと思い、１．一般で応募した。

　応募するに当たって、現在のＨＰでは、なんとなく
物足りないので、ユーザビリティを強化することに。

でいろいろ考えて、以下の２点で行くことにした。

１．ソフトメニューの導入。
２．トップ画面をマルチサイズ画面対応に。

まず、１．ソフトメニューは、

初の本格的なゲームが完成

　次に、ゲームに挑戦ということで、何をやるか考えたが
当然野球関係のゲームを前提として、なにしろ、ちまたに
あるゲームやプレステのゲームを見ていると、
上下左右のボタンで操作するので、実際のイメージと
全くかけ離れたゲームの操作性になっている。

これが気にくわなくて、どうしたら実際と同じような
イメージのゲームが出来るか考えていたら、結論として
やっぱマウスで操作するのが、一番しっくりくることに。

というわけで、マウスで野球ゲームということで、
まずは、ノックのイメージが湧いたので、これを作ることに。

初の本格的なゲームが完成

　次に、ゲームに挑戦ということで、何をやるか考えたが
当然野球関係のゲームを前提として、なにしろ、ちまたに
あるゲームやプレステのゲームを見ていると、
上下左右のボタンで操作するので、実際のイメージと
全くかけ離れたゲームの操作性になっている。

これが気にくわなくて、どうしたら実際と同じような
イメージのゲームが出来るか考えていたら、結論として
やっぱマウスで操作するのが、一番しっくりくることに。

というわけで、マウスで野球ゲームということで、
まずは、ノックのイメージが湧いたので、これを作ることに。

基本は、マウスをグラブにして、ボールを投げて、
それをグラブを動かしてキャッチする。

で、グラブを動かすのに、どうしたらイメージ通りか考えて
普通ゲームで使われている、マウスを動かして、
キャッチするときにクリックする方式だと、
キャッチする感覚がなーーーーーーい。

そこで、逆にドラグしながら動かして、キャッチする時に
マウスを離す方式だと、イメージにぴったりということで、
この方式で作成することにけってーーーーーい。

ということで、基本構成が決まったので、まずは、
マウスをドラグしてボールを掴むところを作ったが、
これが思うようには行かない。

　JavaScript1.2の使い方もまだ修行中の身だし、
JavaScript1.2自体にも問題があり
それを回避する手段を考えなくてはいけないしと、
まあ、いろいろ試行錯誤もあり、なんとか基本形を
作った。でも疲れました。

基本形が出来れば、あとはゲーム性とか、表示の飾り
付けの部分は、既にＹＢ関係のもので一応経験している
機能を使うので、単に作って行くだけのため、
スムーズに運んだ。

この辺の開発秘話はＮＧＷサイトのメルマガに書きました。

ということで、ゲームの名前は「１０００本ノック」に。
そしてノッカーは、デザインの才能がないので、適当に
作ったけど、髪の毛なんか小さなマスにデザインするの無理だよ
ってことで、いっそハゲにしちゃいました。
そしたら、顔は似てないけど、誰かさんみたいになっちゃった。^^)

そして、Ｗｅｂの仲間や友人に頼んで、テストしてもらい、
まあ、なんとかまともになったので、JavaScripゲームの普及作成支援を
行っているＮＧＷ（New Game Web）に登録しました。

まあ、このような絵を使った動きのある本格的なゲームは初めてだったけど、
出来としては単純で分かり易いのが出来たんじゃないかと、
まあ、自分なりに満足したかな。。。。

初のJavaScript1.2に挑戦

　JavaScript1.2で作成することを決めてから、
レイヤの勉強を始めた。

　で、作成する基本は、
IEでもNetscapeでも動くことが前提。

これは、ＩＥより自分としてはNetscapeの方が好きだったこともあるので、
ＩＥ自体の方がユーザは多いけど、やはりNetscapeを大事にしたかったので。

で、まずは、ローズジャンプもある「カラオケ応援歌」を作った。
これは、歌詞をリズムに合わせてカラオケのように文字の色を変えていく、
そして、同時にてんてん丸が応援バッドを叩くというもんだけど、
まあ、なんとか面白いものが出来た。でも音がないんでね。^^);;

でも応援歌は選手毎にたくさんあるので、それらは、
ひらがな歌詞、歌詞の時間間隔、応援バッドの動作をコマンドとして
書いておき、それを読み込ませて、動作させるものにした。

で、このコマンドを作るのが大変なのよね。
いちいち歌いながら、作ってくんだけど、１曲１時間はかかるね。

でも、これは、後である事情により削除しました。T T);;;