Web管理関連記事 - 連続表示

新規書き込み

※該当の記事タイトル一覧はリンク一覧から参照できます。

Googleマップの有料化(ディベロッパー向け) → Google Cloud Platform

名前: 小川 邦久 リンク: http://kunisan.jp/ 日付: 2018年7月17日

Googleマップの有料化(ディベロッパー向け) → Google Cloud Platformタイトルに「Googleマップの有料化」と書きましたが、Googleマップを使って検索する人が課金されるという話ではなく、Googleマップのサービスを使ってホームページやアプリを作っている人(ディベロッパー)に対する課金ということになります。今までは個人のディベロッパーであればGoogleマップのサービス利用は無料と考えて差し支えなかったのですが、これからは個人・企業を問わず、原則有料ということになります。

ただ、「原則有料」とは言うものの、毎月200ドル分まではクレジットが与えられるため、この金額までは実質無料で利用できるということになります。200ドル分で利用できるリクエスト回数はサービスによって異なり、例えばStatic Maps(静的な地図)であれば毎月10万回まで、Dynamic Maps(動的な地図)であれば毎月28,000回までとなります。

私のホームページ(KUNISAN.JP)では地図がリアルタイムに動くようなものは無いのですが、本ブログの飲食店紹介や一部の旅行系ホームページ(フィンランド&エストニア家族旅行日記)で、GoogleマップのJavaScript Maps APIを使用しています。これは上記の"Dynamic Maps"のカテゴリーに入ります。今回のルール変更に伴い、APIキーのプログラム記述が必須になったのですが、私の場合には2013年のプログラム修正(JavaScript Maps API v3に対応)で既にAPIキーを入れていたため、こちらの対応の必要はありませんでした。

KUNISAN.JP全体のGoogleマップAPIへのリクエスト数ですが、直近の1か月で1,000回にも達していませんでした。28,000回までは大分余裕があるので、当面は無料と考えても差し支えなさそうです。でも、将来的に少ないリクエスト回数でも有料に変更される可能性もありうるので、今後はJavaScriptのプログラムから、Googleマップのページからコードを取得する形の「埋め込み」に少しずつ変更していこうと思っています。

今回の「Googleマップの有料化」ですが、実は5月3日にGoogleから英文メールで通知があったものの、中身を読まずに既読フォルダーに移動してしまいました。今朝になってGoogleから再通知の英文メールが届き、統合された"Google Cloud Platform"上での支払い方法の登録など、先ほど慌てて所定の手続きを行いました。これを行わないと、地図が非表示になってしまうようです。Googleからのメールは、しっかりと読まないとだめですね。



Web管理関連記事(リンク一覧): Googleマップの有料化(ディベロッパー向け) → Google Cloud Platform / KUNISAN.JP全ウェブページのUTF-8化 (複数ファイルの文字コード変換) / アサヒカメラ2月号(2017) - 写真の無断使用への損害賠償&削除要請マニュアル / KUNISAN.JPトップページの統合 / JavaScriptパチスロ公開 / ...(記事連続表示)

ポケット百科 Googleサービス 知りたいことがズバッとわかる本
ポケット百科 Googleサービス 知りたいことがズバッとわかる本をAmazon.co.jpでチェック


KUNISAN.JP全ウェブページのUTF-8化 (複数ファイルの文字コード変換)

名前: 小川 邦久 リンク: http://kunisan.jp/ 日付: 2017年10月29日
KUNISAN.JP全ウェブページのUTF-8化 (複数ファイルの文字コード変換)昨日、今日と週末二日間で、KUNISAN.JPの全ウェブページの文字コードをUTF-8化しました。大小全部で約50個のサイトがあり、関連のテキストファイルはHTML、PHP、Perl、データファイルを合わせて2000個程度あるので、さすがに手作業での変更は無理です。以下の無料ソフトを使って作業を進めました。

Notepad++ - 基本はテキストエディターですが、複数ファイルのテキスト一括変換も対応しています。正規表現も使えます。
KanjiTranslatior - 複数ファイルの文字コード一括変換ができます。

作業はHTMLのmetaタグ中の文字コード宣言をShift_JIS(SJIS)からUTF-8に変更し、その後にファイルをUTF-8形式に変換するというのが中心になります(逆の順番で行うと、Notepad++が文字コードを誤認識する影響で、文字化けが発生してしまいます)。

作業はそれなりに順調に進みましたが、やはりPerlやPHPの文字列絡みのところで何度かひっかかりました。具体的には以下のような所でした。

・Perlでのメール送信。今まではjcode.plを使って日本語の処理をしていましたが、jcode.plはUTF-8に対応していません。ただ、Perl5.8からデフォルトで各種コードが扱えるようになっているので、"use utf8"の宣言をして、encode関数、decode関数を使ってメール作成、送信の処理をしています。
・PHPの文字列処理。今まではmb_internal_encoding、mb_regex_encodingがいずれもSJIS指定になっていましたが、これをUTF-8に変更しています。MySQLとのデータやり取り(UTF-8⇔SJIS)などで使用していたmb_convert_encodingも全て無効にしました。
・PHPでのメール送信。送信者名が日本語の場合、UTF-8のままメール送信処理を行うと、受信者側のメールクライアントによっては文字化けする不具合が発生しました。mb_encode_mimeheaderを使うことで回避しています。

対策に何時間もかかるような大きなトラブルは無かったものの、やはり一括変換だけでは処理しきれないファイルも多数あったことから、トータルで10時間ほどかかってしまいました。ただ、今週末は関東地方に台風が近づいていて雨が降り続いていたので、こういった作業を自宅で集中的にやるには最適のタイミングではありました。

KUNISAN.JPのウェブページは、1997年から作り始めたこともあって、ほぼ全ページ文字コードがSJISでした。しかし、データベース(MySQL)や外部APIとの絡みや、昨今のWeb関連の流れに沿う形で、今回のUTF-8化への決断となりました。表面的には何も変わっていないように見えますが、今後のメンテや新しい外部サービスとの接続などでは、より効率化が図れるようになったと思います。



Web管理関連記事(リンク一覧): Googleマップの有料化(ディベロッパー向け) → Google Cloud Platform / KUNISAN.JP全ウェブページのUTF-8化 (複数ファイルの文字コード変換) / アサヒカメラ2月号(2017) - 写真の無断使用への損害賠償&削除要請マニュアル / KUNISAN.JPトップページの統合 / JavaScriptパチスロ公開 / ...(記事連続表示)

プログラマのための文字コード技術入門 (WEB+DB PRESS plus) (WEB+DB PRESS plusシリーズ)
プログラマのための文字コード技術入門 (WEB+DB PRESS plus) (WEB+DB PRESS plusシリーズ)をAmazon.co.jpでチェック

アサヒカメラ2月号(2017) - 写真の無断使用への損害賠償&削除要請マニュアル

名前: 小川 邦久 リンク: http://kunisan.jp/ 日付: 2017年2月5日
アサヒカメラ2月号(2017) - 写真の無断使用への損害賠償&削除要請マニュアル生まれて初めて「アサヒカメラ」という雑誌を購入しました。私は写真は多く撮るものの、ホームページやブログやSNSにアップするのがメインで、もちろんその道のプロではありません。一部の写真についてPIXTAに投稿したりしますが、たまに売れたとしても1枚あたり数十円、最大でも数百円程度が入る位です。

アサヒカメラを購入した理由は、「写真を無断使用する泥棒を追い込むための損害賠償&削除要請マニュアル」という記事があったからです。もともとYahoo!ニュースで話題になっていて、それを見てアマゾンで購入しました。

私のホームページで使用している写真を本や雑誌に「掲載したい」という依頼が今までに何回かあって、特に断る理由も無いので「OK」を出しています。お金を取るようなこともないのですが、そういう場合には本や雑誌を無料で送ってくれたりして、その中にある自分の写真を見るだけでも嬉しい気分になります。

逆に、私の写真や文章が無断で掲載されているページも何度か発見しています。某健康食品の販売ページでペルーのリャマの写真が使われていたり(削除要請のメールを出しましたが無視されています)、個人のまとめサイトでブログの記事がまるごと転載されていることもありました(RSSから自動取得していたので、その後RSSはタイトルのみ配信するように変更しました)。

アサヒカメラの記事では「まとめサイト(キュレーションサイト)」に対して厳しい意見が書かれていました。まとめサイトの方がオリジナルのサイトよりも検索順位が上位に出てしまうなどの問題があり、自分のサイトで商売をしている人にとっては死活問題にもなります。私の写真も大手まとめサイトに無断で使用されているケースがありますが、いずれもオリジナルページへのリンクが貼ってあり、検索順位についても問題ないので、個人的には今まで問題にはしてきませんでした。

いずれにしても写真や文章の無断使用は気持ち悪いので、必要な場合に何らかの対策が取れると期待して、アサヒカメラの記事を読みました。無断使用者に対するメールやレターのサンプル文章があって、これは将来大きな問題があった時に参考になりそうです。ただ、損害賠償請求額は「使用料」に相当するようなので、私のようなプロではない人にとっては請求できるにしても少額で、それに対するコストや労力を考えると、本格的に行動に移すのは難しそうです。

一方、写真やブログなどで生計を立てているような人には、非常に参考になる記事だと思います。アサヒカメラの次号(3月号)でも同じ内容の記事を掲載するらしいです。

ところで、アサヒカメラの別の記事や写真も見ましたが、写真のクオリティーや芸術性の高さはさすがですね。私は入門用の一眼レフ(Canon EOS Kiss X7)のボケだけでも感動してしまいましたが、機能を使いこなせず撮影の失敗(ピンぼけや露出不良など)も多いので、結局今はコンデジをメインに使っています。



Web管理関連記事(リンク一覧): Googleマップの有料化(ディベロッパー向け) → Google Cloud Platform / KUNISAN.JP全ウェブページのUTF-8化 (複数ファイルの文字コード変換) / アサヒカメラ2月号(2017) - 写真の無断使用への損害賠償&削除要請マニュアル / KUNISAN.JPトップページの統合 / JavaScriptパチスロ公開 / ...(記事連続表示)

アサヒカメラ 2017年 02 月号 [雑誌]
アサヒカメラ 2017年 02 月号 [雑誌]をAmazon.co.jpでチェック

KUNISAN.JPトップページの統合

名前: 小川 邦久 リンク: http://kunisan.jp/ 日付: 2017年1月2日
KUNISAN.JPトップページの統合正月の時間を使って、KUNISAN.JPトップページの統合作業を行いました。

今まで、ドメイントップ"kunisan.jp/"は個人事業の事業内容紹介用としてのKUNISAN.JPページ、"kunisan.jp/kuni/"は個人ブログをメインコンテンツとして、自作サイトへのリンクと管理者プローフィールとリンク集を含めた「個人的な」内容のKUNISAN.JPページ、という風に分けられていました。個人事業の方のページは2009年の個人事業開業の時に制作したものですが、その後活動自体は休止状態だったものの、税法上のメリットもあり個人事業そのものは残していました。そういった事もあり、「まあ、ページの方も残しておいても問題ないだろう」ということで、そのままにしておきました。

ただ、内容的にダブってしまっているものも多く、何かある度に2つのページを更新しなければならないなど、管理が面倒になってきたのと、同じタイトルのページが2つに分かれている状態も普通にややこしいので、個人事業の方のページは完全に廃止し、前からあった方の個人的な内容の方のトップページのみ、ドメイントップに移行しました。今はアドレス"kunisan.jp"のみで本ブログのトップページに行けます。

KUNISAN.JPページですが、もともとBiglobeサーバーの時代に作成したKUNI'S PAGE(1999年作成)が起源になっています。当時は自作サイトへのリンクのみを掲載したページでしたが、その後2002年夏に掲示板(現在のブログ)を追加、同年秋にKUNISAN.JPドメインを取得してWebArenaのレンタルサーバーに移行、2005年に現在の"KUNISAN.JP"という名前のページになりました。

当時はSEO対策などという言葉も一般的ではなく、ドメイントップページの重要性などもよく知らなかったので、ドメイントップは「空」の状態がしばらく続いていました。2009年以降は個人事業ページがドメイントップに入っていましたが、これからはここに私の個人ページがトップに来ることになります。まあ、もともと個人の趣味で始めたホームページ作りなので、ようやく本来の姿になったのかな、という気がしています。



Web管理関連記事(リンク一覧): Googleマップの有料化(ディベロッパー向け) → Google Cloud Platform / KUNISAN.JP全ウェブページのUTF-8化 (複数ファイルの文字コード変換) / アサヒカメラ2月号(2017) - 写真の無断使用への損害賠償&削除要請マニュアル / KUNISAN.JPトップページの統合 / JavaScriptパチスロ公開 / ...(記事連続表示)

新人IT担当者のための Webサイト 構築&運営がわかる本
新人IT担当者のための Webサイト 構築&運営がわかる本をAmazon.co.jpでチェック

JavaScriptパチスロ公開

名前: 小川 邦久 リンク: http://kunisan.jp/ 日付: 2016年9月18日
JavaScriptパチスロ公開JavaScript自作ミニゲーム第3弾は「JavaScriptパチスロ」です。ゲームというよりは、シミュレーターと言うべきかもしれません。

JavaScriptパチスロ
http://kunisan.jp/slot/

私が初めてパチスロに触れたのは、大学1年生の時です。友人に連れられて、大学の近くにあったパチンコ店に行き、ワイルドキャッツという機種にお金をつぎ込みました。初のパチスロでは負けてしまいましたが、その後しばらくパチスロにハマってしまった時期があり、後日中古パチスロ店で、ワイルドキャッツの実機を買うということもあった位です(ワイルドキャッツのホームページはこちら)。

中学、高校とプログラミングをやっていたこともあって、「パチスロのプログラム位ならBASIC(言語)でも作れそう」と当時思ったものです。しかし、仮にパチスロプログラムを作った所で、当時はインターネットもなく、また売り出せる程の本格的なプログラムも作れないので、結局「公開する手段が無い」ということで作ることはありませんでした。

ここ最近、JavaScriptの学習を兼ねてアクションゲームを作ってきましたが、ちょっと前から「パチスロゲームを作ってみよう」と思うようになりました。「多分、作るのはそんなに難しくないだろう」と考えていたのですが、いざ作り始めると色々な所で壁に当たりました。

中でも面倒だったのがリールストップの制御です。単純に左→中→右とストップさせるだけなら、それ程難しくないのですが、左→右→中、中→右→左…、などストップの順番だけでも6通りになります。パチスロには「ボタンストップ後に必ず4コマ以内にストップさせる」という規制があり、これに「ストップボタンの押し順」と「役の当たりフラグ別の処理」を合わせると、かなり面倒な処理になってしまいます。

昔の知識で、パチスロのリール制御にはフラグに合わせて絵柄を引き込む「引き込み制御」と、フラグごとにリール上のストップする場所をマッピングする「テーブル制御」というものがある事は知っていました。テーブル制御の方が例外処理が少なく済みそうなものの、マッピングが面倒なこともあり、今回は「引き込み制御」で制作していくことにしました。しかし、「ボーナス」フラグのみが立っているのに不意に子役が揃ったり、「チェリー」フラグが立っていないのにストップボタンを不規則に押すとチェリーが揃ったリ、なかなか思った通りに動作してくれませんでした。

それでも試行錯誤を繰り返し、何とか完成までこぎつけることができました。リール制御については、最新の5号機の規制に100%沿った訳ではありませんが、とりあえず「それらしさ」は醸し出していると思います。知っている方には分かると思いますが、JavaScriptパチスロは、「ジャグラーシリーズ」を参考にしています。ただ、著作権の関係もあり、画像や音は別物、リール配列やリール制御も参考にはしていますが同じではありません。GoGoランプはありませんが、代わりにLet's Goランプがあります(挙動も若干異なります)。

本当はボーナスゲーム中の曲を自分で作曲してみようと思い、作曲ソフトを購入してみたのですが、結局これで作ったのは効果音とファンファーレのみ。ファンファーレもたった5秒で、コード進行もC→F→G7→Cという非常にシンプルなものですが、これだけでも30分以上の時間がかかってしまいました。そういう訳で、ボーナスゲーム中の曲は、BGM素材集のものを使用しています。作曲については別途学習を進めて、将来別のゲームのBGMか何かの形で公開したいと思っています。

JavaScriptのプログラミングについては、各リールオブジェクトでプロトタイプ(prototype)を使ったのと、キャンバス(canvas)のスクロール処理を行ったのが、今回初めてになります。特にプロトタイプについて、最初はよくわからずに試行錯誤的にプログラムを組んでは「全く動かない」というのを繰り返したものの、最終的に何とか動くようになりました。一度動いてしまうと、その後大きなトラブルはありせんでした。

JavaScriptミニゲームのアイデアは、もう1本頭にあるのですが、これをいつ作るかはまだ決めていません。作曲ソフトを買ったこともあって、とりあえずはこちらの方をある程度使いこなせるようになりたいと思っています。自分で作曲もできて、さらに絵が描ければ、ゲーム以外にも色々なことができると思うのですが、まあ全てをまんべんなくこなすのはさすがに難しいですね。



Web管理関連記事(リンク一覧): Googleマップの有料化(ディベロッパー向け) → Google Cloud Platform / KUNISAN.JP全ウェブページのUTF-8化 (複数ファイルの文字コード変換) / アサヒカメラ2月号(2017) - 写真の無断使用への損害賠償&削除要請マニュアル / KUNISAN.JPトップページの統合 / JavaScriptパチスロ公開 / ...(記事連続表示)

ゲームで学ぶJavaScript入門 HTML5&CSSも身につく!
ゲームで学ぶJavaScript入門 HTML5&CSSも身につく!をAmazon.co.jpでチェック

ミサイル防衛 - JavaScriptのシンプルシューティングゲーム

名前: 小川 邦久 リンク: http://kunisan.jp/ 日付: 2016年8月20日
ミサイル防衛 - JavaScriptのシンプルシューティングゲーム先月作成した「フルーツ王子」に続き、JavaScriptでシンプルなシューティングゲームを作ってみました。

ミサイル防衛:
http://kunisan.jp/missile/

爆風はミサイルコマンド風(1980年頃のゲーム)ですが、マウスクリックやタッチパネルのタッチで即爆風が発生します。連鎖爆発(誘爆)でミサイルを一気に破壊するのがポイントな所は変わりません。

前回の「フルーツ王子」はJavaScriptで作成した初のアクションゲームということで、「とにかく作ってみよう」とプログラミングを進めていきました。オブジェクトを積極的に使うことを意識したものの、今までPHPでやってきたようなパワープレイ的な進め方もあったりして、一部の箇所であまり統一感の無いプログラムになってしまっています。

今回の「ミサイル防衛」のプログラムでは、以下のものを新たに取り入れてます。

・Canvas - 爆風やレーザーの描画や、ミサイルと爆風の当たり判定などを行っています。
・setInterval - JavaScriptでアクションゲームを制作する場合には、通常はキャラクター毎にsetIntervalで関数を割り当てて、それぞれが自分で意思を持って動いているかのように作りこみます。しかし、前回の「フルーツ王子」では、1/10秒のタイミングで、全キャラクターを同時に処理するような、ある意味「昔風」な処理でした。今回の「ミサイル防衛」ではミサイルや爆風はもちろんのこと、色々なところでsetIntervalを使っています。
・オブジェクトと配列の複雑な組み合わせ - 敵の出現パターンデータは、「配列化したオブジェクトのプロパティを配列化」した形になっています。これにより効率的にデータ処理ができました。
・audioコントロールの微調整 - 昔と違い、JavaScriptの機種間、ブラウザー間の動作の違いは、あまり無くなってきましたが、オーティオ、ビデオ、タッチパネルなどの操作は、今でも機種間、ブラウザー間での動作に結構な違いが見られます。例えば、WindowsのEdgeやChromeやFirefoxでは普通にゲームの効果音が出せますが、iOSのSafariやAndroidのChromeではタッチ動作と直接紐付いた音しか出ない仕様になっています。iOSについては、さらにmutedメソッドが使えないため、ミュート機能はiOS用にpauseメソッドを併用しています(ちなみにiOSではvolumeメソッドでの音量調節もできません)。IEではcurrentTimeメソッドを使うとエラーで動作停止してしまう他、なぜか爆発音しか効果音が出ません。ミュート機能やIEの動作停止については対応するようにしましたが、他の部分については仕方なく放置しています。

JavaScriptの再学習開始時の1.5ヶ月前よりも、だいぶ感覚的に慣れてきた感じです。オブジェクトについては、まだプロトタイプが未経験ですが、これも近いうちにしっかりと使っていこうと思います。



Web管理関連記事(リンク一覧): Googleマップの有料化(ディベロッパー向け) → Google Cloud Platform / KUNISAN.JP全ウェブページのUTF-8化 (複数ファイルの文字コード変換) / アサヒカメラ2月号(2017) - 写真の無断使用への損害賠償&削除要請マニュアル / KUNISAN.JPトップページの統合 / JavaScriptパチスロ公開 / ...(記事連続表示)

ゲームで学ぶJavaScript入門 HTML5&CSSも身に付く! : 田中 賢一郎
ゲームで学ぶJavaScript入門 HTML5&CSSも身に付く! : 田中 賢一郎 をAmazon.co.jpでチェック
コメント:ミサイル防衛 - JavaScriptのシンプルシューティングゲーム
名前: 小川 邦久 リンク: http://kunisan.jp/ 日付: 2016年8月21日
動画も公開してみました。

フルーツ王子の改良

名前: 小川 邦久 リンク: http://kunisan.jp/ 日付: 2016年7月30日
フルーツ王子の改良2週間前に作成したJavaScriptのシンプルアクションゲーム「フルーツ王子」ですが、その後少しずつイベントの追加やゲームバランスの調整などの改良を行いました。

主な追加イベントは以下の通りです。
1. コンボ - フルーツを一定時間内に連続で3個以上取ると、x2、x3、x4...と得点が上がっていきます。スピードアップアイテムで王子のスピードを早くすることで、コンボが成立しやすくなります(その分操作が難しくなります)。コンボの効果音は昔の名作ゲーム「Mr.Do」をイメージして、楽譜作成ソフトで自作してみました(和音1音だけの簡単な効果音ですが)。
2. ハチ - 動く敵キャラで時折登場してきます。最初に出てくる時はスピードが遅いのですが、後から少しずつ早くなっていきます。このキャラを追加したことにより、「王子を一箇所に留めておくと全くミスしない」ということが無くなりました。
3. キング - ゲームがある程度進むと画面の隅にキングが登場、画面上にいるタコを一旦全て消滅させます。その後、タコの出現頻度が早くなり、短時間で画面がタコだらけになります。
4. ビッグフルーツ - フルーツが一通り出るようになるタイミング(メロンが出てくるあたり)以降で、同じ種類のフルーツを3連続で取ると、ビッグフルーツが出現します。ビッグフルーツは通常のフルーツの10倍の得点です。

当初と違って、スピードアップアイテムの重要度が増しました。コンボでの高得点を狙う上でも、ハチをうまく避けるためにも、2段階程度のスピードアップが必須になってきます。

その他、以下のような改良を行いました。

・オーディオのミュート機能(画面下のボタンで変更可能)
・効果音のボリューム調節(オリジナル音源の音量がそれぞれ異なるため)
・効果音の途切れの防止(フルーツやタコ退治連続でも音が切れないように)
・タコ最大20匹から最大30匹に増量(ゲームバランス調整。最大20匹では簡単すぎたので)
・タコやフルーツの出現を王子から2キャラ以内に出現しないようにしていたものを、1.5キャラ以内に変更(ゲームバランス調整)
・スピードアップアイテムを取っていない場合、3つめのアイテムはスピードアップアイテムで固定(ゲームバランス調整)
・画面下のボタンの位置を全体的に上に(スマホやタブレットでボタン全体が表示されるようにするもの)
・viewportでズームの禁止設定(スマホやタブレットでカーソルボタンを連続タップしても拡大しないようにするためのもの)
・王子&馬の前後揺れアニメーション補正(2コマの回転角度を大きくして前後に揺れているように見せる)
・左右のキーを押しっぱなしにしたり連打したりすると、王子のアニメーションがうまく表示されない不具合修正(進んでいる方向と同じ方向のカーソルキーを押しても、画像を再表示させないように修正)
・ゲームオーバー時に王子が左右反転しないように修正(自然に見せるため)
・フルーツ出現の「待ち」を最小化(Fruit Frenzyアイテムでフルーツがよどみなく出るように)
・日本語-英語対応(画面下のボタンで変更可能。URLに?LANG=enを加えることでデフォルトを英語にすることも可能)

個人的にはJavaScriptで第1弾のゲームではあるものの、面白いかどうかは別にして、「やりたい」と思うことは大体やりきることができました。次はCanvas機能とマウスを使ったゲームを作る予定でいますが、オブジェクトをもっと効率的に使った形でのプログラミングも意識するようにします。将来的にはタッチパネル操作やGPSと連動したものなど、色々と試してみたいと思っています。




Web管理関連記事(リンク一覧): Googleマップの有料化(ディベロッパー向け) → Google Cloud Platform / KUNISAN.JP全ウェブページのUTF-8化 (複数ファイルの文字コード変換) / アサヒカメラ2月号(2017) - 写真の無断使用への損害賠償&削除要請マニュアル / KUNISAN.JPトップページの統合 / JavaScriptパチスロ公開 / ...(記事連続表示)

確かな力が身につくJavaScript「超」入門 (確かな力が身につく「超」入門シリーズ) : 狩野 祐東
確かな力が身につくJavaScript「超」入門 (確かな力が身につく「超」入門シリーズ) : 狩野 祐東 をAmazon.co.jpでチェック
コメント:フルーツ王子の改良
名前: 小川 邦久 リンク: http://kunisan.jp/ 日付: 2016年7月30日
動画もアップしてみました。
コメント:フルーツ王子の改良
名前: 小川 邦久 リンク: http://kunisan.jp/ 日付: 2016年8月2日
その後、さらに以下の改良を行いました。

・2段階目のスピードアップ後のスピードをやや遅く調整(ゲームバランス調整。もともとの2段階目のスピードは、今は3段階目になっています)
・スピードアップなしでも3つ以上フルーツ連続取得でコンボ成立(ゲームバランス調整)
・1UPアイテムの出現確率を若干少なめに、他のアイテムの出現確率を若干多めに(ゲームバランス調整)
・アイテムが表示される際に、前回表示されたアイテムが一瞬表示されてしまう不具合を修正
・ビッグフルーツの得点表示の調整(普通のフルーツより大きく動く)
・タッチパネル操作の修正(JavaScriptのタッチイベントの使用)

フルーツ王子 - JavaScriptのミニアクションゲーム

名前: 小川 邦久 リンク: http://kunisan.jp/ 日付: 2016年7月18日
フルーツ王子 - JavaScriptのミニアクションゲーム数日前からJavaScriptの再学習を始めましたが、早速ミニアクションゲームを制作してみました。

フルーツ王子
http://kunisan.jp/fruits/

生まれて始めてオブジェクトを多用したプログラムでの制作になっています。プロパティやメソッドの設定など、最初は少し取っつきづらく感じたのですが、慣れてくると逆に便利に感じるようにもなりました。複数の処理が同時進行的に進むアクションゲームなどでは、必須の技術ではないかと思います。

こういったアクションゲームを最後に制作したのは、今から25年以上も前のことです。当時所有していたパソコン(X68000)は、本体+モニターで50万円程度と、当時のパソコンとしてもそれなりに高価なものでしたが、今のパソコンの処理速度と比べると数百分の1レベルです。スマートフォンよりも性能が大幅に劣る位です。

当時はBASIC(X-BASIC)でプログラムを書き、コンパイラーを使って機械語で動かすということをやっていました。大きなプログラムでは、コンパイルに毎回数十分かかったりしましたが、その時間はテレビを見たりファミコンでゲームをしたりして、のんびりとやっていたものです。その時に機械語で動いていたプログラムよりも、今のJavaScriptの方が断然処理が早く、「あの時できなかったような事も、今ならできるかも…」と少しワクワク感のようなものもあります。

JavaScriptの学習はこれからも進めていきますが、当面は今回のような規模が小さめのゲーム制作が中心になると思います。ゲーム制作自体は「自己満足」以外の何物でもありませんが、JavaScriptのプログラミング技術向上に直結するのは間違いなく、さらには将来的に「KUNISAN.JPサイトの大改装」へ向けての基礎となることも期待しています。

ちなみにフルーツ王子は、あと数点機能を追加する予定でいます。詳細については、また後日こちらのブログで…。




Web管理関連記事(リンク一覧): Googleマップの有料化(ディベロッパー向け) → Google Cloud Platform / KUNISAN.JP全ウェブページのUTF-8化 (複数ファイルの文字コード変換) / アサヒカメラ2月号(2017) - 写真の無断使用への損害賠償&削除要請マニュアル / KUNISAN.JPトップページの統合 / JavaScriptパチスロ公開 / ...(記事連続表示)

ゲームで学ぶJavaScript入門 HTML5&CSSも身に付く! : 田中 賢一郎
ゲームで学ぶJavaScript入門 HTML5&CSSも身に付く! : 田中 賢一郎 をAmazon.co.jpでチェック

電気代計算君のモバイルフレンドリー化(viewport設定)

名前: 小川 邦久 リンク: http://kunisan.jp/ 日付: 2016年7月9日
電気代計算君のモバイルフレンドリー化(viewport設定)電気代計算君」のページを改良して、モバイルフレンドリー化しました。スマートフォンやタブレットでの操作が今までよりもやりやすくなりました。

「電気代計算君」は2006年に公開したサイトで、電化製品の消費電力と使用時間を入力すると、大凡の電気代と(発電所の)二酸化炭素排出量を算出してくれます。当時、Yahoo!Japanのオススメサイトに選ばれて、2日間で5000件近くのアクセスがあったりした時期もありました。

その後しばらくは「電気代 計算」として検索すると、検索結果トップで表示されるなどして、安定して1日800件程度のアクセスがありました。特にエアコンが稼働する夏や冬の始まりは、普段より閲覧者が多く、1日1000件を超えることも珍しくありませんでした。

数年前から似たようなコンテンツのサイトが上位に行くようになり、昨年頭位から徐々に検索順位が下がるようになりました。最近は検索結果2ページ目まで落ちてしまったことから、1日100件程度のアクセスに留まっていました。

先日作成した「PHP Reversi」で、初めてviewport設定によるモバイルフレンドリー化をやって、「これはいいな」と思い、次にテコ入れしたのが「電気代計算君」という流れです。viewportの他にも、HTMLとCSSも全体的に見直して、テキストの行間、リンクの位置を変えるなど、画面の小さいスマートフォンでも使いやすいよう改良しました。

今のところ検索結果やアクセス数などに目立った効果は出ていませんが、モバイルフレンドリー化で検索結果が上がるということも聞いているので、少しでもいいので上に上がってくれると嬉しいです。

ちなみに、「ウクレレコード表」と本ブログページも、とりあえずviewport設定だけはやっておきました。スマートフォンやタブレットで閲覧した場合に、少しだけ見やすくなっています。



Web管理関連記事(リンク一覧): Googleマップの有料化(ディベロッパー向け) → Google Cloud Platform / KUNISAN.JP全ウェブページのUTF-8化 (複数ファイルの文字コード変換) / アサヒカメラ2月号(2017) - 写真の無断使用への損害賠償&削除要請マニュアル / KUNISAN.JPトップページの統合 / JavaScriptパチスロ公開 / ...(記事連続表示)

サンワサプライ ワットチェッカーplus 10種類測定可能 検電器 TAP-TST7
サンワサプライ ワットチェッカーplus 10種類測定可能 検電器 TAP-TST7をAmazon.co.jpでチェック

Webプログラミング用リファレンス本の買い直し

名前: 小川 邦久 リンク: http://kunisan.jp/ 日付: 2016年7月5日
Webプログラミング用リファレンス本の買い直し2011年の秋から冬にかけて、私のPC部屋にあった本200冊程度をほぼ全て、裁断+スキャンしてPDFファイルにしました。これで部屋のスペースを確保できたのと、タブレット端末でいつでも本を読むことができるようになったのは良かったのですが、Webプログラミングの上では少し不便に感じました。PHPのページを開きつつ、HTMLやCSSの項目を調べたりするのに、タブレットでは同時に2つのPDFを開けず、またPDFを開いたり閉じたりしている間にタイムラグが発生してしまいます。

それでも、しばらくはWebプログラミングと呼べる作業はしていなかったので、大きな問題ではありませんでした。昨年作ったサンフランシスコ旅行のホームページも、基本はHTML+CSSの組み合わせで、動的なコンテンツは一切無く、ほぼ滞りなく作業を進めることができました。

今年の3月~6月にかけてPCと周辺機器を一新しましたが、交換作業が一通り終わったところで「久しぶりにプログラミングをやってみよう」と思って作ったのが、先日の『PHP REVERSI(オセロもどきゲーム)』です。直前にPHPHTML5&CSS3JavaScriptのポケットリファレンスを購入して、特にPHPのものを参照しまくりました。PHPをまともにいじるのは約6年ぶりで、配列関係の処理など基本的な所も含めてすっかり頭から抜けてしまっていたので、随分と助けられました。

その後、PHP REVERSIの方は無事制作完了。JavaScriptは殆ど使うことは無かったのですが、5月に本ブログで書いた通り、これからはJavaScriptの中でも自分が使ってなかった機能を中心に、しっかりと学んでいくつもりでいます。ポケットリファレンスの他に、別のJavaScript解説書も購入しているので、そちらも参考にしながらプログラミングを進めていけたらと思っています。

ポケットリファレンスについては、追加で正規表現SQLExcel VBAのものも購入しました。正直な所、正規表現については「ネット情報だけでも十分だったかな」という内容でした。SQLについても6年ほどのブランクがあるので、また思い出すのに使っていこうと思います。Excel VBAはWebとは関係ありませんが、会社で使うこともあるのでおまけで購入したものです。

少し前まで自作PCを使っていたおかげで、ハードにもそれなりに詳しくなりましたが、私は元来ハードにはあまり興味なく、それをどう使うかに重点を置く方です。20年前に車を持っていた時にも、車種や「改造」には興味を持たず、色々な所を風景を楽しみながらドライブするのが好きでした。スキーについても板には大きなこだわりはなく、オールラウンドタイプのそれなりのものであれば、自分の方を装備に合わせるようにして滑るだけで、優先なのは風を切るような滑りの爽快感や山頂などからの雄大な景色を楽しむ事です。PCについても周辺機器を含めてハードウェアの入れ替えが一区切り付いたので、これからはプログラミングで色々な事を楽しみながら試してみようと思います。

また、ダラダラと自己紹介的な長い文章を書いてしまいましたが、まあせっかくなので、頭に浮かんだものはそのまま書き残しておきます。



Web管理関連記事(リンク一覧): Googleマップの有料化(ディベロッパー向け) → Google Cloud Platform / KUNISAN.JP全ウェブページのUTF-8化 (複数ファイルの文字コード変換) / アサヒカメラ2月号(2017) - 写真の無断使用への損害賠償&削除要請マニュアル / KUNISAN.JPトップページの統合 / JavaScriptパチスロ公開 / ...(記事連続表示)

[改訂第3版]PHPポケットリファレンス : 大垣 靖男 .co.jp
[改訂第3版]PHPポケットリファレンス : 大垣 靖男 .co.jpをAmazon.co.jpでチェック

| 前ページ(新しい記事) |     | 次ページ(過去の記事) |

※該当の記事タイトル一覧はリンク一覧から参照できます。