みつまめ杏仁

アンリアルエンジンでGUIを作るためにゴニョゴニョしてます。UIデザイナーの皆様の助けになれば幸いです。

2025-01-01から1年間の記事一覧

ゲージ100本ノック 99

いつの間にか夕暮れも早まり、ようやく夏の勢いも少し弱まってきたように感じていますが、ここしばらく夏バテか何かわからない不調を引きずりつつ過ごしています。 この企画も残すところ2本ということで、実装を意識した構成にしてみようと思います。 プロ…

ゲージ100本ノック 98

ぷちコンの制作に集中してたので前回の記事から一か月も更新が止まってました。 今回もマテリアルインスタンスを使ったケースです。ゲージ自体はシンプルにバータイプで増減するだけ。このゲージの増減に連動するようにエフェクトを纏わせます。 ゲージをじ…

第24回 ぷちコン 振り返り

いつもの100本ノックの前に軽く、先日のぷちコンに応募した作品について振り返ってみようかと思います。 youtu.be 期限いっぱいまで奮闘してたので提出してからしばらく燃え尽きてました。 第24回目のお題は「スピード」 珍しく具体的なワードだなという印象…

ゲージ100本ノック 97

ほんと暑いですね。アイスコーヒーがおいしい。希釈用のリキッドは濃さを調節できるので、氷をたっぷり入れて水は少なめ。ゆっくり溶けていくのをちびちび飲んでます。 さてさて UEでは マテリアルインスタンス というアセットがあります。 マテリアルを継承…

ゲージ100本ノック 96

長さや目方を測るために等間隔に刻まれたしるしを「目盛り」というのですが、「目盛る」という動詞があるそうです。辞書を引いて知りました。 たまにゲージに乗っているのを見かけることもあります。シリンジ(注射器)やアルコール温度計、メスシリンダーあ…

ゲージ100本ノック 95

UIで扱うシェーダーは、PBR(物理ベースレンダリング)や VFX、ポストエフェクトに比べると、地味でささやかなものが多くなりがちです。ゲームのUI表示は半透明が基本なのと描画順によるところがその主な理由です。 シェーダーを使う=なんかスゴイイイカン…

ゲージ100本ノック 92-94

一年近くかかってゲージ100本ノックもいよいよ残りわずかになりました。 今回は点滅の方法について3種をピックアップします。 補間なしで切り替わるタイプ、滑らかに切り替わるするタイプ、テクスチャを使ってタイミングをコントロールするタイプの3つ。 …

ゲージ100本ノック 88-91

いよいよ90の大台に到達。前回は燃やしてしまったので今回はキラリとハイライトを走らせようと思って4つのタイプを用意しました。 ゲームのUI表示って普通の3Dのようにライティング&シェーディングすることは稀です。 主に視認性の確保(エッジをくっきりと…

ゲージ100本ノック 86-87

ついに燃やすときがきました。 グリッチやディゾルブと並んでテクスチャに対する依存度と演出目的の度合が高いので優先を下げていました。 2Dの絵素材が燃えるという表現はそれなりに目を引くものの、ゲームの世界観やシチュエーションが合わないと不自然に…

ゲージ100本ノック 83-85

テクスチャをリソースとしてパッケージに組み込む際、特別な用途を除いて圧縮されるのが普通です。圧縮でのピクセルの荒れを少しでも抑えるためにテクスチャの色数と複雑さが少なくなるように工夫します。今回はシェーダーでドロップシャドウを作り出します…

ゲージ100本ノック 80-82

去年の6月から書き始めてもうすぐ一年。のんびりな更新でようやく80本の大台に乗りました。この企画が世の悩める UI開発者様へ少しでも助けになれば幸いです。 今回は、見た目9スケールのようですが、テクスチャを使わないでフチドリを作ります。最近見たゲ…

ゲージ100本ノック 77-79

今回は複数のゲージが重なったような見た目を作ります。 77. はよく見かけるやつなので、ゲージの仕様については特に書かなくても大丈夫でしょう。アクションゲームとかでダメージ量がわかりやすいので採用率高いですね。 78. は 77. の応用として色数を増や…

ゲージ100本ノック 74-76

引き続き、シェーダーに慣れるためのチュートリアル的なゲージを100本作ろうぜという企画です。UI用途を想定していて、扱うのは2Dを基本としています。UVの加工やピクセルの表現バリエーションを増やすのが主な方針です。 年度末やらでいろいろと気ぜわしく…

ゲージ100本ノック 71-73

まだまだゲージ作っていきますよー なんとかネタが続いててハラハラしてます。 さて今回もUV空間をいじっていきます。UIならではの表現になると思うので、しっかりマスターしてドヤ顔してやりましょう。 UV空間とは、とあるポリゴン面にテクスチャを貼り付け…

ゲージ100本ノック 69-70

前回に続いて、UVの反転を使ったテクスチャの節約術を紹介。 あくまでもゲージを100本作ったらシェーダーへの理解が深まるんじゃないか企画です。 ゲージとして TexCoordノードを利用しましたがテクスチャに利用すると線対称な表示が可能なので、実質半分の…

ゲージ100本ノック 66-68

去年から慌ただしかった仕事は 完全に終わったわけではないけど、急にやることがなくなってしまった。プレッシャーからは解放されたのに まだ慣性が残っている感じで、すぐには止まれないという焦りとか罪悪感とか、承認されるまでは気が抜けない不安なんか…