見出し画像

MoE スキン starseeker


概要

上記記事で作ったスキンを配布します。個人的な好みの煮こごりみたいになってるので、万人向けとは言い難いです。

note.com に貼った小さい画像は 全部 2pix 小さく表示されるので SS とかドット絵が全部微妙にボケてみえますが、note の仕様です。CSS で box-sizing かえるだけやろ!(超意訳) って要望出したんですが仕様だと言って直してくれませんでした。

吹き出し、各種 UI
zone info, スキル, 顔アイコン
生産ルーレット
デフォルト色では D 型色覚で HG との見分けがきわどい NG ゾーンの黄色をあかるめに。
各色覚で確実にわかるよう MG のみグラデをうすくかけてます。
装備アイコン

短く!

  1. starseeker って MoE のスキン作ったから配布するぞ。

  2. 戦闘ログの色分けとか独特なのでそのままだと人を選ぶかもな。

  3. ini ファイルが
    ベース ( starseeker.ini )
    色弱向け調整版 ( starseeker-midnight.ini )
    ログやビルボードが MoE のデフォルト ( starseeker-moedefault.ini )
    の 3 タイプある。

  4. 画像はどのタイプでも同じの使うから、bmp はコピペしてリネームして増殖させるか、シンボリックリンク貼るなり。

  5. enb convertor に付属している古いバージョンの d3d8to9 ( d3d8.dll ) を使ってる奴は注意だ。このスキンに限らずあちこちボケて汚くなるから開発者の公開している最新版に更新してくれ。enb convertor ってなんぞや? って人はこれは忘れていい。

特徴と注意事項

改造及び再配布自由

改造及び再配布自由です。ただし著作者人格権は放棄しません。作者詐称や自作発言はやめてね!ってこと。

ゆるふわアクセシビリティ配慮

各色覚で色の見分けに問題が起きないよう調整 + 専用設定を作成。あくまでシミュと理詰めでの調整であり、本当に見やすいかは保証しかねる。

色調整にはスキンの画像作成より時間かかってる

C 型・D 型・P 型はチェックしても T 型はあまりしてない。

コントラスト比の問題もある。でも、眩しすぎるのイヤとかごちゃごちゃしてるの読みにくいとか派手な色読みにくいって人に配慮するのもアクセシビリティの一種といえなくもないし、俺がスキン自作した動機がそもそもそこらだし、そういう人向けのスキンだと思えばアリかと。

あと Web デザインと違うのは情報の重要と重要じゃない (けど表示はしておきたい・精査のために一枚のログにまとめて残したい) のダイナミックレンジがクッソ広いこと。
なので、表示する情報自体がすでに取捨選択されており、わりと厳格にコントラスト比を満たしているか要求される Web とは異なり「俺がいらないと思う」情報は重要なものを見やすくするためにめっちゃ薄くしてる。
この「俺がいらないと思う」は人によって違うのが難点なんよな。戦闘ログとか顕著。

一応、あからさまに薄くしてるやつは透明度で薄くしてるので、RGB をいじらなくても戻せるようにしてある。

大体こういうのは、A (アルファ・透明度) で薄くしてるので、RGB は触らないで濃くできる。

3タイプのカラー設定

戦闘ログの色分けがアレな配色になってるので、3 タイプの設定を用意した。

starseeker.ini (ベース設定)

戦闘ログのダメージが赤じゃなかったり、俺なりの見やすさ優先と長年の慣れでビルボードの技名の色が自分と PC と Mob で全部同じだったり色々アレな設定。

この世界では紫は強いやつの色なのだ。

戦闘ログの色分けは、よく言えばアバンギャルド悪く言えば非常識。

starseeker-midnight.ini (色弱向け設定)

ベース設定のマイナーチェンジ版で、D 型色覚及び P 型色覚での見分けがより簡易になるよう調整したもの。"ビルボードのダメージは原色の赤" などベース設定でも大きくは崩していない MoE の強く伝統的と思われる箇所にも若干手を入れた。

多数派である C 型も含め色覚特性は同じタイプの中でも個人差があるので、まずそうな色は完全に置き換えてしまうのではなく、できるだけ元の色の雰囲気を保存した上で調整している。

各色の理由や方針はシートのメモ欄に書いてある。

starseeker-moedefault.ini (ビルボード等が MoE のデフォルト)

デフォルトが一番見やすいという人は少なくないと思う

スキンは好きなので使いたいけど、戦闘ログの色とかが無理!って人向け。ビルボード・戦闘ログの色を MoE のデフォルト 2 (2 はダークモード用) に入れ替えたもの。

透明系スキンに共通の注意点

透明系スキンではありがち。あるのはわかってるので操作できるものに関しては結構省略してる。

この 3 と 4 の間だよ。

例えば、ショトカの枠はないのでショトカの右クリメニューを出すには本来枠のある何もないところを右クリする必要がある。3 と 4 の間か 7 と 8 の間みたいな。
方位磁針を折りたたんだり出したりするボタンも方位磁針に重なって邪魔なので作ってない。表示がなくてもそこにはあるので、画面のすみっこを雑にクリックすると折りたたんだり出したりできる。
PT mem の HP バーも全く枠がないので、省スペースな置き方が可能だけど、調整の際にはクリック範囲をだいたい認識しておく必要がある。

ウィンドウのヘッダは目立たないので Map ウィンドウなどヘッダが閉じられない窓の省スペースな置き方が可能だし、Command や Technic ウィンドウを Fade モードにしなくても画面がスッキリする。反面、ウィンドウキャプションと閉じるボタンの視認性は低い。

慣れると全く問題ないし画面を広く使えるけど、MoE の初心者さんにはあまりおすすめできない。この辺は、このスキンに限ったことではなく透明系スキン全般にいえる。

視覚的にまぁまぁ正しい HP バーの目盛り

enb convertor ( DX8 to DX9 Converter ) に付属している古いバージョンの d3d8.dll を使うとうまく機能しません! 対処法は下にあります。

作者は現役時代は人間ばっかり殴ってたので「HP ? 殴れば死ぬか耐えるか、殴られれば死ぬか耐えるか、減ってるか満タンかくらいだろ」な感覚だった。HP バーの目盛りなんて当然必要に感じたことはなかった。
なんだけど、配布されてるスキンの多くには目盛りがついているので、Pre 詳しい人に聞いたらあるといいらしい。で、聞くところによると既存のスキンの目盛りは結構ずれてるとのこと。

検証してみると既存のスキンがそうなってる理由がわかった。HP バーのスキンは拡大表示されてるうえに、その補完は最近傍っぽい何かなので何個置きかにドットが横に 2 倍に引き伸ばされる。目盛りは 1ドットの線をひきたいのに、本来目盛りがあるべき位置のドットが引き伸ばしドットだと 2 ドット の線になっちゃう。それを避けるには右隣か左隣の引き伸ばさられないドットで線を引くしかないからずれる。

じゃあ線を全部 2 ドットにすればよくね?
とはならない。10% 刻みだと半数以上は引き伸ばしドットなのだがそうじゃない位置もあって、それを 2 ドットにしようとすると隣が引き伸ばしドットで 3 ドットになっちゃうとか、そもそも引き伸ばし 2 ドットのはじめが目盛り位置のと終わりが目盛り位置のやつがあって「ウキーー」ってなる。いやーこれ、既存のスキンもそういう考慮の末の葛藤と妥協の産物であって、何も雑にズレてるわけじゃないと思う。

この事情をわかってから各スキンをみると、引き伸ばしを計算にいれて 2 ドットと 1 ドットの線がまざってるものもあることに気づく。

うーん。なんとかできないか。

   ↓ このドットが目盛りを引きたい位置だとする
   +

スキン上でこの位置のドットが引き伸ばしドットだと

   +
   伸  伸

このように、どうやっても 2ドット幅の線になってしまう
1dot 幅の目盛りを引きたいなら、左隣にドットを打つことになる。

   +
点

引き伸ばしドットの終端が目盛りを引きたい位置のケースもあり

    +
伸  伸

この場合、左隣だと 2dot 離れてしまうので右隣を選択することになるだろう。

    +
      点

すべて 2dot 幅の目盛りに統一しようとすると
目盛りを引きたい位置は引き伸ばしドットではないが、その隣が引き伸ばしというケースがあり

  +
  点  伸  伸

こうなってしまうのを避けるには、やはり左右が限定される。
これでは位置によって、どちら側にずれるかが統一できず、見る人が困惑する理由になる。
ある程度の統一性を持たせるには表示幅で最大 4dot 使って

    +
.  .  .  .

その中心を目盛り位置とみなし
4dot のそれぞれの位置から引き伸ばしが始まるケースを考慮する
引き伸ばしがないなら 4dot 素直に使い

      +
弱  中  中  弱


1 番ドットが引き伸ばしの終端もしくは 4 番が引き伸ばしの始点なら
引き伸ばし側にはドットが打てないので 3dot 使う
明度や透明度のコントロールで中心部あたりに重心をかんじさせるようドット打ちで調整する

      +
    強  中  弱

      +
弱  中  強  

真ん中に引き伸ばしドットがあるときは

      +
弱  伸  伸  弱

      +
弱  強  伸  伸

      +
伸  伸  強  弱

とかやって、引き伸ばし以外のドットで重心位置を錯覚させる
実際には明暗による立体感も利用するので強弱は見ながら調整
HP 100 のキャラの 10% 毎のゲージ。
目盛り位置にまるぽっちがあるイメージ。
左上から光があたっていて、左上ハイライトと右側の境目、まるぽっちの中心に目盛りがあるように見せる。50% と 60% のみ、点 伸 伸 点 のパターンになるためハイライトの中心に目盛りがある。イレギュラーになるこのニ点は左上ではなく真上から光があたっているように描いてある。視覚的な補正で物体の中心に目盛り位置があるように感じられればいいはず。

目盛りを立体的にみせればなんとか……

あと思ったんだけど、目盛りって HP バーの外側にないとあんまいみなくね? 思ったので外側に付けた。

既知の問題

enb convertor に付属している古いバージョンの d3d8to9 ( d3d8.dll ) を使うとあちこちボケて汚くなる

ReShade を導入して MoE のレンダリングをきれいにしたり家落ち防止のために enb converter を使っている人もいると思う。

enb converter は DX8 の処理を DX9 に書き換える。env convertor に一緒に入っている古いバージョンの d3d8to9 ( d3d8.dll ) は元のアルゴリズムを考慮せずに一括でなめらか補完してしまうせいで、DX8 の悪く言えばガタガタ良く言えばピクセルを保存するシャープな拡大縮小を前提に調整されたスキンは表示結果が大きく異なってしまう。

DX8 ではこのようにシャープだったものが
古いバージョンの d3d8to9 ではぼやけてしまう。
補完されないことを逆手にとってドット打ちしたテクスチャ感ものっぺりしてしまってる。
前述の視覚的に大体正しく見える HP ゲージもこれだと機能しそうもない。

これはスキン画像をサイズ変換するときの問題ではなく、そのあとのパーツの拡大縮小の問題なので 4 倍作成法で作ったこのスキンに限った現象ではない。
古いバージョンを使うと公式スキンでもボケる。それこそ HP ゲージはいってるスキンの線とかぼけぼけなってるんじゃないだろうか。他にもスキンによってはタブに変な切れ目が入ったりなどしてしまう。とにかくドット絵と相性が悪い。

これを防ぐためには、enb converter に付属している古いバージョンの d3d8to9 ( d3d8.dll ) は使わず最新のものを使うこと。

開発者が公開している最新版をダウンロードして更新してください。ReShade は使ったことないけど、付属してる d3d8.dll のバージョンが古いなら同じ問題があるかも。

窓の色を変えるには一癖あり

前回のエントリで説明した通り、ウィンドウヘッダに 4 倍作成法での透明度持ち越しを使っているのでヘッダの色を変えるのが難しい。加えて白背景にしたときのパーツの馴染みは考慮していない。

画像は開発中のものなので、最終的には変更される可能性があります

どうしてもヘッダの色を変えたい場合、スキン bmp 側に手を入れて枠線を R0 B255 G0 で塗りつぶして一般的な透明系スキンのようにしてしまうのが手っ取り早い。

ここを塗りつぶせばウィンドウヘッダの枠線は消える。
こうなるので、枠線を気にせずヘッダの色を変えられる。
例えば、こういうふうに。
タブの色はカラー設定のウィンドウフレームで変えられるが、位置の都合ボタンではなくフレーム側に描いている閉じるボタンの色も変わってしまう。画像側をいじった方がいいかもしれない。
明るい背景色にするとパーツの馴染みがまずそう。

店で買うときのアイコン枠オーバーレイがわかりにくい

クリックした購入アイテムの枠が青緑になるやつ。アイコン枠がすげー控えめなので、あれが全然目立ちません。選んだやつは下に出るから慣れたら問題無いと思う (枠無しで長年やってたけど問題なかった) 

どうしてもむりーって人はアイコン枠だけ他からもってくるとかありかも。

編集用シート

Google スプレッドシート上で、MoE のカラー設定 ini を編集できるようにしたもの。説明はシートの方に書いてるのでここでは割愛。元々がこのスキンを作るための自分用なので色々と説明が足りないが。

色に関してのコメントやカラー設定の分かりにくい部位のメモなんかは参考になるかも?

更新履歴

なんかあったらかくかも。

配布ファイル

最後においてあるのはわざとです。

圧縮してません。
まとめて DL するにはフォルダを右クリから DL で。

画像はどの ini でも同じのを使うので、コピペしてリネームするなりしてください。starseeker-midnight.ini を有効にするには、starseeker.bmp をコピペして starseeker-midnight.bmp にリネームするってこと。

シンボリックリンクを使うと、一つ編集すれば MoE 側からみても他もかわるので画像を編集する人にはコピペ増殖よりおすすめです。複数のファイル名でアクセスしたいだけなのでハードリンクの方が良さそうなんだけど、SAI2 でハードリンクに上書きするとリンク切れて別ファイルになるんだよな。

一度 ini と bmp のペアを skin フォルダに入れてしまえば、MoE 起動してから何度でも読み直して更新できるけど、最初に増やす時はクライアント再起動しないと増えたのを感知しないようです。

えさをあげる

ここから作者に餌を与えることができます。


この記事が気に入ったらサポートをしてみませんか?