ブログ

新規にメールアドレスを作成したので、元のメールアドレスも削除した。サイトに設定しているメールアドレスも変更しなくてはいけない。(ソーシャルボタン上)

(追記)メニューの変更も完了。これで完全にドメインの移行は完了した。

無料で取得したドメインの期限が失効し、そのアドレスには繋がらなくなった。しかし、別途取得していたドメインを事前にメインドメインとして登録しておいた所、無事にそちらのドメインでのアクセスはできる事を確認できた。(こうやって、ブログに投稿できる時点で成功)

こちらはあくまでも、検証用のサイトなので新規に取得したドメインも別の無料ドメインではあるけれど、本番用のサイトも同じような手順を踏む事でドメイン移管が可能な事が検証できた。

ポイントは、旧コンパネからメインドメイン名を登録しなおすこと。新コンパネ上でメインドメインを変更する手段を見つけられていない。旧コンパネへは、XREAの管理サイトから移動する事ができるが、新コンパネからメニューで切り替えて使う事も可能。いつまで切り替え可能か不明なので、どちらでもできる事を備忘録としておく。

旧ドメイン名は削除しておく必要があるだろう。また、メールサーバーなどの設定は触っていないのだが、メールアドレスに関してどうなっているのかは、ちゃんと押えておく必要がありそう。(使ってはいないが)

色々サボっているが、少しずつ再開していきたい。

もたもたしていて、検証用サーバーのドメインの有効期限が迫ってしまった。そこで、新たに別のドメインを取得し、ドメインのみを変更してサーバーの中身などはそのまま移管できないかを試してみた。

本番用のサーバーも、実運用開始時にはちゃんとしたドメインを取得する予定だったし、その予行練習にもなる。

まず、お名前.comで取得したドメインを、XREAのサーバーIPと紐づけてDNS登録する。そして、そのドメイン名をXREA側に設定する…のだが、これがまた良くわからなかった。XREAのダッシュボード上でドメインやサイトの登録はできるが、Mainのドメインはいくらやっても変更できない。これだと、VALUE DOMAIN上のドメインが失効すると多分使えなくなるよな…。

という事でもう少し調べてみると、VALUE DOMAINのサーバー設定内の、XREAのウェブ設定(どうやら、旧コンパネらしい)で、MainやSubのドメイン(サイト)設定が可能なようだ。

Mainに新たに取得したドメインのサイト名を登録し、当面消えると何かあったら困るのでSubに従来のMainの設定を入れてみた。どうやらうまく行ったらしい。取りあえず、これで無料ドメインが失効しても、新たなドメイン名でのアクセスは可能になりそうだ。

でも、悠長なことはしていられないな。そろそろちゃんとやらないと。後、実際に失効した後の事もちゃんとケアしておかないといけない。今月が勝負…かな。

詳細画面と簡易画面の表示の調整も終わったので、公開サーバーへ変更を反映してきた。まぁURLはフォロワーさんにしか流していないので、見てくれる人は少ないので、感想を貰いたくとも集まらないのは判っているのだが…。

それはさておき、次のフェーズに移ろう。方針としては機能拡充かデータ入力の再開。現状でも機能的にはそこそこ使えるはずなので、データさえ入力完了してしまえば、その後の機能追加は色々要望などを聞きながらできるはず。

とは言え、中々データ入力も辛いので(笑)、プログラム的な部分を片付けたい気持ちはある。一番やろうかと思っているのは、簡易画面と詳細画面の相互遷移。別アビリティを見るのにいちいち検索画面に戻るのも面倒だし、遷移できるならそっちの方が便利ではないか…。簡易画面も別Lv時のデータはタブ遷移みたいな見え方の方がいいかもしれない…。などなど、色々とアイデアは浮かんでくる。

取りあえず、ここまでにしてデータ入力にしばらく注力しようか…な。

キャラクター名称の部分にあった、レアリティと属性表示をアイコン化した。これで当初考えていたアイコン化の作業は全て完了。一旦保留していた詳細画面のレイアウトについて、もう一度調整し始める事にする。

それ以外の調整をどうするかは今後の検討課題ではあるが、詳細画面の調整が終わったら本番サイトへ反映してみようかと思う。データが半分しかないというのは情けないが、まぁ仕方なし。

他に調整が必要な部分があるか、もう一度全体的に見直してみよう。

キャラクター詳細画面のレスポンシブ対応がひとまず完了。スマホの方でまだスタイルシートがうまく反映されていないのか、ちゃんと表示されていないのが気になるが、PC側は元々のテーブルとほぼ同じ画面まで持ってこれた。細かい調整はまだ必要だが、ひとまずはこれでいい。

CSSの反映ができていないのではなく、別問題の可能性もあるので、そのあたりはもう少しみないといけないかもしれない。@mediaがうまく働いていない可能性もある。

全体的なマージンや、ボーダーの色の設定、取得(更新)レベルの表示方法などは、レイアウトを含めて変更もしくは調整が必要と思われるが、ボーダーの色などはアビ簡易画面とも共通のCSSを使っているので、そちらの変更を終えてから対応しようと思う。

簡易画面は、キャラクター名などの所にアイコンを使うくらいしか、今の所変更箇所が見えていないので、他に手を入れるべきところの洗い出しからしないといけない。

いずれにせよ、画面の変更についてはほぼ収束してきた。プログラム側(PHP側)にもっと手を入れる必要もあるかと思ったが、最小限の変更だけで、残りはHTMLとCSSで完結したのが良かった。JavaScriptに至っては一切手を加えていない。完了した時点で不要なソース(コメントアウトしたHTMLなど)は綺麗にして、画面側も整理しておきたい。

キャラクター詳細画面のヘッダ部にもアイコンを使用して情報量はUPしつつもデザインを簡易化する事に成功。

当初、全てをgridで行う予定だったが、親のSPANをグリッドで定義し、その内部に配置するコンテナをflexにする事で、簡単にかつPC/スマホへの対応も柔軟にできた。細かい部分の調整はまだ必要だけど、大まかなレイアウトはこれでいいと思うのでひとまず終了。

ついで、奥義やアビ情報の詳細部に移る。ここは従来はテーブルタグで記載し、ヘッダ部(奥義名やアビ名)をPCとスマホで文字方向などを変えてレイアウトしていた。だけど、やっぱりスマホ画面だと縦長になりすぎて見づらいという意見もあって、ここをどうにかしたいと思っていたのが一番の課題だった。

今回、テーブルタグを取りやめて、セル状の部分を全てSPANで作り、CSSで位置を指定する方向で作り直している。gridを使うかどうか悩んでいたが、どうやらflexだけでできそうな気がする。@mediaをうまく使って、幅が狭い場合にはヘッダ部を横幅一杯に設定し、そうでなければ画面の15%程度とする。flex-wrapを設定し折り返し可にする事で、はみ出た部分がヘッダの下部に回りこむような動作を期待した。

結果として、想定通りのレイアウトにできたのでこれもOKだ。ただ現状はテーブルレイアウトを前提として枠線や色のつけ方をしているので、これらの調整は必要になりそうだ。特に枠線については考慮が必要だと思うが、うまくできればアビ簡易画面と共通にできそうなので頑張って調整したい。

現状、奥義部分しか手直しできていないので、これをアビ情報、サポートアビ情報にも適用して、全体の画面調整を実施する予定。全部できてみないと何とも言えないが、当初の画面に比べたら随分スッキリするのではないかという予感がある。引き続き調整していきたい。

検索条件画面は、従来テキストを選択するような形式だったが、画像の利用許可のメドが立ったので、アイコンにて条件を選択するようにしたかった。ＰＣ画面ではまだしも、スマホでは文字数の少ない項目の選択が不便だったから特にそうしたかった。

色々と紆余曲折あったけれど、基本的にはＣＳＳとＨＴＭＬのみで対応できた。

選択前を低輝度(透明度0.5)、選択後にフル輝度(透明度1)という形にしてみたが、思ったよりいい気がする。

今回はアイコン名を自動生成している事もあり、数多くのサイトでお勧めされていた「:after」での実装ではなく、「span」タグ内に直接スタイル句に「content:url(…)」という形でアイコンを表示させている。あまりスマートでは無いよなぁ…とは思うけれど、ひとまずこれで行く事にする。

チェックされたら「class名 input:checked + spanクラス名」という近接修飾子とかを使って透明度を１に変えている。

一切スクリプトなどを使っていないので、検索画面に対しては一切手を入れずに済んだのも嬉しい。一通りの動作も問題なくできたので、この件はこのあたりで収束させる予定。

従来文字だったのを画像に変えたので、マージンやラベル部分の調整も必要だと思うが、同様に画像にすべきかテキストのままで多少修飾をつける程度にしようか検討は必要。

次は、検索結果一覧の表示を更新しようと思う。現状属性やレア度などをテキストで記載しているが、それらをアイコン化しようと思う。これは多少ロジックが必要だと思うが、アイコンも用意する必要がありそうだ。コピーライトの表示方法について回答を貰ってから着手しよう。

とにかく、１日かかったが何とか形になって良かった。

取り合えず、アイコンを準備した。ただ、著作権表示方法について、再度確認をしている所なので正式にはそれを待たないといけない。ただ、ファイル名などはそのまま使えるので、この仮バージョンにて検索画面を作り変えてみようと思う。

まず着手するのは、検索条件画面。ついで検索結果(一覧)、そして検索結果(詳細)という感じだろう。現在のチェックボックスを画像に置き換える事になるので、「選択状態」をどう表現するのかなど、いくつか検討も必要になるだろう。ただ、まずはレイアウトがどう変わるかを試してみようと思う。

中断していた分を一気に取り戻す…というのは難しいが、それでも二段目のロケットに点火したような感覚ではあるので、うまく勢いをつけていきたい。

運営さんに、ゲーム内のアイコンや画像などの使用について確認をしてみたところ、著作権表記(コピーライト)を正しく表記しさえすれば、「引用の範囲内で使用OK」との回答を頂いた。勿論、状況を伝えた上で判断して頂いたので、他の方も確認を取る事をお勧めします。

引用については、以前ちょっと別件で調べた事もあるので大丈夫だと思う。

• 適切な量
• 出典を明確に
• 単なる転載であってはならない
• 改変してはいけない

単なる転載であってはいけないというのは、画像のみを転記してそのまま何も「主張」を加えずに掲載すること。それでは「引用」ではなく「転載」でしか無いという事。今回の検索システムにおいて、「主張」というのがどう判断されるのかは正直微妙だけれど、概ね問題無いだろうと思っている。

引用可能なのは、各種アイコンとキャラなどの画像、ゲーム内のフレーバーテキストなどと認識している。(その旨伝えた上で許可を頂いた)

まずは、アイコンなどを使って、検索画面をもう少し見栄えが良く、操作性が良いものに変更していきたい。まずは素材の準備から始めよう。