2021年3月31日水曜日

Javascriptその19(コードの改善について)

  第二段階の発表時に、「かけた時間のわりにクオリティが上がっていない気がする」と書きましたが、原因が思いつきました。短くて分かりやすいコードの書き方にめちゃくちゃ時間をかけたというものです。


 これ、発表物をアプリ化したからここの努力は私しか分からないんですよねー。つまり自己満。しかし、コードを整理したことは今後の発表物を作っていく時に大きな武器になると思います。いわば、今回はジャンプのためにしゃがんだ状態といったところでしょうか。

 いつ跳べるのかはちょっと分からないですけどね。


 とりあえず、次の発表は4月末の予定です。

第二段階発表

 どうにかこうにか、月内に発表をすることができました。もちろんホームページからダウンロードできるようにしましたので、ぜひ試してみてください。

 案の定Electronwの使い方をこの20日できれいさっぱり忘れてしまったので、予定よりアップが2時間ほど遅れました。こちらのサイトが今日現在では最高に参考になると思います。


 しかし、15日で製作したはずの第一段階からあんまりクオリティが上がっていない気がするのはどういうことだろう。確かに第一段階の発表前ほどの猛烈な追い込みをかけなかったというのは事実なのだが、ちょっと今回は発表することが手段ではなく目的化してしまいすぎた感じがあって少し反省せねばと感じている。

 私特有の「デッドラインに遅れはしないが超絶ギリギリになる」という特性が発揮されてしまい、テストプレイもダウンロードのテストもほとんどしないまま発表してしまった。


 目標を達成できたことで自分を褒めるのが半分、目標を形の上だけで達成したにすぎないということで自分を責めるのが半分ということにしておきましょうか。


 ※本記事作成中に日付をまたぎましたが、発表はきちんと3月中にしましたよ。

2021年3月28日日曜日

その他 その7(キャラデザ相手の決定)

 今日はゲーム制作の方は全く進まず…相変わらずsqlite3のインストールがうまくいかずに躓いています。


 しかし、今日はキャラデザの依頼先が決まったというのがでかいです。

 実は、最後の3名から誰を選ぶのか決定の直前までずっと迷っていました。というか、直前になって依頼相手を変更しました。しかし、残りの2名の方には別の方面でお仕事を依頼してみることにしました。ダメかもしれないけど、魅力的なキャラクターを描いている方のイラストを少しでも使ってみたいなと思ったのです、

 もちろん、それによってお金は余計にかかってしまうけれど、本プロジェクトに関しては予算はケチらないと決めているので気にしない。


 さて、明日は髪を切ったり日用品を買ったりして夜にまたプロジェクトの続きに取りかかります。

2021年3月27日土曜日

その他 その6 (お詫び)

 私の手違いで、3/27(日付が変わっていたので3/28表示)の内容を削除してしまいました。

 本ブログ以外にバックアップは一切取っていなかったので、復旧は難しい状況です。

 また、3/29は更新を忘れて寝てしまっていました。


 どちらも本プロジェクトには大きなダメージではありませんが、今まで毎日続けられていたというのは自分なりの小さな自信だったので、ショックはあります。


 でも、プロジェクトをやめる理由にはなりません。

 今こそ最近言うことの減っていた二つのフレーズを思い返そう、牛歩でも進み続ければいつかは着く、そして今がいつだって今が一番苦しい。

 明日からまた頑張ります。

2021年3月26日金曜日

Javascriptその18(登録地点に近づいた場合の処理の記述)

  …発表物の製作にとりかかると言いましたが、沼にはまりました。何沼かっていうと、配列とループの組み合わせ沼です。何これ超絶楽しい。書いても書いてもどんどん短くて楽しい書き方が思い浮かんで何度でも書き直しちゃう。

 でも、製作が進んでいないかというとそうでもありません。昨日登録地点を地図に表示しタはいいけど、地点が何十か所とあるので、これら全部にイベント登録は無理だな、と思いました。しかし、今日になってその配列とループをうまくすればわずかなコードで数十か所のイベント発生をまとめて記述できてしまうことに気がついたのです。すごくない?

 まあ、まだまだ実現は出来ていないのですが、実現すれば発表物の3割くらいは完成したと言えるかもしれません。ああ、素晴らしきかな配列とループ!

 これからもいっぱいこういう面白さに出会えるといいなあ。


 あと、職場ではタイミングを見てさぼりながらRubyの勉強をしています。JavaScriptとPythonで基本的なプログラミングの仕組みは分かっているので、コードを書けなくてもテキストを読んで各種定義を覚えていくだけで基本的なことは分かりますね。

 でも、今でもPHPの方がいいんじゃないかという思いは頭の片隅にあります。最終的には両方勉強するから、sassの実行のために環境構築を済ませてあるRubyを先にしたわけなのですが。はやくon railsの便利さを実感したいものです。

2021年3月24日水曜日

Javascriptその17(コードのスリム化とイベント発生地の登録)

  全開オブジェクト指向うんたらと書きましたが、今日になって冷静な頭で考えてみるとオブジェクト指向を使うほどのことでもなく、地図上の状況の特定要素を関数の引数にしてその関数を使いまわせばいい、という至極当たり前な行為でわたしのオブジェクト指向デビューは元の木阿弥になりました。ちなみにもう一つ北海道に点在する聖地に北海道開拓のシンボルの五稜星を表示させたんですが、こちらは配列の組み合わせでシンプルな(といってもそれぞれの聖地の位置座標で50行くらいあるんだけど)コードに繰り返し処理も組み合わせることで落ち着かせることができました。本当はオブジェクトを使う予定だったんだけど、たまたま作りがオブジェクトよりも配列に向いたというだけです。

 数日前から月末の発表物に向けてーと言っていますが、じつはこれも月末の発表物の作成の初期段階となっております。何を作るかはもう決まっているので、あとはそこに向けて着実に歩を進めていきます。あと一週間切っているけど、最低限のものは出来挙げりそうです。


 それでは今日は激ネムなのでこのあたりで。

2021年3月23日火曜日

CSS その3(svgアニメーション)

  ようやくある程度納得のいく段階にまできました。


 なんだかすごく停滞したような気もしますが、いずれPHPかRubyは学習しておかねばと思っていたので、ここ数日でRubyのことを少しでも知れたのは良かったと思います。


 次は、GoogleMap上で選択した地点にStreetViewPanoramaを切り替えるボタンを作成したいと思います。多分難しいです。構造自体は今までに比べると非常にシンプルだけれど、書き方が検索してもあんまり出てくる気がしないので。逆に言えば検索して見つかればそれであっさり実現できそう。開けてみてのお楽しみってやつですね。


 昨日うだうだどーでもいいこと書いたので、今日は短めに終わらせます。

2021年3月22日月曜日

CSS その2(svg図形)

  いやあ、予想以上に一筋縄ではいかない。sassを使うためにはrubyをインストールする必要があり、インストールした上でcssにコンパイルをしなくてはいけない。この分かるには超絶当たり前で、分からない人には全く意味の分からない作業は昨日の段階で終わったのですが、今日に入って実際にsassをきっちり書くのがやはり難しい。


 具体的には、円形の図形をカウントダウン形式にして消していきたいので(多分この時点では読んでいる人にはやりことが伝わらないと思うので、月末の発表物をお楽しみに)、svg図形を記述する必要があります。そして、現在それに必要な要素をJavaScriptで作り出すところまでは成功しました。

 じゃあ何が足りないのかというと、内部のcircle要素に必要な情報をJavaScriptから記述できない状況なのです。

 まあこれも読んで意味がわかるわけがないので、ちょっと絵にたとえると、背景は書けてるけど人物がそれに合うように描けないとか、体は描けたけどどうも顔の表情がうまく描けないとかそんな感じでしょうか。自分が出来ていないことなので全然違うかもですが。


 あと、キャラデザの選考は質問も落ち着いて、来週の候補者の絞り込みまではひと段落したように思います。

 しかし、やっぱりデザインやイラストの業界も供給過多状態なんだろうなあ、というのをひしひしと感じます。私は本業の仕事で多少広告代理店や印刷会社なんかと付き合いがあるのですが、やはり田舎のデザイン系の会社は先細っていくのが見えちゃいますねえ…。地元密着で理解がありますと言って外部の業者との差別化を図る会社が多いけれど、それを売りにしていくと今度は地元の個人事業主との取り合いになっていくわけで。ただでさえフリーランスの人が増えている状態ですから、地元にも個人で請け負ってくれる人はきちんと探せばいるのです。まあ、現状では実績がないから行政や歴史ある企業は個人には頼みにくい面はあって、お堅いところは地元中小企業、社会の変化に合わせて生まれたところは個人と住み分けができているとも言えますが、長期的に見てその均衡がどうなっていくかは、新聞社とWebメディアの関係と同じようなものです。なくなることはないでしょうが、パイは小さくなり現存の企業と人員数は保てないのは間違いありません。

 ちなみに、広告代理店と印刷会社って同じくくりにするのは暴論じゃないか、という疑問を抱かれる方もいるかとは思いますが、私の住んでいるような田舎の場合は本来の広告代理店に必要なマーケティングとかの統計的処理をきちんとできる場所がないので、結局印刷会社のやってるデザインと印刷という領域に侵入していくしかなく、競合することになります。まあ、大手の広告代理店がきちんとできているかというと…このへんでやめておきますか。


 とりあえず今作っているものが完成したら月末の第二段階の発表物の作成に取りかかります。構想はできているので、あと1週間あれば多分間に合う…はず!

2021年3月21日日曜日

CSS その1(SASSとの出会い)

  ちょっとタイトルが衝撃的ですかね?w


 でも、私にとっても衝撃的だったので。昨日、「CSSだから簡単ってわけじゃない」などと、CSSとそれを主に扱うWebデザイン系に理解のある人間というスタンスをとってましたが、やっぱりダメですね。理解のある人間アピールしているうちは理解していないんですよ。あれですよあれ、男性の中にも「女性に理解のある俺」アピールをそこはかとなくしている人がしますが、そういう人ほど本当は理解とは遠い位置にいるっていう現象。あれと同じですよ。

 そして、自分がそんな野郎だったことを痛感したのが、標題の出会いです。SASSの特徴について某Webサイトから引っ張て来たものを並べますと、

・入れ子の使用が可能

・変数を利用できる

・四則演算が可能

・関数を使用できる など

 …え?これってもはや正真正銘プログラミング言語じゃないの?違うの?演算処理ができるとかもうこれをプログラミング言語と呼ばなかったら何をプログラミング言語と呼ぶの?

 という衝撃だったわけです。 そしてSASSのことについて調べていたら、今日が終わっていました。


 いや、やったんですよ。ロジマガの進行も。絵師の募集に詳細な依頼内容を追記しましたし、たまってた質問にもいっぱい答えましたし、そのために必要なLive2Dへの知識もうっすらと入れましたし。

 でも、今日やった内容として挙げられる成果物は0。いやー、まずい。これはまずい。大反省。明日仕事ですが、ちょっと夜更かしして少しでも今日の成果を形に残します。そしてこんなことは今日っきりにします。

2021年3月20日土曜日

ロジマガのキャラクターデザインをしてくれる方募集中(もちろんギャラ有)

  昨日だったか一昨日だったかからオリジナルキャラクターを書いてくれる絵師さんを募集し始めました。予算は最大30万円で、予算よりもスキルと熱意重視で決めていく予定ですので、腕に自信のある方はご連絡ください。素晴らしいキャラデザが出来れば1人のデザインとLive2Dで動かすために必要なモーションを描けば30万円というのはけっこう破格だと思うので、ダメもとでもいいから興味を持った方はぜひご連絡ください。

 とりあえず今回は、椎名薫さんみたいに20代の大人なスラリとして女性のキャラデザをお願いしようかと思っています。詳しく聞きたい方は、ご連絡ください。本当に素晴らしいキャラデザが出来そうだと私が思えば、マジで30万円出します。そこまでの人はいなさそうだなーと思ったら(偉そうですが)、最も私の好みに合ったデザインをしてくれそうな方と値段交渉をして決めたいと思います。

 ただまあ、大槍先生の絵やキャラデザと比較されるのは必至なので、気軽にってのはどうなのってのも事実なんですがw

Javascriptその16(DD式C.B.S.の搭載)

  今日は標記の内容を実現しました。詳しくは、twitterの方に短い動画を2本挙げていますのでご覧ください。


 しかし、作業の大半は今まで書いたコードの見直しに費やしたのも事実です。以前も書いた気がしますが、一度書いたコードも後から見ると「なんて非効率な」という書き方がいっぱい出てきます。

 以前は、こういうのに時間を割いてはいけない、と書きましたが、コードを効率的にすることは後々のシステムの運用を楽にするという側面があるので、将来的なことも考えて今のコストと将来のコストを天秤にかけて判断していくようにしました。まあ、まともなプログラミング経験は一ヵ月程度なので、まとも判断が出来ていないことも多いんですが、判断を繰り返すことでその精度が上がるというのは間違いないだろうと思いますので、重要でしょう。


 明日は、選択肢を選ぶタイムリミットを視覚的に判るようにアニメーションを作成する予定です。CSSでできそうかなー、とは思っていますが、CSSだから簡単ということではないので、慎重に挑みます。

 あと、将来を見越してPHPあたりで利用者からデータの登録を受け付けるシステムの構築の準備も始めていかねばなりません。最初の方に書いたとおり、ロジマガはいつか私の手を離れても自動で飛んでいくようにしたいので。

2021年3月18日木曜日

Javascriptその15(イベント発生に伴う処理)

 すっかり今日の記事を書くのを忘れておりました。危うく寝るところだった。


 今日はイベント発生に伴ってイベントボタンを消去したり、それまで出ていたメッセージを削除したりといった処理を記述していました。

 しかし、予想以上にJavaScriptの非同期処理の問題は大きいみたいで、まっさかここの処理の順番で問題になることはないだろう、と思っていた部分が案外許されなかったりします。私の頭では、もうすでにコード内でのasyncとdeferの関係性がめちゃくちゃになっており、完全に「何か分からんが動いてるからヨシ!」状態になっております。

 まあ、進んでいるのでヨシ!


 明日はイベントの自動進行処理の実装に取り掛かりたいと思います。

2021年3月17日水曜日

Javascriptその14(イベント発生システム)

 まだしばらくイベント発生システムの構築に時間がかかりそうです。

 トリガーとして使用しなくてはならないのは、

1) 場所

2) 時間

3) イベント進行度

 というイメージです。こうやって書くと簡単ですが、分岐は相当複雑にならざるを得ません。まあ、でもこの辺は手間がかかるだけで、システムの根幹さえできてしまえば割と楽ちんなわけですよ。…多分。


 しかし、問題はやはりあって…プレイヤーをあっと言わせるような部分が今のところ存在しないんです。もちろん、そればっかりがゲームの良さかと言われれば違うんですが、グラフィックやシステムできちんとしたゲームのようなクオリティを出すのは無理なので、そうなるとやっぱりストーリーやちょっとしたポイントでプレイヤーの心を揺さぶる部分がほしいですよねえ。まあ、それがホイホイできたらゲームクリエイターとしての才能に溢れすぎでしょと言われればそうなんですけど。


 あと、最近twitterで情報を載せられていないから、そろそろなんか載せたいかなー。これから作ってみよっと。

2021年3月16日火曜日

Javascriptその13(Dateオブジェクト)

  今さらですが、JavaScriptとjQueryの記事を分ける必要ないですよね。結局は同じものなんだから。時間がある時にやりたいと思っています。


 そして、前回宣言していたように、ついにイベント進行システムのために面倒なコードを書き出してしまいました。Dateオブジェクトを使ってイベント進行の処理をし始めたのです。結果、今まで5行くらいで書けていたコードが20行くらいにまでなってしまいました。想像通りに色々と苦戦しましたし、これからも苦しめられていく予感しかしないので、本当は前のコードをベースにしたかったんですが…。

 しかし、前向きな見方もできます。Dateオブジェクトを使用したことによって、今まではゲーム開始の瞬間を基準にした処理しかできなかったのが、コンピュータで設定された時間を基準にした処理ができるようになります。これのおかげで、将来的には季節や時間によってイベントを変えたりすることが出来ます。まあ、本当にずっと将来の話ですが。


 そして、最近色々と気になる知識を学習していたら、今まで書いてきたコードのダサダサな部分が一杯見えてきて、書き直したくなります。でも、書き直しません。それやり出したらまたしても前に進めなくなってしまう泥沼だと理解しているからです。だって今だって将来だって完璧なコードなんて書けないんですから。

 あれですよ、「完璧なコードなど存在しない、完璧な絶望が存在しないように」ってやつです。村上春樹についてそんなに詳しくないから間違った使い方かもしれないけど。

2021年3月15日月曜日

Javascriptその12(プリミティブとオブジェクト)

  結局今日もイベントタイマーは納得のいくものはできませんでした。仕事中にNewインスタンスを使う発想を練っていて帰ってきてから早速書いてみたんですが、ダメでした。

 そして次はプリミティブ値をオブジェクト型にしてしまえば格納場所が変わるからうまくいくんじゃないかと思ってかなり調べたのですが、良い案には至らず。まあでも、このおかげでけっこういろんなことを学びました。かつてtoStringで呼び出した文字列から数字を切り取った際に、このままではプリミティブにならないから演算子で計算はできないんだろうなあと思ったら普通に動いてラッキーと思ったことがあったのですが、あれはいくつかあるJavaScriptが勝手にプリミティブ型に変換するパターンの一つだったのだと理解しました。

 そして、超絶今さらですがオブジェクトの勉強を始めました。恐ろしいでしょう?JavaScriptを学び始めて一ヵ月もの間、配列もオブジェクトもほとんど勉強してこなかったのですよ?配列は非常に便利と聞きながらも、私の頭の中では配列をうまく使った仕組みを考えられなかったためにこのような状況になっているのですがね。

 まあ、いつまでもここで足止めされているのもアレだから、もうそろそろクソダサコードでもいいから書き終えて次に進まないとかなあ。芸術的センスがないのに変に芸術肌みたいな拘り出てきたのは良くない傾向だ。

2021年3月14日日曜日

Javascriptその11(イベント進行用タイマーの作成)

  結局、便利なjQueryは見つからないから、setIntervalを使って自分で作ることにしました。あーもうきっと非同期じゃない言語だったらちょちょいのちょいなのになあ。多分。


 前回書いた通り複雑なシステムにすると後の運用が大変になるので、できるだけシンプルにしました。するとけっこう簡単に10行未満でシステムの幹ができました。

 ただ、思わぬところで躓きます。経過時間のカウントの途中でスプリットを保存して後の処理に活用したいのですがうまくいきません。具体的に言うと、目的地到達後に10秒が経過したらイベント発生という風にしたいのですが、それが難しいのです。

 なんだ、そんなの楽勝じゃんと思うかもしれませんが、将来的に搭載しようとしている様々なシステムとの組み合わせを考えると、こちらを立てるとこちらが立たず的な状況になってしまうのです。最初はカウントしている数値をconstを使って別の定数で宣言してやれば良いと思っていたのですが、constが再宣言や再代入を許さないと言えども代入する値を変数にしてしまうとその変数が変わるたびにconstで宣言した値も変わってしまうようです。


 うーん、これはなんとか良い解決策がほしい。それこそ前使ったPromiseを使うとか解決策は思いつくのだけれど、やっぱり今後のシステムの幹になる以上できるだけ簡素で運用しやすい形で書いておきたい。


 今週末はあんまり進まなかったなあ。反省しつつも、進行0の日を作らなかったことは良かったと締めくくりましょう。

2021年3月13日土曜日

JavaScriptその10 (イベント進行全体に関すること)

  以前JavaScriptが非同期であるということを書きましたので、この言語がpauseという動作に対して相性が悪いことは知っていましたが、想像以上に厄介だと感じています。Promiseを以前導入しましたが、どうもそれだけではイベント進行の一時停止は手強いと感じて前回別のjQueryを探したのですが、昨日良さそうだと思ったjQuery.pauseはアニメーションに対しての処理だということが分かり、これではイカンとなりました。


 そして今日粘り強くpauseボタンの仕組みを検索していたのですが、これは検索してもなかなか出てこない。setTimeoutあるいはsetIntervalが「停止」の機能は備えていても、「一時停止」の機能を備えていないのがそもそもの問題となっているのです。

 となると、現状考えられるのはイベントの自動進行にsetTimeoutやsetIntervalを使わずに実現させるという解決策が一つとして考えられます。具体例としては、Dateオブジェクトを使って秒単位で判定をさせ、基準の時間から指定の秒数が経過した時点で関数を読み込むように仕組めばと思います。

 しかし、この仕組み、言葉で書くと簡単ですが実際に書くとなると私の想像の段階でもそれなりに大掛かりになることが分かっています。プログラムを含めてシステムというものは大掛かりになるほど予期せぬことが起こるし運用も大変になるということは人生経験から知っているので、大掛かりな仕組みを作るというのは極力避けるべき選択なのです。


 以上pauseの困難さについて書きましたが、さすがにここは避けて通るわけにはいかない部分です。踏ん張りどころかなあ、という勘がはたらいております。

2021年3月12日金曜日

JavaScriptその9 (イベント進行時間の停止)

  今日からイベント進行の停止、つまりゲーム中におけるpauseボタンの作成に取り掛かりました。しかし、けっこう需要がありそうなのに検索するとしっくりくる機能が見つかりません。


 なんとなくjQuery.pauseというプラグインが良さそうだと思って使ってみたのですが、なんかエラーがでます。うーん、別の手段を探したほうが早そうかな?エラーとしてはどうやらpauseとresumeがプラグインの中で定義されていないようで、コードのダウンロードが間違えているのかと思われますが、コードを読んでも原因がよく分かりません。プラグインがもう10年以上前のだからそのへんも関係しているんですかね?


 まあ、でもこのへんはよっぽどいいんですよね。問題は第二段階の発表の構想が白紙に戻ったこと。というか、構想が大きくなりすぎて、これ実現したら割としっかりとしたノベルゲームになっちゃうんじゃないかという感じなので、第二段階ではそこまではいけないだろうという感覚を抱いているのであります。

 きちんとしたゲームの序盤だけを作成し、セーブデータを第三段階以降に持ち越せるようにするというのが理想なのですが、一本のゲームとして作り上げる以上はシステムやストーリー設計は最初からかなりの一貫性を持っていなければいけません。今の私の技量でそこまでいくのは絶対に無理です、ええ。


 さあ、どうしよっかなあ。とにかく、PCの前にいてアイディアが浮かんだことはほぼ皆無なので、明日明後日の休みでゆっくりPCもタブレットも使わない環境で考えてみたいと思います。

2021年3月11日木曜日

Electron その2 (アプリ化)

  いやー、二日がかりでようやくできました。記事に出てきた初心者でも30分でというのは完全に私には当てはまりませんでしたね。

 Electronのことは本当に初心者も初心者、「プロジェクトディレクトリって何?」という状態だったので、本当に色んなサイトにお世話になりました。本当はここにお世話になったサイトを並べたいくらいですが、多すぎるし忘れてしまったサイトもあるのでやめておきます。代わりに、ElectronおよびElectron Builderについて書いた全ての方に感謝させていただきます。


 というわけで、ロジマガHPからダウンロードできるようになっておりますのでよかったらぜひ試してみてください。本当のことを言うと、実はテストがそこまで念入りではないので不具合が起きてる可能性めちゃくちゃ高いです、すいません。明日以降テストを重ねていきます。


 というわけで、一区切りですね。次はプロジェクトの本筋に戻って、JavaScriptを使ってゲームのPauseシステムを作っていきたいと思います。あと、イベントタイマー機能もまだ改善したいんだよなあ…。

2021年3月10日水曜日

Electron その1 (Electronの導入)

  プロジェクトの本筋からは反れるかもしれませんが、今まではzipファイルをダウンロードしてそれでブラウザからhtmlファイルを開いてもらうことでプレイしてもらっていたのですが、世の中のゲームって確かexeファイルだったような、と思った調べたら、案の定でした。


 「別に今のままでもプレイはできるんだからいいじゃん無理にデスクトップアプリにしなくたって」という意見がもっともなようにも思えたのですが、プロジェクトの次の発表を明記していない今だからこそこういう本筋から反れた部分にも手を出せるかと思って始めました。「なんか検索したら『30分で.exeに変換』ってあるし難しくないだろ~」、と気軽に。

 しかし、案の定このポンコツは躓きます。マニュアル通りにやろうとしても全然できない!パスは通らないわ、「コマンドウインドウをここで開く」は出てこないわで、なんと今日はElectronをインストールしたところまでしか出来ておりません!

 しかも、インストールしてパスも通したはずなのにいまだにコマンドプロンプトでelectron ~.js と打っても実行してくれません。環境変数も設定したし、nodeは推奨されたバージョンを落としてjsonファイルもできてmainのファイル設定もしてるのになあ、なんでじゃろ。


 まあ、こういう時こそ久しぶりにプロジェクトの座右の銘を繰り返しておきますか。「いつかはできる」、「今が一番辛い」。

2021年3月9日火曜日

JavaScriptその8 (時間経過によるイベントの自動進行)

  あれ、前回とサブタイトルが同じじゃね?と思った方、鋭いです。

 どういうことかと申しますと、第一段階の製作の時点でシステム的にけっこう後になっていじる必要がある部分だという感覚を得ておりましたので、もっと良いコードの書き方はないものかと色々と調べておりました。

 当初はsetTimeoutを入れ子にして使っていたのですが、これには大きな弱点があって、「人間の直感的に理解しにくい作りになっている」というものです。まあ、プログラミング自体が人間が理解しやすいかどうかよりもコンピュータが理解しやすいかどうかを基準に書くべきだというのはごもっともなんですが、様々な言語はコンピュータが理解できるものでかつ人間にもできるだけ理解しやすいもの、という思考で数々の種類が生み出されてきたという歴史を考えると、やはり直感的に分かりやすいかどうかは重要でしょう。

 そこで、書き方を色々調べていたところ、Promiseというものを使えば非同期なJavaScriptもその処理順を非常にコントロールしやすくなるようです。JavaScriptでできるということは、jQueryでもその処理は可能なわけで、これによって相当直感的に分かりやすいコードになりそうです。まあ、私もまだまだ理解不足なところはあるのですが。

 とはいえ、Promiseの使い方を少し知っただけの現状では実際に自分のコードに落とし込むには少し時間がかかります。しかし、原理的にできるということは分かっているので、じっくりと取り組みたいと思います。


 また、今後のプロジェクトで使用するアイディアも少しずつ増えてきました。けっこうインパクトを狙ったものなので実現にはけっこう時間がかかりそうですが、遠くても目標が決まるとそこに至るための近い目標も逆算して見えてくるわけで、やっぱりモチベーションが上がります。

2021年3月8日月曜日

JavaScriptその7 (時間経過によるイベントの自動進行)

  なんだか最近23:30~24:00というブログを書く時間が守られていないと自分で気づく。イカンイカン。


 今日は専ら公式HPのデザインを整えていました。すごくオシャレなデザインにしてもいいんだけど、そっちはプロジェクトの本筋ではないし、あんまり機能増やすと重くなるというところもあるからしばらくは今回のデザインでいきます。

 やっぱり軽さは正義だと思うんですよね。某俳優さんのHPはそれでネットでも有名になりましたし。


 今日はjQueryを使った表題の操作を実装しました。これによって、会話が自動で進むためにプレイヤーは緊張感を持って登場人物の会話を聞くことになるし、C.B.S.システムも生きてくることになります。

 第一段階の時点でも実装しようかと思ってたんですが、当時の私には難しかったので断念したのです。


 まあ、今回簡単に実装できたのは、私の技術の向上というよりはjQueryという便利ツールによって非常に簡明なコードを書けるようになったからというのが要因として大きいのですが、そのことを知っただけでも私の技術は向上していると言えるでしょう。

 今後は、これに対応する形でC.B.S.を整えていく必要があります。以前にも書いた通り、「北へ。」のドリームキャスト版では賛否両論(というか否定的な意見の方が多かった)システムであるので、改良の余地は多いように思います。やっぱりPS2版のシステムをベースにしたほうがいいかな。


 あと、いつまでも違法に「北へ。」の画像と音声を拝借しているのも胸にチクリと棘が刺さり続けているので、まずは絵のほうからでもクラウドソーシングで誰かに書いてもらおうかしら。本当は誰かプロジェクト協力者で絵が描ける人が加わるといいんだけどなー、なんて。

2021年3月7日日曜日

StreetViewPanorama その5 (現在地をgooglemapに表示、など)

  とりあえずできるようになったことが3つ。

①StreetViewPanoramaでの現在地をgooglemapに表示させる

②StreetViewPanoramaとgooglemapの境目をドラッグで移動可能に

③StreetViewPanoramaの現在地に応じてイベントを発生させる

 なんのこっちゃと思う方はtwitterのほうにgifファイルを挙げてあるのでそちらを見ていただけると理解できるかと思います。


 長距離移動に備えて、googlemapの操作でStreetViewPanoramaの表示地点を変更するというのも出来たほうが良いのかもしれませんが、それをやると移動の途中でイベントをプレイヤーの予期せぬタイミングで発生させるという本企画の重要コンセプトが上手くいかなくなる未来が見えまくるので見送り。

 駅や空港に着いたらイベントが発生し、目的の駅や空港のStreetViewPanoramaに切り替わるというシステムで行く予定です。


 さて、そろそろHPの方も少しずつ充実させなくては…。ただ、HPって凝り出すと重くなるという弱点もあって、私は割と軽さ重視でいきたいこともあって難しいところです。

 まずはブログの内容を移設するところから始めるか。

2021年3月6日土曜日

Javascriptその6(div境界線の移動)

  とりあえず、昨日書いていたうちの、「現在地」ボタンでStreetViewPanoramaの現在地をgooglemap上で表示する、ということはクリアしました。

 実は、プログラミングの部分よりも、ボタンのデザインをCSSでどう表現するかのほうが時間がかかっていたりします。まあ、このへんは開発段階が進むにつれて少しずつ手を抜かないようにしていきたいところですね。


 今は、地図とストリートビューの境界線をドラッグすることで移動させられるようにしているところです。単純にドラッグで大きさを変えるだけならばCSSで簡単に実装できるのですが、一度の操作で二つの区域の大きさを両方同時に変更するにはCSSだけでは無理だと思われます。jQueryで似たようなものはあるのですが、なかなか私のイメージとピッタリとはこない。

 まあ、少し前にじっくり検索して探すことの重要性を痛感したところですし、もう少し良いjQueryでいいのを探してみようと思います。


 あと、第二段階の発表の形をどうするかも相変わらず課題です。面白そうなアイディアは出てきたのですが、さすがにそれを実現するとなると第二段階の発表がかなり遅くなってしまいそうだったので、もう少し熟慮が必要ですかね。

2021年3月5日金曜日

Maps JavaScript API その5(StreetVIewPanoramaとの連動)

  今日(昨日)も仕事が長引いたため、この時間になってもまだ前回宣言した基礎学習も同時並行で進めていくということが実現できていません。

 これ書き終わったら30分でいいからやるか…


 今日はStreetViewPanoramaの操作に合わせて隣に表示させたGoogleMapを動かすというのを実現しました。ただ、実際にやってみたらいちいち連動して動かすとGoogleMapの切り替えがなんかうざったらしかったので、「現在地」ボタンを設定し、StreetViewPanoramaの現在地を知りたい場合はそれを押したらGoogleMapでその地点を中心としてマーカーを表示する、という形にしようかなと思っています。

 あとは、第二段階で実装したいものに「会話の緊張感」というものを考えています。「北へ。」でC.B.S.ボタンがタイミングを逃していると押せなくて好感度が下がってしまうように、スキップボタンで会話を進めるのではなく時間の経過である程度会話を自動で進行させ、質問や声をかけるべきタイミングでC.B.S.ボタンを押さないといけないようにしてみたいですかねえ。ただ、これはWIの時に不評でDDで改変された部分だし、私は好きだけどユーザーからの評判はあまり良さそうにないのでちょっと実際に着手するにはもう少しシステム面をしっかりと親切なものになるような考慮してからじゃないといけなさそうですね。

 第一段階の発表後進行ペースは落ちていますが、ずっとあのテンションを維持しろというのは無理な話なので、毎日少しでも進んでいるということで自分を納得させてまた明日以降も進めていきたいと思います。

2021年3月4日木曜日

StreetViewPanorama その4 (移動に対応した位置座標の取得)

  ようやく成功しました。考えていたよりもずいぶんかかったなあ。


 労力のほとんどはこちらのサイトを見つけるまでにかかりました。やっぱり検索は根気強くやらないとダメだね。

 でもおかげで、addListenerメソッドの使い方を詳しく知ることが出来ました。でもやっぱアレですねー。第一段階の発表前に切羽詰まってからサボってましたけど、基本的な知識の学習をさぼっちゃダメですねー。学習を始めて3週間を過ぎたというのに、いまだに無名関数とアロー関数におけるthisの用法の違いすら知らなかったくらいですからね。

 最初に基礎と応用は両方同時にやるのが大事だから基礎に流されないって宣言したのに、気づいたら応用に流されていたというのですから不思議なもんです。

 まあとりあえず今回の内容が達成出来たら応用的な知識で必要なものはひと段落するので、とりあえず第二段階の発表物の形をイメージとして具体化しないといけませんよね。

 それをなんとか今週中に作り上げるのを目標にしつつ、それが出来上がるまでは基礎の学習+HPの充実を図っていくとしましょうかね。

2021年3月3日水曜日

StreetViewPanorama その3(回復)

  今日帰ってきてからダメもとでもう一度StreetViewPanoramaのコードを書いた.jsファイルを開いて見たら…表示されました。

 昨日表示されなかった原因は全くの不明。


 しかし、表示できた以上はこれを元に再びプロジェクトを進めます。とりあえず、次の目標は、スポットに到着することでイベントを発生させていくことですね。そのためには、第一段階の発表時にできなかった、StreetViewでの移動に合わせて位置座標を取得するようにしていく必要があります。

 最初はaddListnerを使って割とあっさり行くんじゃないかと思ったんですが、けっこう苦戦しております。'click'をイベントとして登録しても、普通に移動するとメソッドを実行してくれません。以前はこういう時にググれば色々とサイトが出てきて、書いてあることの意味が分からずに苦労することはあってもなんとかそれを読み解く努力をしていけばよかったのですが、この知識はけっこうマイナーなのか、英語のサイトでもなかなかしっくりくる情報が見つからず今に至ります。まあ、とにかく色々試していきましょう。

2021年3月2日火曜日

StreetViewPanorama その2(原因不明の不具合)

  …前回素晴らしいことを学んだと意気揚々としていた後ですが、事件が起こります。

 突然すべてのStreetViewPanoramaが表示されなくなりました。コンソールによると、InvalidAPIkeyとあるのでAPIキーの問題だと言うのですが、昨日まできちんと表示されていたコードをブラウザで開くとこれもエラーで表示されず…どうやら私のせいではないみたいです。


 これができないといろいろと進まないので今日一日かけて原因を探ったのですが結局分からなかったです。…ええ、一日無駄にしたに等しいです。


 というわけで、明日の仕事中にでもStreetViewPanoramaを使わなくてもいけそうなところから手をつけていこうかなと思います。

2021年3月1日月曜日

StreetViewPanorama その1(panoIDによる開始状態の取得)

  えー、昨日ついに第一段階の発表を終え、一息ついたところで今日は月曜日で仕事…。


 というわけで帰ってきてから21時すぎまで死んでいたので、正直今日はあまり新しいことを学んでいないし、大した進行を見せていません。

 というか、考えてみたら第二段階の発表の構想を全然練っていなかったので、やりたいことは大量にあるけど何から手をつけたらいいのか、どんなゴールを設定すればいいのか分からない状態。オープンワールドのRPGでチュートリアルを終えたという感じに近いでしょうか。私は本格的オープンワールドRPGやったことないから分からないけれど。


 しかし、そんな状態でも以前自分に約束した、「少しでもいいから毎日進む」という公約を果たすべく表題のStreetViewPanorama(google map street viewだと思ってもらってけっこう)の学習へ。実は、第一段階でも本当は取り入れたかった技術なんですよね。琴梨ちゃんの「じゃん!」の瞬間に自動で切り替えたかったのです。しかし、以前書いたとおり定義の関係かどうしてもエラーを吐くので断念。

 そして今日改めて学習を始めました。このへんまでくると多少ニッチなところも入ってきたのか、テックアカデミーみたいな有名どころの教材がなくなってきて、日本語のHPより英語のHPのほうが良い教材だったりします。幸いにして私は英語を読む能力は多少あるので(えっへん)、そこは大して問題ではなく普通に活用させてもらっています。

 そして、一つの超便利なものを見つけたました。それがpanoIDによるマップ指定です。今まで見てきたサイトでは、StreetVIewPanoramaの表示位置を「緯度」、「経度」、「方角う」、「見る角度」などで指定していたのですが、これがなかなか上手くいきませんでした。何度札幌駅前の交差点を指定して南口広場のビアフェスに連れていかれたことか…

 しかし、PanoIDはそんなことがない!希望していた通りのマップが一発で出せる!


 というわけで、テンションが上がっているのでまたプロジェクトの進行に戻ります。なんとか今週中には第二段階の発表の構想を描いておきたいですね。やっぱり目標に向かって製作しつつ必要な知識を学ぶのと、役に立つのか分からないけれど後々のためにと思って学習するのとではモチベーションが違いますね。

 モチベが上がっていれば、いつもの自分への励ましもいりません。では!