提案:白手袋アイコンのデザインの見直し

Issue #649 resolved
ルンバ created an issue

先日クラシックスキンの手袋アイコンを視認性向上のために黄から白にし、手の位置も枠外にはみ出す位置に改変された版を作っていただけました。ありがとうございます。

TARGET.png ただダウンロードしたスキンのアイコンを確認してみたのですが、旧来の黄色アイコンを元に白色に調整されたやり方に無理があって、アイコンのグラデーションが不自然に見えてしまっています。この等倍ならさほどでもないのかもしれませんが2倍表示でプレイする際は正直かなり気になりました。実際には3階調のグラデーションなのですが、視覚的にはパリッとした硬質な2階調に見え、かつ立体に沿わない稜線となっている印象です。少ない階調での陰影表現は階調の変わり目となる稜線のライン取りが重要です。

一方、私が自作したアイコンはTARGET多階調.png その面倒を回避するため旧来の黄色アイコンのアウトラインのみを利用しグラデーションは単に画像処理ソフトのベベルとエンボス機能で影付けしたもので私個人の個性はほとんど伴なわない無難な多階調ではあります(背景白ですが透過PNGです)。個人的にはこれで特に支障無いかと思っていますし全く多階調問題無しなのですが、色数少ない旧来とギャップがあるので違和感を受ける方も想定されます。

そこを懸念されるのであれば、もし、Iraka.T様が、問題がなければなのですが、BloodWirthの白手アイコンデザインでの解決を提案させていただきます。またその際、お手数なのですが、もし可能であればIraka.T様が枠外へ、はみ出すピクセル数も判断して調整していただけると、確実であり間違いないと思います。(手自体の24×22サイズは現状のまま空白部ピクセル数の調整という意味です)ご自身のデザインを位置を移動し使用されるという事であれば、レイアウトも含め本人様の判断が最も不満も無く確かな決定かと思いますので。

Comments (8)

  1. k4nagatsuki repo owner

    人差し指と親指を立てて、小指側から光を当ててみてください。だいたいこんな感じの影がつきます。

    Classicスキンのイメージは非常に少ない色数で作られており、アンチエイリアスも最小限です。アンチエイリアスに2色使っている部分もほとんどありませんので、BloodWirthの手袋でも合わないかもしれません。

    違和感があるとしたら影の部分が存在する事そのものかもしれません。

  2. ルンバ reporter

    長くなってしまいましたが、問題点、疑問点ごとに分けて書きますのでご容赦ください。

    • 手でなく手袋である
      >人差し指と親指を立てて、小指側から光を当ててみてください。
      これは「手」でなく「手袋」で、丸みを帯びたアウトラインからして肌に密着した素材は考えづらいですから、あまり人体解剖的的な凹凸よりも手袋に沿った明暗の形である必要があります。

    • ライティングの問題
      ライティングが日陰:日向の面積比が6:4か3か、7:3になっております。その事自体は良いとも悪いとも言えないですが、元々の黄色アイコンは全光に近く、輪郭の際に僅かに日陰があるのみだったので大きく印象に変化がありますので単純に違和感の元にはなります。デッサン的自然描写には日向の面積比が6:4か3か、7:3ぐらいが無難かと言われますが、ピクセルサイズ的にFCのドット絵に近い作業でもあり、また元々のアイコンのアウトラインのデザインからして戯画的なディフォルメをされておりますのでデッサン的ないしは写真的なリアリティは必要は無く、このライティングの変更は違和感のマイナス以上にプラスになる要素はなさそうです。

    • デザインとしての問題
      現状の白アイコンは先にも指摘させていただきましたようにアウトラインの黒を除くと3階調となっておりますが、元々の黄色アイコンの陰部の位置に痕跡的に残っている中間グレー部はライティングも変わっている中、作業的にたまたま残ってしまった状態に見受けられます。したがって実質的には白、グレーの2階調となっており無駄要素になっております。デザインの勉強においては色面構成等で絞った形態に絞った色数を無駄なく配色する事から学習し、世の中のデザインはシンプルなアイコンでも、そのような配慮がされております。先の「手」か「手袋」かという問題が仮に「手」であったとしても現行アイコンはアイコンの主張が強すぎに見えます。

    • 16色時代の小階調へ拘る必要があるのかの疑問
      前項での話のとおり少ない階調でデザインする方がむしろ困難というか、アラがハッキリ出やすいという事がまずあります。そして今後大きな問題になると思う点は作業の困難さです。私も先の自作の多階調版を画像編集ソフトのポスタリゼーションで2階調、3階調(黒除く)にしてみましたが、全く機械的で使用に耐えるものにはなりませんでした。仕方なくドット手打ちでも作ってみましたが、想像していたとおり、この作業は面倒でした。仮に宿の親父札絵のようにベタ塗りで陰を表現するならまだしも、ASK標準プレイヤー顔グラのように点描によりグラデーションを作ろうとすると非常な手間がかかりクオリティ的にも満足のいくものは容易に作れません。FC、SFCやCWの16色時代のASK札絵の多くでは、少ない階調とドット数の中、擬似的に多階調に見せるため、点描のように異なる色のドットを織り交ぜた職人芸が用いられてきましたが、これは専業のドッターのような人間以外には作業的に困難きわまりないです。単に絵が描ける能力にプラスして、その方面の経験ないし技術が要求されます。 CW界隈の現在の札絵描きの方たちでもドッターのような作業や16色を好む人間は少なめで、多階調で大きめのサイズで描いてから札絵規格に縮小する方の方が多いかと思われますし、階調制限が無い方が協力者を求め易いのは確実です。 またPyにおいてはアイコンでも×2表示が可能でありますが(クラシック以外のスキンでは実際に×2版も用意されていますし)、点描表現だと解像度を上げたあとの追加作業が大幅に増えます。 さらにFC世代である私達には懐かしく、親しみある少ない色数や点描ドット表現は、若者にとっては必ずしもそうではなく、古臭く忌避される危険性もありえますし、そうでなくとも、押し付ける必要がある事ではないと思います。CWで今後進化継承が期待されるのがこのPyである以上、仮に多年にわたってこれが継承されたとしたら我々の存命中はまだしも、いつかは、旧来仕様の尊重による色数制限はなくなるかと思います。

    あるいはこれが「クラシック」スキンである以上アーカイブ的な意味で旧仕様制限を残すという考え方もございますが、旧エンジン自体がダウンロード可能である以上はそこからのスキンの作成も可能なのでしょうから、py公式げなスキンにその制限を課す必要は無いかと思います。既にアイコンの白色化は決断いただいておりますので、ぜひ階調制限も再考いただければ幸いです。

    私的にはベベルとエンボスで無個性に無難に仕上げた先に添付したモノでいいかと思いますが、いかにも『画像編集ソフトのツールで作ったな』感に溢れていて、そこを気にされる層もあるかとは思いますし、一応色数制限を遵守する場合も考慮し、私が手打ちした3階調の手袋アイコンも添付しますが、TARGET2.png 正直これならむしろシンプルイズベストで真っ白でもいいかもしれません。TARGET.png 上からゲーム画面上の現行、白黒グレー版、真っ白版です。   

    アイコン比較.png

    なおアイコン余白部のピクセル数は、カードの線や角等の諸々のデザインとの重なりを考慮し、このピクセル数がいいのではないかと判断しております。 いずれにしろ、旧アイコンとの違和感の少なさを考慮したり、先の作業上の困難さによって日陰面積の少ない仕上げとなっております。しかしFC、SFCのドット絵時代のFFの手袋アイコンも、BloodWirthの手袋も、そのようなライティングになっておりますので、こうしたライティングで良いのではないかと思います。BloodWirthの手袋の並用に関してはデザイン的に上記の問題もなく素晴らしいものでしたので提言させていただきましたが、個人のスキンの独自性を損ねる事を要求しているので、他の解決方法があるならその方がもちろんいいですし、他にも良いアイコンを自作提示していただける方が現われれば歓迎なのですが。

    スキンは個人単位で変更可能な事でもあるし、pyを私家版として考えてみると、k4nagatsuki様のアイコンデザインに対して、異議を出すのは普通は中々しずらい事かと思いますので、あえて重ねて書かせていただきました。

  3. k4nagatsuki repo owner

    ライティングについては仰る通りだと思うので、あとで変更しておきます。

    16色時代の小階調へ拘る必要があるのかの疑問

    この節の内容には、私は全面的に反対です。「Classic」スキンである以上、将来も絵柄が変更される事はありません。今回は使い勝手を優先するという事で実施しましたが、本来は手袋の色や配置を変える事すら躊躇しなくてはなりません。新しいイメージが必要になったとしても、絵柄は描く側が合わせなくてはなりません。全面的に絵柄が刷新されるなら、新規スキンにならなくてはなりません。

    ついでに言えばドット絵のいわゆる網掛けはそんなに難しくありません。人にもよりますが、真面目に絵の勉強をした事がなくても数日で習得できます。アンチエイリアスの方が難しいです。

    CW側が変更された場合や、高解像度の話が絡んでくるとややこしくなりますが、それはまた別の話です。

  4. k4nagatsuki repo owner

    それといわゆる手袋アイコンは、宿帳や宿の選択で一覧表示した時にも使用されるのですが、その点は考慮されていますか?

  5. ルンバ reporter

    >「Classic」スキンである以上、将来も絵柄が変更される事はありません。

    やはり「クラシック」スキンである以上、それも一つの指針として納得は行きますし、その方針が確認できましたので多階調に関しては、無しという事で了解いたしました。

    >それといわゆる手袋アイコンは、宿帳や宿の選択で一覧表示した時にも使用されるのですが、その点は考慮されていますか?

    宿帳一覧画面では特に問題は感じませんが、宿の選択画面一覧右列においては、手袋アイコンが台紙からハミ出した位置にあるのが気にならなくも無いですね(上段)。

    宿選択画面.png

    しかしそもそもPCの名前が6文字以上になると台紙からはみ出し、とても読みづらいのでこれは台紙の方の横幅を広げる方が 両方解決できて良いと思いましたのでやってみました。下段が改良版です。もう少し広げたほうが、7文字目が読みやすいのですが、これ以上広げると台紙の後ろの壁がなんだけわからなくなるので、ここまでにしました。左列のスキンごとのアイコンもこの方が見やすく良好かと思います。単なる横幅拡張なので私の個性は介入しておりませんしクラシックの雰囲気は保たれるのでないかと思いますので、一応そのようにしてみたものを添付しますのでご利用いただければ幸いです。(別課題かなあとも思いましたが、両方の問題解決なのでこの場にしました)

    Bill.png

    なお上段画面時におけるマウスカーソルの赤い手首の小さい手袋は親指の付け根あたりに微妙に陰が数ピクセル入っている程度で、ほとんど全光で、真っ白なので、これとの統一感から考えると白手袋アイコンは真っ白ないしはそれに近い全光がやはりクラシックの雰囲気に良いと思います。参考にしていただければ幸いです。

  6. ルンバ reporter

    昨日スキンが更新されていたのですね…orz。変更された手袋アイコン確認いたしました。ほぼ全光アイコンで何の問題もありません、ありがとうございました。一応、上のテーブル画像の方も検討いただければと思います。

  7. k4nagatsuki repo owner

    pull request #2181

    手袋の位置調節を画像自体の編集によって行うのは筋が悪いです。右下の位置を基準に配置されるように変更しました。既存のスキンで問題は出ないと思います。

    これ以上Classicスキンのイメージを編集するのは、よほどの理由が無ければ私は賛成できません。

  8. ルンバ reporter

    修正ありがとうございました。見比べてみると修正前だと宿帳一覧でキャラ名の6文字目にかぶっていた手袋が文字の上に戻ったので、この方が見やすかったですね。あとのBill張り紙画像のデザインに関してはスキン各々のデザインの領分という事で、先の改良案は無しでけっこうです。以後クラシックスキンのデザインに関して提案を出す事はいたしません。全て解決いたしましたので課題は終了します。

  9. Log in to comment