はじめに

東京科学大学デジタル創作同好会は, 10/25(日) 開催の秋M3 に参加します！
当日スペースは、 第一展示場 I-06a です。 ぜひお越しください！

おしながき

新譜: traP Original Sounds Vol.14

About

「星空」をテーマとした全6曲を収録。部員それぞれの解釈が現れた多彩なアルバムになっています！

Price

500円

Songs

01 ryokusho - 四千三百の光と渡り鳥
02 Ida-ji - 夜空の星は反時計回り
03 きゃぴたる - Beyond the Stars
04 Ida-ji - 世界がもっと青ければ
05 vPhos - Lyra
06 mirin - ロケット～星は流れて～

Credit

Mastering : Ida-ji
Jacket : ryuryu
Design : ryuryu
Movie : てぃばーしろ

旧譜

• traP Original Sounds Vol.13 (500 円)
  「異世界」をテーマにした全 10 曲を収録。

• traP Original Sounds Vol.11 (500円)
  「カラフル」をテーマにした全 7 曲を収録。

• traP Original Sounds Vol.10 (無償配布)
  「月」をテーマにした全 11 曲を収録。

場所 : 5号館2階　リラクゼーションルーム
JRの駅と反対側の入り口から入って右側にあります。入口が2階なので、1階上がってください。階段で上ってまっすぐ進んで左手にあります。
日時 : 10/17(土) 9:00 ~ 17:00，10/18（日）9:00 ~17:00

主な内容

ゲーム展示・試遊
映像展示
3DCGの体験ワークショップ

ゲーム展示・試遊

部員の制作したゲームの展示を行います。子供も遊べるアクションゲームから、難しいパズルゲームまで、計20作品の様々なゲームを展示しています！ぜひ遊びに来てください！！

展示するゲーム一覧は以下のブログをご参照ください

【工大祭】traPrism 開催します！

概要 場所 : 西9号館 3階 W9-324野外ステージの裏に入口があります。入口が2階なので、1階上がってください。階段で上った右手にあります。日時 : 10/10(土) 9:30 ~ 18:30，10/11（日）9:30 ~17:00 一日目と二日目で展示時間が異なるため注意してください。 主な内容 ゲーム展示・試遊その他制作物の配布、頒布、展示普段の活動紹介 ゲーム展示・試遊 部員の制作したゲームの展示を行います。子供も遊べるアクションゲームから、難しいパズルゲームまで、計20作品の様々なゲームを展示しています！ぜひ遊びに来てください！！ 藍ノ國、紅ノ國…

東京科学大学デジタル創作同好会traPkaomojikun

映像展示

ハッカソンやその他イベント・プロジェクトなどで部員が制作した映像作品をスクリーンで上映しています。

プロジェクションマッピングイベント 「Campus→Canvas」映像展示

今年の1月と4月に大岡山キャンパスのTaki Plazaで行ったプロジェクションマッピングイベント「Campus→Canvas」の模様を上映します。

また、今回上映する動画の一部は、traPの公式YouTubeチャンネルでも視聴することができます。

東京科学大学デジタル創作同好会traP

traPは東京科学大学の公認サークルですゲーム、イラスト、音楽、Webサイト等の幅広いデジタル創作活動を行っています

YouTube

ワークショップ

3DCG体験

カメラの前に手をかざして、つまんで、3D空間を操作して、自由にCG作品を作れます！
文字通り「手を動かして、ものをつくる」体験を楽しめます！

「traPrism」では、traP部員一同、皆さんが遊びに来てくださるのを楽しみに待っています。5号館までぜひ足を運んでください！

2026/09/20~22 にオリンピックセンターで開催された JAG 夏合宿 2026 にチーム Phantasm として参加しました.

チームメンバー

• simasima : B4，考察と簡単な実装を担当
• noya2 : M1，典型・実装（・幾何）を担当
• ponjuice : B4，簡単な考察と実装を担当

まとまりのない文章になってます. チームでの参加記ってどうやって書いたらいいんだろう...

noya2 : 敬称略です.

day1

コンテスト：JAG セット 1

simasima : PCT が金と銀の風船を取りに行くみたいな話をしていたので，JLを見た．JもLも序盤にやる問題じゃなさそう．Gが構築なので見る．なんか123123みたいなのしか本質的に意味がないっぽい．小さいケースに気を付けてnoya2にパス．Dは誤読をしてしまい難しい問題を解いてnoya2に渡してしまいタイムロス．解法の修正が出来たのでギリ耐えた(耐えてない)．Jは判定は出来るが構築が怪しい．これをponjuiceに話すと構築が出来ると主張してきたので投げる．Lは不変量がARC126Eで出てきた不変量で下界が見えて，よくよく操作を考えるとその下界が達成出来る．自分で実装した．ちょっとバグらせた．Fが解かれているので，Fを見る．これは左右どっちの｜に消されるかを見る簡単なDPで解ける．これも自分で実装した．その他色々な問題が通り，残り2時間半で残り3問になった．簡単すぎないか？Eはponjuiceが出来ると言っていたので丸投げ．Aは木なのでnoya2に丸投げしてCをやる．かなり面倒だと思ったが，詰めてみると意外とすんなりいった．これも自分で実装してAC(コーナーには引っ掛かった)．これをもっと早くやるべきだったかもしれない．Eが通った後，Aの考察に加わったがあまり上手くいかず．

noya2 : 初動は面倒そうなのを飛ばして DGI を順に見た. D はたぶん可能，G は構築なので simasima に投げる，I は問題文が長いがやるだけ. ponjuice の K が終わった直後に実装して AC. G を simasima から渡され，すべての場合分けを教えてもらった，その通りに実装して AC. simasima に D でできる操作の解釈を伝えて自分は典型の見た目の H に行く. まず，可能であり，そして実装はそこそこという感じ. segtree + manachar を写経しておく. 順位表は D をやれと言っているが，どうしても FA が欲しくて H の実装を始めてしまって全然バグってもそのままデバッグしてしまった. D の担当も自分だったので仕方ない. 半径と直径の取り違えの罠から抜け出してようやく AC，FA で助かった. D は simasima に操作がうまく伝わっておらず P が CK だけでなく KC も通過できると誤読した問題の解法を渡されていたが，なんか違うということになり適当に修正すると，より素直な解法が得られた. P, CK, CPK 以外は全部区切り文字としてよい. 階乗前計算の長さを間違えて 1 ペナ（こういうミスを減らしたい）. D を AC した時点でコンテスト時間は残り半分で，ACE しか残っていない. A:noya2,C:simasima,E:ponjuice ということになり A を考える. $f(X)$ が分からずに inf 分経ったあと自明な上界が達成可能であることに気づく，$f$ を増やす方向は簡単だが，減らすのが難しい. simasima との議論が交錯しまくって実装不可能ということになってしまった... サンプルを試すところすらいかないまま終了.

ponjuice: 前の方から英語の読解を頑張っているとKが通され始めたので、読んで通す。前の方の問題群に戻り頑張って読むが、読んだだけで解けそうと主張できる問題があんま見えなかったので、まだやりやすそうに見えるBを考える。比較的すぐに$X$の偶奇が$A$,$B$から決まることが見えてきて、どうにかなりそうに見えてる。Gが通された後、実装しAC。simasimaにJの問題と木DPで辺の使う方向が決めれることを伝えられるのでちょっと考えると、頂点にいい感じに優先順位つければよさそうと思ったので、実装を考える。木DPで判定する部分でミスっているが、そのミスに気づかず1ペナ。ちょっと時間はかかったがFAが取れた。比較的自分にもやれそうなEが残っているので、これを解きに行く。simasimaに一次元のお話を聞き、それがいい感じに2次元に拡張できたので、詰める。色々と考察ミスがあり、時間がかかったが一応できたので出すとWA。ランテスを書くと、奇数のケースで上界が達成可能であることをそこで気付き、AC。Aは何もわからずfin

その後

noya2: 夜に開催される ARC++230 の Writer をしていたため，人がいない場所で Clar 対応&順位表観戦. 本質的な数え上げは 2 問しかないが 998 が 4 問あって辛い人には辛いセット（A,C の 998要素はド典型というやや強い主張）. D がほとんど既出だったらしく中国勢にめちゃくちゃ解かれたし，そうでなくても D は BC よりも典型度が高かったためたくさん通された. 配点をミスってました... B,C は面白かったと言ってもらえて良かった. 自分の作問に対するフィードバックがすぐにオフラインで返ってくる良い環境だった. 合宿中で忙しいにもかかわらず参加してくれたすべての人に感謝

ponjuice: ARC++230 を談話室から出る。
A問題の二項係数の変形が解けず一生沼っているが、後ろにも自分が得意そうな問題がない！(まずい)
Bも少し考える時間を設けつつ、Aを粘着するが、結局解けずに太陽☀️
レートが -76 されるなどをしました😭
明日の問題noyaさん原案多そうだけど大丈夫かな？とか考えつつ就寝

simasima: ARC++230 でEに粘着するも解けず．おおまかな解法は合っていたらしい．Ratedではないので0完でもセーフ．

day2

コンテスト：AMATSUKAZE セット

noya2 が Writer をしているため，Phantasm は解散 →

OUT : noya2
IN : Nachia（from 阪大，参加者内で AtCoder レート最強）

で Nachia + simasima + ponjuice = EXTRA PHANTOM 結成

noya2 : ICPC 2025 のチーム AMATSUKZE のメンバーとして 5h セットを提供した. 基本的には JAG 運営の控え室で順位表を見守るなどしていた. 難易度予想を大きく外す問題があったり順当に解かれた問題もあったりして一喜一憂したほか，Rinshan Solution が強すぎて驚きまくっていた. J が早々に解かれたこと，B を意外と上位はみんな解いてきたことが印象的. 最難の一角であった E が倒されてすごかった. これも Rinshan Solution で流石すぎる. コンテストの最後の最後に EXTRA PHANTOM が G の FA を出して，これも流石. インタラクティブが得意な人なら解いてくれると思っていたから，AC が出て嬉しかった. 面白いと言ってもらえてよかった. 中盤枠の ABCFGJL は自分が作っていたため，AC が出るたびに感心していた. ありがとうありがとう

ponjuice: 初動は環境構築を担当。yawn at top の環境が普段の環境が違うので、苦戦しながら作成。序盤はsimasimaにIが区間スケジューリング*k 解けると言われたので、実装した後、主にライブラリの写経などを担当しつつFの考察。全方位木DPがライブラリにあることを思い出しライブラリを見てみるが、初めて見るので使い方がわからない！なので、自力実装を頑張り提出するが、TLEがつく。余分なlogをつけてしまっているので、logを落とそうとするが、この時にバグを埋め込みWA。ペナをつけまくったのちAC。その後simasimaとともにG問題の考察。もらったりくばったりするDPがlog二つでいい感じに回りそうという結論になり自分が実装を担当。ちょっとムズいインタラクティブなので当然WAが出るが、どこでミスっているかがわからない。ちょっと怪しいところをなおしつつqueryを飛ばすところにassertを入れて提出するが、REが出てこずWA。終了直前にnachiaがBを通してくれたが、Gはまだ直すべきところが見つかってないので、とりあえず一部分を簡潔に書き直し提出。WA。デバッグ出力の消し忘れを思い出し、急いで提出(終了2秒前)。諦めつつ結果が出るまでリロードしてみるが、ジャッジが返ってくるのが遅い。アツい。無事ACでドーパミンを大量に出させてもらいました。ありがとう。

simasima: 簡単枠のHを倒し，Iもエスパーで倒す．Jが解けたのでNachiaさんに実装を投げるが，これがなんと誤読でNachiaさんの時間を1時間ほど奪ってしまう．その後，Jに粘着するも解けず．$N\le 1000$ で $O(N^3)$ を疑わなかったのが悪いらしい．結局NachiaさんにJを回収させてしまった．ABはNachiaさんがやってくれるらしいので，Gに粘着．想定解のオーダーが分かりにくかったが，分割統治を思い出しponjuiceに実装を投げる．NachiaさんのBとponjuiceのGが終了直前まで通らずこのまま終わるかと思いきや，どっちも通って偉すぎ．(なお順位は変わらなかった模様)

その後

noya2 : 一般にオンサイト解説は飽きられがちということで，真面目な解説は書きはするけどちゃんと楽しんでもらえる工夫を施すことになった. 自分が解説を担当した ABFGJL では，主に余談を丁寧に話すことでその問題に取り組んでいない人にも興味を持ってもらえるようにすること，緩急をつける・聴衆を見ながら話すことでなるべく自然に笑顔になってもらえるような雰囲気を作ることを目指した. 概ねうまくいったし，twitter(現X) では JAG スタッフの winter さんに褒めてもらった. 嬉しい. YesNo 後の感想戦では，問題が面白かったと褒めてもらえた一方，一部の問題では不満（I がギャグすぎる・B のサンプルが弱すぎる）も出ていて要反省であった.

day3

コンテスト：JAG セット 2

noya2 : テンプレを書き終わったあと自分向きっぽい DH を見て，D は可能で H は不可能ではないはずということになった. simasima が初手でインタラクティブの G に行っていて大丈夫か？と思ったが普通にすぐ通って FA ですごい. 自分はそれに気を取られて K に AC が出まくっていることに気づかなかった，反省. ponjuice が F に行っていたが，なんか違うらしく，実装を奪って K を AC しておいた. 2 彩色 + 連結成分の個数を BFS でやるいつもの. その後すぐに ponjuice が F を FA していた，すごい. H の FA が出ていたのでやはり可能なのかということで見る. 恐らく Nachia が通しているはずで，正直そこまで信用ならないが，取り組んでみる. ローリングハッシュかパターンマッチングみたいな方向性でずっと考えていたが全然良い感じにならない. その間に simasima が B の FA を取っており，さらに simasima の考察 + ponjuice の実装で I の FA も取っていた. チームメイトが強いと自分が変な問題に幽閉されても大丈夫でありがとう. この時点で 4 FA ですごすぎる. H は twice substring の亜種を考える問題だが，ふと run 列挙のハッシュ系の解法を知らないことに気づき，run 列挙の $O(n\log n)$ time の解法である 分割統治 + z_algorithm に注目する. $T+T$ の周期として $T$ ではなくて $T$ の cyclic shift を考えてよいというのが上手くて，分割したときの左右のどちらに完全な周期が現れているかを両方試すことにすると，うまく z_algorithm が回る. H 問題は符号が付いているが，これは単に z_algorithm に投げる配列の後半を $-1$ 倍するだけで OK. かなりシンプルで感動. しかし提出するとなんと 2 WA. z_algorithm の返り値の長さを $N+1$ だと勘違いしており，配列外参照していた. 3 ペナ目をつける前になにかがおかしいことに気付いて修正できて良かった. ponjuice の L も同じ感じで直したと思ったらまた WA，の連続になっていたが，同じタイミングで修正が完了してどちらも AC になった. 以降 simasima が C の幾何を考えている間，ponjuice が A の実装を，noya2 は J を考えていた. J がまじで分からない. $M=2$ ですら FFT 系の解法しかないように思える. bool 値だけでいいので bitset もあり得る. しかし $M=3$ の解法が出てこない. inf 分考えたが結論は出ず，いったん捨てることにして simasima が何かを主張している C に行く. 「こんな感じになると思うので実装してみて」→「違うらしいっす」を繰り返して，正しそうな $O(N^3)$ time の解法を得る. 定数倍が十分良いと信じて投げると TLE で，WA ではないことからこれを高速化すればいけるかもということになる. 答えが min-max の形で書けていたから，小手先の枝刈りが効くかもしれないということになり，いったんランダムシャッフルとかをしない素朴な枝刈りだけ入れて提出すると，なんと通った. 提出直後に，これが落とせるとしてどうやって落とすんだ？と考えると嫌な気持ちになってしまったため，なんとなく通るような気がしたが，案の定といったところ. 制約がもう少し大きければ落ちていたらしい. A は本当に苦しそうだけど前に進んではいるという感じで，E を PC が空いている間に必要な部分だけ実装するみたいなことをしていた. が，終了間際に ponjuice が何かに気づいて実装すると sample が合うようになって提出すると AC，本当にすごい. C は何チームか取り組んでいたけど，A は不人気で，これを通したのは大きい.

ponjuice: Fを見ると結構読みやすく、割と貪欲が効きそうなことが書いてある。ちょっと考えると全体攻撃の回数として考えるものがN個ぐらいしかないので書き始めるがちゃんと考える時間をとっていなかったので、添字周りが怪しそう。他の人に実装を譲りつつ実装を進めAC。 I を読み考察してみるが嘘の考察しか出てこないので、一旦スキップ。LのACが出ているので見ると、文字列を?に変形して右か上に自由に進める形になってくれる。しかし、そこから良い解法が見えず、領域木を書き始めてしまう。simasimaにこれいい感じに更新できないの？といわれ、平面捜査をようやく思いつく。実装を始めるが、入力のnを盤面サイズと勘違いする,修正が足りないなどをしてしまいペナがかさんでしまう。申し訳ない。A問題を与えられるので考察を始める。貪欲に移動させるのが強そうなので、iとi+1の蟻がx回目の衝突をするのはいつですか？のmaxみたいな問題になる。これを頑張って解くのだが、調子が悪いのか、ありえない嘘の考察ばかりしており、嘘の実装をしてしまう。運のいいことに大体のコードの流れは変わらないので小さい範囲の変更を繰り返し、サンプルが合うようになったので提出。ACが出る。サンプルつよめで感謝。

simasima: 初手でインタラクティブをGを見るととても簡単なのでFA。Bも部分列を上からマッチさせると簡単なのでFA。Lでponjuiceに「これいい感じに更新できないの」という。Iが簡単なので、ponjuiceに渡す。通る。この時点で6完ぶっちぎりトップだったので、ペナ差勝ちを確信。と思いきや、HとLがなんか全然通らず、ペナ差が怪しくなる。その間Cを考えてHの後Noyaさんに渡すもサンプルが合わず。そこからなんやかんやして、1点を固定して凸包をとる $O(N^3)$ の解法が生えて、枝刈りをすると通る。$N\le 1000$ の $O(N^3)$ は通る！

その後

noya2 : Rinshan Solution が F でペナりまくったあと途中で潜伏し始めていた. こちらも YesNo までの情報戦に備えて J に CE を出したり終了直前に E に WA を出したりしていたため，YesNo 前の感想戦は茶番多めになった. Phantasm 目線では 10 完しているので，ペナ差を考えると Rinshan Solution が 11 完するかどうかに賭かっている. あちらは終了間際に大喜びするシーンがあったので，いちおう個人的にヒヤヒヤしておくことにした. Nachia と H の解法が同じであることを確認して，勝手に喜ぶなどしていた. JAG スタッフの shinchan さんに J について聞かれ，かなり考えたが何も得られなかったことを話すと，実は結構簡単で... という話をされた. 解説を聞いて納得した，普通に難しい. YesNo では Rinshan Solution が A,C を通していないことが判明して早々に優勝を確信することになった. 蓋を開けてみれば他のチームは A,C を通せておらず，なんと Unique AC（$⟹$ FA）だった. 6 FA で優勝！Phantasm が強い.

秋気肌に染み、冴え渡る夜空に光の軌跡が映える時節を迎えました。皆様いかがお過ごしでしょうか。さて、このたび「Campus→Canvas #03」の開催が決定いたしましたのでお知らせいたします。

2026年10月29日(木)・30日(金) 18:00より、大岡山キャンパス Taki Plazaにて、プロジェクションマッピングイベント「Campus→Canvas #03 Powered by traP」を開催します！
本イベントでは、Taki Plazaの図書館側壁面を巨大なキャンバスに変え、traPの部員たちがこの日のために制作した作品を投影します。どなたでも自由にご覧いただけますので、放課後やお帰りの際にぜひお立ち寄りください。

開催概要

• イベント名：Campus→Canvas #03 Powered by traP
  • 読み：きゃんぱすとぅーきゃんばす
  • 略称：C→C・C2C（しーてぅーしー）
• 日時：2026年10月29日(木）・30日(金)　18:00〜19:00
  • 各日とも、雨天の場合中止します。
  • 開催時間中、作品を繰り返し上映します。
• 場所：東京科学大学大岡山キャンパス Taki Plaza 図書館側壁面

今回のテーマは

Campus→Canvasは今年1月・4月に続き、今回が3回目の開催となります。前回までの自由制作とは異なり、今回は初の統一テーマとして「Liquid」を設定しました。それぞれの解釈で描く、多彩な作品をぜひお楽しみください。

#C2CtraP

イベントの様子は撮影可能です。#C2CtraP でぜひSNSに投稿してください！

Campus→Canvas とは

Campus→Canvas（きゃんぱすとぅーきゃんばす）とは、2025年から始まったtraPが主催のプロジェクションマッピング企画です。企画から運営、作品まで学生で作り上げています。部員たちが制作したCG、ドット絵アニメーション、動画編集、音響演出が重なる多様で個性的な作品をお楽しみください！

過去のイベントの様子はブログやYouTubeにて公開しています。こちらもぜひご覧ください！！

プロジェクションマッピングイベント Campus→Canvas #01 を開催しました！

2026年1月15日(木)にTaki Plazaの図書館側壁面にて、プロジェクションマッピングイベント Campus→Canvas #01 を開催しました！ 開催にご協力くださったみなさん、お越しくださったみなさん、本当にありがとうございました！！ 開催概要 * イベント名 Campus→Canvas #01 Powered by traP * 読み方 キャンパストゥーキャンバス * 略称 C→C * 日時 2026年1月15日(木) 18時00分〜18時20分 * 場所 東京科学大学大岡山キャンパス Taki Plaza 図書館側壁面 イベント…

東京科学大学デジタル創作同好会traPrurun

プロジェクションマッピングイベント Campus→Canvas #02 を開催しました！

2026年4月24日(金)にTaki Plazaの図書館側壁面にて、プロジェクションマッピングイベント Campus→Canvas #02 を開催しました！ 開催概要 * イベント名: Campus→Canvas #02 Powered by traP * 読み方: キャンパストゥーキャンバス * 略称: C→C * 日付: 2026年4月24日(金) * 時間: 18:40~19:20 * 場所: 東京科学大学大岡山キャンパスTaki Plaza図書館側壁面 * ハッシュタグ: #C2CtraP イベントの様子 イベントの様子をYouTub…

東京科学大学デジタル創作同好会traPrenkon

エリア案内

鑑賞エリア

映像を綺麗にご覧いただける「鑑賞エリア」を設けております。迫力ある映像表現をぜひベストポジションからお楽しみください。

立ち入り制限エリア

プロジェクターから映像を投影するため、上記画像の通り、一部区画の立ち入りを制限させていただきます。なお、Taki Plazaの出入口は通常どおりご通行いただけます。ご協力よろしくお願いいたします。

規制日時

• 2026年10月28日(水) 17時15分〜20時00分ごろ（リハーサル）
• 2026年10月29日(木) 17時15分〜20時00分ごろ（本番）
• 2026年10月30日(金) 17時15分〜20時00分ごろ（本番）

場所 : 西9号館 3階 W9-324
野外ステージの裏に入口があります。入口が2階なので、1階上がってください。階段で上った右手にあります。
日時 : 10/10(土) 9:30 ~ 18:30，10/11（日）9:30 ~17:00

一日目と二日目で展示時間が異なるため注意してください。

主な内容

ゲーム展示・試遊
その他制作物の配布、頒布、展示
普段の活動紹介

ゲーム展示・試遊

部員の制作したゲームの展示を行います。子供も遊べるアクションゲームから、難しいパズルゲームまで、計20作品の様々なゲームを展示しています！ぜひ遊びに来てください！！

藍ノ國、紅ノ國

三柱の神々がいる世界。そこでは、藍ノ國と紅ノ國が長きにわたって戦争状態にあった。
しかし、その均衡はある時から崩れた。
主人公、レイメイは、藍ノ國の長であるタデアイから特別任務を任される。その任務中、レイメイは多くの苦難に見舞われる...

1v1で戦う見下ろし型スピードアクションゲームです。
重要なのはパリィをうまく使い、相手の攻撃をいなすこと。
迫りくる強敵を、あなたは倒すことができますか？

以下のリンクからお手持ちのパソコンでも遊べます
（旧バージョンです）
https://unityroom.com/games/ai_to_kurenai

Party on the Grid

数式で遊ぶ、最大4人のオンラインパーティーゲーム「Party on the Grid」！係数を動かしてボールをゴールへ転がす「グラフゴルフ」、変わっていく関数の地形を跳び回る「グラフサバイバル」、ボタンを押した瞬間のf(x)の値で勝負する「ピークハント」など、グラフが主役のミニゲームがそろっています。 数式から図形をイメージする能力と、とっさの操作の両方が勝敗を分けます。 ブラウザで開けば、部屋を作って友達を呼ぶだけで始められます。 数学が得意な人も苦手な人も、グリッドの上で盛り上がりましょう！

このリンクからお手持ちのデバイスでも遊べます!
https://1m26-12-ui.trap.show/

Tricolo

3色のピースを順番に動かし、ゴールへ導くパズルゲーム。
最大の特徴はたった9マスだけのミニマルな盤面！

Steamストアページが公開されてます
https://store.steampowered.com/app/4165190/Tricolo

棒人間RPG

ドット絵の棒人間によって繰り広げられるレトロゲーム風のコマンド式バトルRPG

very berry shot

very berry shotはベリー対ブルーベリーをテーマにした縦スクロール型シューティングゲームです。プレイヤーはブルーベリーを発射して敵のベリーを倒します。ガードと回復、必殺を活用してボスを撃破してください！イージー・ノーマル・ハードの3モードを用意していますので、是非腕試しに来てください！

Arsenal Stigma

流動的なビルドをテーマにした2Dアクションローグライク！
爽快感あふれるアクション、多彩な技を繰り出すボスなど様々な要素を盛り込んでいます！

悪夢祓いのアリス

時間経過でたまる妖力を使い敵を倒す、リアルタイム・ローグライト・カードバトル。

Made in traP

最速・最短・最強

多彩なミニゲームを連続でクリアし、ハイスコアを目指そう！

INSTANT REVOLUTION

たとえ何があっても、私たちはアイドルになれる────
アプグレとガジェットで戦い抜く爽快ドットアクション

Shout Wars

コマンドを 声で入力する 新感覚オンライン格闘ゲーム！(※バカゲーです)

CPU 対戦が実装されているため、一人でも遊べます！

https://github.com/traP-jp/ShoutWars/releases/latest から最新版をダウンロードしてお手持ちの Windows でも遊べますが、是非工大祭に来て友達や traP 部員と対戦して遊びましょう！

irritate

イライラ棒アクション！壁にぶつからないようにゴールを目指そう

ChronoShift

シナリオ付き重力回転パズルゲーム！

舞台は、時計の針に合わせて重力が回転する不思議な空間。
あなたの目的は、すべての時計を壊すこと。

「ChronoShift」は、時計の針に合わせて重力が回転する空間で時計を壊していく、シナリオ付き Siv3D 製パズルゲームです。

全 15 ステージありますが、なんと最終ステージのクリア者はまだ 10 人程度！？
挑戦者求む。

ReversibleRoute

リバーシの石でタイルを裏返して、ゴールまでの道を作るパズルゲーム

Hex Billiard

球が穴に落ちるように壁を置け！
高難易度ビリヤード風パズルゲームです。

それぞれのステージは正六角形のマス目で構成されていて、今まさに球がキューで打ち出されようとしています。あなたは手持ちの壁やギミックを盤面に配置することで、球が穴に入るようにする必要があります。

《以下余談》
このゲームは「ビリヤードって実はチューリング完全らしい」という話から生まれました。みんなも「ビリヤードボール・コンピュータ」で調べてみよう！

LIGHTMARE

あるとき、あなたは見知らぬ館の牢屋にいた...
化け物が潜むこの館。手元にあるのは懐中電灯のみ。
照らし、誘い出し、時には囮にする。
この光の筋を頼りに、あなたは無事に脱出できるか...?

I 埋 me

自らを土底深くへ埋葬する1人用パズルカードゲーム。
自身の命を消費しながらカードをプレイし、意図的に「死」を迎えましょう。
あなた自身の「死体」の上にカードを積み重ね、完全な埋葬を果たすことでステージクリア！
カード効果を緻密に計算し、綺麗な死を果たしましょう！

てんてこモアイランド

モアイのお世話をしながら、次々来るミニゲームをさばいてお金を稼ぐマルチタスク型スコアアタックゲームです。編成したモアイの個性をもとに様々なミニゲームが次々とやってくるのでミニゲームの並列処理が必要となります。ハイスコアを狙うには高い戦略性や素早い判断が求められます。モアイたちの機嫌を損なわずに大金持ちになろう！

Cross the C

『Cross the C』は3D探索×氷床パズルのゲームです。ステージに直接壁やゴールを置ける「ピース」を用いて、自ら航路をつくり出しましょう。シンプルなギミックの掛け合わせが生む様々なパズルが、試練としてあなたを待ち受けます。
工大祭版では一部パズルを収録したデモ版を遊ぶことができます。

▼Steamストアページ・ウィッシュリスト登録はこちら
https://store.steampowered.com/app/3382690/Cross_the_C/

SHIRO

主人公ましろの夢を会話の中から見つけ出すリアルタイム対話型ゲーム。
ましろの心を動かすほど、ヒントが露わになっていきます。
彼女が夢を忘れてしまった理由はなぜか。「しろ」にこだわる理由は何か。
ましろとの会話を通して夢のあるべき姿を考えてみてください。

Senirenol Sparkle

毎年工大祭で大人気の音ゲー「Senirenol」シリーズの最新作！専用コントローラーとモニターでプレイするゲームセンター風の音ゲーです！
今作から、ICカードやスマホをかざしてスコアや設定を保存できるようになりました！

LVMINIBVS

LVMINIBVSからはガラスで光線を操るパズルゲームを出展しています！
盤面上でガラスを動かすことで、提示されたグラフを光線による経路として再現してください！
このゲームは、我々の作成している『灯りで』から一つの要素を取ってきたものです。
『灯りで』は自作の人工言語を用いた言語解読パズルゲームです！

その他制作物の配布、頒布、展示

画集や技術書など、ゲーム以外の制作物の配布、販売、展示を行います。

グラフィック班作品展示

班員が制作したイラストを印刷したアクリルブロック、キャンバスなどの展示を行います。

映像作品展示

ハッカソンやその他イベントなどで部員が制作した映像作品をスクリーンで上映しています。

プロジェクションマッピングイベント 「Campus→Canvas」映像展示

今年の1月と4月に大岡山キャンパスのTaki Plazaで行ったプロジェクションマッピングイベント「Campus→Canvas」の模様を上映します。

過去の開催ブログはこちら↓↓↓

プロジェクションマッピングイベント Campus→Canvas #01 を開催しました！

2026年1月15日(木)にTaki Plazaの図書館側壁面にて、プロジェクションマッピングイベント Campus→Canvas #01 を開催しました！ 開催にご協力くださったみなさん、お越しくださったみなさん、本当にありがとうございました！！ 開催概要 * イベント名 Campus→Canvas #01 Powered by traP * 読み方 キャンパストゥーキャンバス * 略称 C→C * 日時 2026年1月15日(木) 18時00分〜18時20分 * 場所 東京科学大学大岡山キャンパス Taki Plaza 図書館側壁面 イベント…

東京科学大学デジタル創作同好会traPrurun

プロジェクションマッピングイベント Campus→Canvas #02 を開催しました！

2026年4月24日(金)にTaki Plazaの図書館側壁面にて、プロジェクションマッピングイベント Campus→Canvas #02 を開催しました！ 開催概要 * イベント名: Campus→Canvas #02 Powered by traP * 読み方: キャンパストゥーキャンバス * 略称: C→C * 日付: 2026年4月24日(金) * 時間: 18:40~19:20 * 場所: 東京科学大学大岡山キャンパスTaki Plaza図書館側壁面 * ハッシュタグ: #C2CtraP イベントの様子 イベントの様子をYouTub…

東京科学大学デジタル創作同好会traPrenkon

VR部室見学

3Dスキャンした部室/TakiPlazaにVRで入ろう！on VRChat
10日 12:00~ 11日 終日 を予定しています

「traPrism」では、traP部員一同、皆さんが遊びに来てくださるのを楽しみに待っています。西9号館までぜひ足を運んでください！

24BのMPです。今回は僕が制作した謎解きゲーム「Cards」についてのヒント/解説記事です。
※内容的にプレイ体験を大きく損なう可能性が高いです。未プレイの方は先にプレイすることを強くお勧めします。

#web謎 #謎解き 「Grids」を公開しました！ 試行錯誤を繰り返し条件をクリアしましょう スマホ・PCのブラウザから無料で遊べます 想定プレイ時間 10分程度 ▼プレイはこちらから https://t.co/lWEUrYyRcS https://t.co/pAjnsugRd0

— MP / ゲーム制作・DTM (@MP_cornpotage) October 8, 2026

▶プレイはこちらから

ヒント・解説

Cards ヒント(クリックで展開)

状況把握

できることは、盤面に広げられたカードをクリックし、 表向きにしたり閉じたりすることです。クリア条件は不明です。

カードをクリックしていくと、時々表向きで固定されたり、 初期状態に戻されてしまったりします。

得られる挙動などから、このゲームの正体と、 クリア条件を推測しましょう。

発想1

カードが表向きで固定されるときの条件から考えられることがあります。

発想2

カードが表向きで固定されるのは、 カードをクリックした後、次にクリックしたカードが同じ記号だった時です。

このことから「Cards」の正体は神経衰弱であり、 クリア条件は全てのカードを表向きにすることではないか、 という推測が立ちます。

発想3

しかし、発想2だけでは時々初期状態に戻されてしまうことの説明がつきません。
もう一段階の推測が必要となります。

発想4

カードの記号のパターンは限られています。
○が単独で存在する場合と、●が一定数存在する場合です。

特徴として、最初に開くカードは必ず○であること、 ○の周りのカードを開いたときは初期状態に戻されないことに 気づくことができます。

発想5

カードの●の数は、周囲8枚のカードにある 「ある物」の数を表しています。

正体

User:Ysangkok - Taken by Ysangkok., GPL , リンク による

Cardsの正体は「神経衰弱×マインスイーパー」です。

カードの記号として、○は0を、●は●の個数の数字を表現しており、 周囲8枚のカードのうち「爆弾カード」が何枚あるかを示していました。

このゲームのクリア条件は、 爆弾カード以外の全てのカードをめくることです。

カードの数字を爆弾マスの手がかりにしつつ、 対応するペアを見つけていき、 爆弾カード以外の全てのカードをめくることができれば、 「Cards」クリアとなります！

おわりに・宣伝

ここまで読んでいただきありがとうございました！
他にも謎解き、パズル系ゲームをよく作っています。全て無料で遊べるのでチェックしてみてください！

▼11月にパズルゲーム「Tricolo」をSteamでリリースします！

【発売日決定🎉】 🧩パズルゲーム『Tricolo』の発売日が11月10日に決定しました🧩！！ たった9マスの盤面で3色のピースをゴールへ導くグリッドパズルです🔴🟢 🔵！ また、10月のSteamNextFesにも参加します！ 期間中は体験版を拡張し、より高難易度のパズルに挑戦できるようになります、お楽しみに！ #gamedev #puzzlegame

— MP / ゲーム制作・DTM (@MP_cornpotage) September 29, 2026

traPでは、一か月通して開発を続けるイベント、1-Monthonを開催しました。

1-Monthonとは？

1-Monthonとは最初の一か月間で準備、残りの一か月で開発をするという長期間の制作イベントです。1-MonthとHackathonを組み合わせた造語というわけですね。
今年は7/11にチーム発表、8/8に製作開始、8/23日に中間発表、9/5に最終発表というスケジュールで行い、合計32チームが最後まで走り切り、最終発表を行いました。今年も多種多様な作品が集まった素晴らしいイベントとなりました！この記事では受賞した班の作品を一部紹介します！

なお、今回の1-Monthonは"株式会社ナレッジワーク"様の協賛を受けております。この場を借りてお礼申し上げます。

ナレッジワーク｜セールスAIエージェント

ナレッジワークはセールスAIエージェントを通じて営業生産性の向上を実現します

ナレッジワーク｜セールスAIエージェント

最優秀賞

10班「ＩＮＳＴＡＮＴ　ＲＥＶＯＬＵＴＩＯＮ」

　　　　　　　何があっても、私たちはアイドルになれる────

　　　　　　　　　　　　奏　で　る　即　興

$\mathbf{INSTANT}\mathbf{REVOLUTION}$

優秀賞

29班「藍ノ国、紅ノ国」

三柱の神々がいる世界。そこでは、藍ノ國と紅ノ國が長きにわたって戦争状態にあった。
しかし、その均衡はある時から崩れた。
主人公、レイメイは、藍ノ國の長であるタデアイから特別任務を任される。その任務中、レイメイは多くの苦難に見舞われる...

1v1で戦う見下ろし型スピードアクションゲームです。
重要なのはパリィをうまく使い、相手の攻撃をいなすこと。
迫りくる強敵を、あなたは倒すことができますか？

藍ノ國、紅ノ國 【1-Monthon 2026 29班】

こんにちは。hiyokoといいます。一か月で何かを作るイベント、1-Monthon 2026に一人で参加しました。この記事では、制作した2Dの見下ろし型アクションゲーム『藍ノ國、紅ノ國』の軽い紹介と、こだわったしくみを紹介したいと思います。 一か月頑張った結果、優秀賞をいただくことができました。ありがとうございます！ 制作したゲームについて プレイリンク unityroomにて絶賛公開中！>>>ここからプレイ<<< ゲーム概要 三柱の神々がいる世界。そこでは、藍ノ國と紅ノ國が長きにわたって戦争状態にあった。しかし、その均衡はある時から崩れた。主人公、レイメイは、藍ノ…

東京科学大学デジタル創作同好会traPhiyoko

藍ノ國、紅ノ國

三柱の神々がいる世界。そこでは、藍ノ國と紅ノ國が長きにわたって戦争状態にあった。しかし、その均衡はある時から崩れた。主人公、レイメイは、藍ノ國の長であるタデアイから特別任務を任される。その任務中、レイメイは多くの苦難に見舞われる... 1v1で戦う見下ろし型スピードアクションゲームです。重要なのはパリィをうまく使い、相手の攻撃をいなすこと。迫りくる強敵を、あなたは倒すことができますか？ [注意]・バグ報告あれば非常に助かります！・パソコンのスペックによっては、快適にプレイできない可能性があります。・バトルのみを楽しみたい方は、Enterキー長押しでの会話スキップを利用してくだ…

unityroomひよこ

新入生賞

1班「dopaQ」

最近になってよく耳にする言葉として、「ドーパミン」や「ドパガキ」があります。このサークルには「ドパガキ専門家」と他称される先輩もいるようです。　
今回の1-Monthonを走るにあたってテーマを決める際、私たちはこの「ドパガキ」の流行りを利用したものを作りたいと考えました。

そこで目を付けたのが、部内コミュニケーションツールのtraQです。traQ内では日々大量の投稿が生み出されています。しかし、traQはコミュニケーションツールという性質上、チャンネルを越えて面白い投稿を探すのは少し大変です。

こうした課題を解決するため、traQをもっと気軽に眺められる Twitter ライクのウェブアプリ「dopaQ」を制作しました。チャンネルを横断して最新順・人気順で投稿を楽しめるほか、スタンプや引用、添付ファイルなどもまとめて見ることができます。

4班「てんてこモアイランド」

モアイのお世話をしながら、次々来るミニゲーム（約30種類）をさばいてお金を稼ぐマルチタスク型スコアアタックゲームです。編成したモアイの個性をもとに様々なミニゲームが次々とやってくるので、戦略性や素早い判断が求められます。モアイたちの機嫌を損なわずに大金持ちになろう！

てんてこモアイランド【1-Monthon 4班】

はじめに この記事は、2026年の1-Monthon 4班のブログです。最終発表では新入生賞をいただくことができました。ありがとうございます！ ゲームについて プレイリンク unityroomで公開しています！ てんてこモアイランドモアイが次々と出してくるミニゲームをクリアしていくマルチタスク型ゲーム!自分だけのモアイ編成を見つけてハイスコアを目指そう!unityroom田中次郎 概要 モアイのお世話をしながら、次々来るミニゲーム（約30種類）をさばいてお金を稼ぐマルチタスク型スコアアタックゲームです。編成したモアイの個性をもとに様々なミニゲームが次々とやってくるので、戦…

東京科学大学デジタル創作同好会traPita

てんてこモアイランド

モアイが次々と出してくるミニゲームをクリアしていくマルチタスク型ゲーム!自分だけのモアイ編成を見つけてハイスコアを目指そう!

unityroom田中次郎

テーマ賞

21班「最終発表」

最終発表をしました。Blog内に動画を載せています。

最終発表 【1-Monthon 2026 21班】

こんにちは、vPhosと申します。 準備期間1ヶ月、制作期間1ヶ月で制作を行うイベント、1-Monthonに1人で参加し、テーマ賞を頂きました。ありがとうございます。 作ったもの 以下の動画を参照してください！ 0:00/1× これは実際の制作物と違い、声をそれぞれゆっくりに置き換えています。 最終発表自体が制作物、というものです。 この記事では制作中に考えたこと、やったこと、参考にしたものなど、動画内で書けなかったものを書いていきます。 準備期間 自分のできることは以下のとおりです: サウンド: 電子音楽であればそれなりに作れる、劇伴系と歌ものは無理…

東京科学大学デジタル創作同好会traPvPhos

31班「I 埋 me」

自らを土底深くへ埋葬する1人用パズルカードゲームです。
プレイヤーは自身の命をリソースとして消費しながらカードをプレイし、意図的に「死」を迎えなければなりません。 生成された自身の「死体」の上にカードを積み重ね、完全な埋葬を果たすことでステージクリアとなります。
ターン終了時に連鎖・誘発するカード効果を緻密に計算し、綺麗な死を果たしましょう！

絵が描けなくてもゲームを作りたい！1-Monthon 31班 「I埋me」

この記事は2026年度 1-Monthon 31班のブログです。 1-Monthonについて 1-Monthonは、一ヶ月で何かを作成するイベントです。チームを作って参加するメンバーが多いのですが、私は1人で参加しました。結果としては、ありがたいことにテーマ賞をいただきました。 リンク https://unityroom.com/games/i_ume_moppu599 制作にあたっての課題 さて、1人でゲームを作るとぶつかる課題が「プログラムとグラフィックの両立」。私は比較的長い間Unityを触ってきたので前者はあまり問題ないのですが、後者が大きな壁となりました。絵も…

東京科学大学デジタル創作同好会traPmoppu599

I 埋 me

自らを土底深くへ埋葬する1人用パズルカードゲームです。 プレイヤーは自身の命をリソースとして消費しながらカードをプレイし、意図的に「死」を迎えなければなりません。 生成された自身の「死体」の上にカードを積み重ね、完全な埋葬を果たすことでステージクリアとなります。ターン終了時に連鎖・誘発するカード効果を緻密に計算し、綺麗な死を果たしましょう！【操作方法】マウスカードクリック2回で使用何もないところクリックで演出スキップ【ルール説明】ライフを支払いカードを使用。自分のライフを以下にすると「死体」が生成。死体の上にカードを重ねて自らを埋葬しよう。場が整ったらターン終了。怨念を見届…

unityroomもっぷ

アイディア賞

1班「dopaQ」

新入生賞とともに受賞しました。

技術賞

18班「シンクアライブ」

18班「シンクアライブ」
ライブをもっと身近に体験できるものにしたいという思いから、スマホをペンライトに見立てた同時視聴アプリを作成しました。
youtubeやニコニコ動画のボカロ曲のURLを貼るだけでルームが作成され、初音ミクがリズムに合わせて踊ってくれます。

シンクアライブ【1-Monthon 18班】

この記事は2026年ワンマンソン18班の参加記事です。 技術賞をいただきました！！ 制作物 ライブをもっと身近に体験できるものにしたいという思いから、スマホをペンライトに見立てた同時視聴アプリを作成しました。 youtubeやニコニコ動画のボカロ曲のURLを貼るだけでルームが作成され、初音ミクがリズムに合わせて踊ってくれます メンバー 24B エルマer　全員自認の魔法少女ということがきっかけにチームが結成されました。悪魔役担当です。そこ、黙りなさい。 24B あきも　最近はワスのことばかり考えています。すき…… 24B otima　進捗の魔女。その性質はシン…

東京科学大学デジタル創作同好会traPElmer

作品名賞

25班「相天使」

25班「相天使」
二人の少女の間で紡がれる、静かに美しいうっすら終末ストーリー・アニメーション

50枚ほどイラストを描いて、世界観重視でこだわりを詰めた映像に仕上げました!
(一部イラストと音声に手を加えてからになりますが、9月末~10月初めを目処にYouTube等に上げる予定です! お待ちください🙇)

企業賞

31班「stoQ」

私たちが作ったのは、「stoQ」という講習会ナレッジベースです。部内で開催された講習会をストックしていき、資産として新たな学習者に届けることを目指しました。

さらに、このサービスが使われるようになるために、講習会運営にデータを入力してもらう必要があったため、情報入力用のUIを誰でも編集できるような機能も実装し、運営の入力の手間を減らすことも考えました。

この作品は、ハッカソンにご協賛いただいた株式会社ナレッジワーク様より、企業賞に選定いただきました！

また、話の成り行きでUIライブラリを自作することになりました

このサービスを作ろうと考えた背景など、詳しい内容は下記のブログをにまとめてありますのでぜひ読んでください！

1-Monthon参加記 部内講習会向けサービス「stoQ」

この記事は夏のブログリレー21日目に投稿された @quarantineeeeeeeeeeによる 講習会をシステム化するサービスを作ろうとした【ハッカソン反省】 の続きです。 作品紹介 私たちが作ったのは、「stoQ」という講習会ナレッジベースです。部内で開催された講習会をストックしていき、資産として新たな学習者に届けることを目指しました。 GitHub - traP-jp/1m26_13Contribute to traP-jp/1m26_13 development by creating an account on GitHub.GitHubtraP-jp さらに、このサー…

東京科学大学デジタル創作同好会traPIda-ji

ブログについて

この記事では受賞した班の作品のみを紹介しましたが、惜しくも受賞を逃した班も素晴らしい作品を作り上げました！
そんな作品たちについて、たくさんの班が自身のチームの作品のブログを公開しています！
以下のリンクからぜひご覧ください！！
https://trap.jp/tag/1-monthon/

2026/09/26(土)に第23回ゲーム制作者交流イベントGame³を開催しました。
今回のGame³では、合計32個のゲームが展示されました！

ゲーム制作者交流イベントGame³とは？

Game³(ゲームキューブ)とは、ゲーム制作者同士の交流を目的とした東京科学大学デジタル創作同好会traP主催のイベントです。

年2回（3月、9月）東京科学大学大岡山キャンパスにて開催しています。
ゲームを展示する人がブースに分かれて展示を行い、参加者からゲームの感想を聞いたり、展示者に質問したりできます。
ブースの展示者も他のゲームを見学できるように休憩時間を設けます。また、投票を行い優秀作品の表彰も行います。

今回は、「Cygames」様にご協賛をして頂きました。

詳しくは公式HPをご覧ください。

トップページ

第23回Game³は2026/9/26に開催予定です。Game³（ゲームキューブ）とは、クリエイター同士の交流を目的としたゲーム展示イベントです。ターム制の採用や懇親会など、ほか展示イベントよりも交流を重視したプログラムが特徴です。主に関東圏の同人ゲーム制作者・サークル様に数多くご参加頂いています。本イベントは「すべてのゲームクリエイターへ。」をコンセプトに、学生などの「はじめての出展」を応援しています。「ゲームを作ったけど人に見せる機会がない」「プレイヤーから直接フィードバックを受けたい」などでお困りの方が、まず作品を公開してみようと思える場を目指しています。

第23回 第23回

当日の流れ

開会式を行った後、3タームに分かれてゲームの展示を行いました。
展示されたゲームの詳細はこちらからご覧ください。

展示終了後には、閉会式・懇親会を行いました！

人気投票

来場者のアンケートによって、人気投票を行いました。
結果は、

• 1位　藍の国、紅の国
• 2位　INSTANT REVOLUTION
• 3位　vs棒人間！クラッシュバトル
• 企業賞　Pathwirght

となりました。

受賞された皆様、おめでとうございます！

当日の様子

次回の開催

次回の開催は、2026年3月を予定しております。
今回のGame^3をお楽しみいただいた方はもちろん、初参加の方もお待ちしております！

traP VirtualLive プロジェクトは、10/10 工大祭にて、バーチャルライブ「Starry Notes 2nd Live」を開催します！

開催概要

• 公演名: 「Starry Notes 2nd Live」
• 日時: 10/10(土)  10:00開場  10:15開演
• 場所: 東京科学大学 大岡山キャンパス 70 周年記念講堂

Starry Notes とは

2025 年度後期に traP で発足したプロジェクト「VirtualLive」が主催するバーチャルライブです。今年4月に開催した「Starry Notes Debut Live」に続き、第2弾の公演となります。学内の方はもちろん、一般来場の方も大歓迎です。
今回のライブでは、プロジェクトのオリジナル楽曲も披露します。ぜひ会場でお楽しみください！

公式 SNS

当日のご案内などは公式Xにて随時発信しています。ぜひフォローをお願いします！
公式X: @StarryNotestraP

公式ハッシュタグ: #StarryNotes / #StarryNotes_2ndLive（クリックでポスト作成画面が開きます）

ご来場のみなさまへ（注意事項）

来場者のみなさまが安全に楽しくライブを楽しめるよう、以下のご協力をお願いいたします。

• スムーズな入退場へのご協力
  開場時間は 10:00、開演は 10:15 です。開演直前は混雑が予想されますので、お時間に余裕をもってお越しください。スタッフの誘導・指示へのご協力をお願いいたします。
• ペンライトについて
  当日会場でもペンライトを配布いたしますが、ご自身のペンライトのお持ち込みも大歓迎です！ぜひお気に入りの光でステージを盛り上げてください。
• 撮影・録音について
  ・写真撮影: 可能です（※フラッシュ撮影は禁止となります。演出および他のお客様へのご配慮をお願いいたします）。
  ・録音・録画: 全面禁止とさせていただきます。

この記事は夏のブログリレー 36日目の記事です。

ブログ投稿が遅れてしまい申し訳ございませんでした。

ブログの予約投稿時間と、システムのメンテナンス時間が重なってしまい、本来の時間(2026/09/21/23:59)に投稿できていませんでした。

夏休みも終わりに近づき、少々肌寒さを感じるようになってきたところで、夏のブログリレーも今日で終わりです。
約1か月間、部員が様々なブログを投稿してきましたが、楽しんでいただけましたでしょうか？

今後も部内の活動をブログを通して発信していきますので、ぜひご覧ください！

また、10月から後期入部期間が始まりますので、traPに興味を持ってくださった方は公式Xやブログ等での案内をお待ちください。
(入部期間外でも入部を受け付けていますのでこちらもご参照ください。)

24BのMPです。今回は僕が制作した謎解きゲーム「Grids」についてのヒント/解説記事です。
※内容的にプレイ体験を大きく損なう可能性が高いです。未プレイの方は先にプレイすることを強くお勧めします。

#web謎 #謎解き
「Grids」を公開しました！
試行錯誤を繰り返し条件をクリアしましょう

スマホ・PCのブラウザから無料で遊べます
想定プレイ時間 45分程度

▼プレイはこちらからhttps://t.co/6XmMl92HnF pic.twitter.com/2VdThQqcSX

— MP / ゲーム制作・DTM (@MP_cornpotage) September 26, 2026

▶プレイはこちらから

ヒント・解説

 1   2   3   4
 5   6   7   8
 9  10  11  12
13  14  15  ◇

◇ A
 B C

◇ B
 C A

◇ C
 A B

A + B = x
B + C = y
C + A = z

おわりに・宣伝

ここまで読んでいただきありがとうございました！
他にも謎解き、パズル系ゲームをよく作っています。全て無料で遊べるのでチェックしてみてください！

▼最近のおすすめはこちらです

#謎解き #web謎
「Planets」を公開しました！
試行錯誤を繰り返し条件をクリアしましょう

ある作品のリスペクト作品です

スマホ・PCのブラウザから無料で遊べます
想定プレイ時間 5~30分

▼プレイはこちらからhttps://t.co/lqTMdD8tzC pic.twitter.com/KqKXUHwRiH

— MP / ゲーム制作・DTM (@MP_cornpotage) July 18, 2026

#スーパーゲ制デー #謎解き
【数字当て×条件推測】
Understandライクな数字当てゲーム「NUMQUETE」を公開しました！

数字から条件を、条件から数字を推測し
試行錯誤して問題を解き明かそう

スマホ・PCのブラウザから無料で遊べます
想定時間60分~

▼プレイはこちらからhttps://t.co/zsrf6v9W7x pic.twitter.com/bKpj1fLdhz

— MP / ゲーム制作・DTM (@MP_cornpotage) July 10, 2026

競技プログラミング(AtCoder)をしていると、水レートあたりから顔を出し始めて、青になってくるとみんな知ってる、そんなアルゴリズム、畳み込み。僕もようやくこれに手を付けて、少しばかり勉強して、自分のライブラリに入れました。

畳み込み自体は数年前から知っていたのですが、複素数やら、整数環やらと出てくるとかなり構えてしまい、また読み進めると何をやっているのかよくわからなくなって、幾度も理解を諦めていました。今回の記事では、よくある他の記事とは順序を変えて、僕が理解した順序で説明を書いてみます。複雑な数学的背景は可能な限り飛ばしますが、どうしても数式を使うことは避けられないので、その点は頑張ってください。また、具体的なコードの実装の説明も行いません。あくまでも理論的な部分を理解する土台を作るための記事です。

またtatyamさんが、前にも畳み込みに使われるアルゴリズムであるFFTの解説を書いて下さっています。この記事よりも正確になっているので、数式が全く怖くない、FFTの仕組みをしっかり理解したい、という方はこちらを見た方がいいかもしれません。

【競プロer向け】FFT を習得しよう！

こんにちは、20B の @tatyam [https://trap.jp/author/tatyam] です。この記事は、traP夏のブログリレー[/tag/summer-blog-relay] 33日目の記事です。 高速フーリエ変換 といえば、競技プログラミングで数列の畳み込みなどに使われるテクニックですね。今日は高速フーリエ変換と高速フーリエ変換を利用した畳み込みを習得していきましょう。 ポエム一般的なフーリエ変換の 定義 / 説明 と異なる部分があるかもしれませんが、競プロであればこれで十分だと思います。AtCoder では AC Library[https://atcod…

東京科学大学デジタル創作同好会traPtatyam

畳み込みとは

定義

原義的な畳み込み、特に離散的な方の畳み込みは、次のようにして定義されます。

$$(f\ast g)(m)=\sum _{n}f(n)g(m-n)$$

言葉で言うと、二つの関数の引数の和が一定になるようにして足し合わせたものです。ここで出てきた関数 $f$ や $g$ は、この記事では数列と解釈して差し支えないでしょう。そこで、この畳み込みを二つの数列$A$と$B$に対して定義して、その結果を$C$とします。すると、次のように書くことができます。

$$C_n=\sum _{m=0}^n{A}_m{B}_{n-m}$$

競技プログラミングで出てくる畳み込みは、この式で計算される $C_n$ を、定義できる全ての$n$について求める計算を指します。

計算量

この畳み込みを計算することを考えます。各$n$について$n$個の総和を計算することになるので、時間計算量は$O(N^2)$になります。これでは遅いので、もう少し早くしたいところです。線形時間とは言いませんが、$O(N\log N)$程度になってくれると嬉しい。

そしてこの計算量は実現可能で、これを実現するのが 高速フーリエ変換　(FFT) と呼ばれるアルゴリズムです。ここからは、畳み込みがどう高速化されているのか、FFTは何に使われるのかをゆっくりと理解していきましょう。

数列から多項式へ

畳み込みを理解する前に、少し数列の表現方法について説明します。

係数による表現

フーリエ変換を用いた畳み込みの計算では、数列を多項式として解釈します。つまり、長さ$N$の数列$A=(a_0,a_1,...,a_{n-1})$があるとき、これを多項式$f_A(x)=a_0+a_{1}x+a_2{x}^2+...+a_{n-1}{x}^{n-1}$で表される$N-1$次の多項式として見ます。こうすると、畳み込みを多項式の積として解釈できます。

例として長さが3と2の数列$A=(a_0,a_1,a_2)$と$B=(b_0,b_1)$を用意し、それぞれに対応する多項式を$f_A(x)$、$f_B(x)$とします。この積$f_C(x)$を計算してみましょう。

$$\begin{gathered} f_C(x)=f_A(x)\times f_B(x)=(a_0+a_{1}x+a_2{x}^2)(b_0+b_{1}x) \\ =(a_0{b}_0)+(a_0{b}_1+a_1{b}_0)x+(a_1{b}_1+a_2{b}_0)x^2+(a_2{b}_1)x^3 \end{gathered}$$

各項の係数についている添え字に注目します。すると、どの項でも$A$の添え字と$B$の添え字の和がその項の$x$の次数に一致することがわかります(2乗の項の$a_0{b}_2$は$b_2=0$と解釈する影響で消えてしまっています)。特に、$x$の$n$乗の項の係数を$c_n$として$C=(c_0,c_1,c_2,c_3)$とすると、$C$は$A$と$B$の畳み込みになっています。

値による表現

前項では数列から多項式を作ることができることがわかりました。今度は、一つの多項式を数列で表現することを考えます。各行の係数を取ってきた数列は、元の多項式をよく表現してくれます。ところで、多項式を表現する、一つに指定する方法はそれだけでしょうか？

直線は1次の多項式を使って表すことができます。そして、その直線を特定するには、その直線が通る2点の情報があれば十分です。2次関数なら2次の多項式を用いて、通過する3点があればよく、3次関数では3次の多項式で4つの通過点があると特定できます。

一般に、$n$次の多項式$f(x)=a_0+a_{1}x+...+a_n{x}^n$の各係数は、グラフ$y=f(x)$の通過する点が$n+1$個あれば求めることができます。言い換えると$n+1$個(以上)の点の情報$(f(r_0),f(r_1),...,f(r_n))$があれば、一つの多項式を表現できるということです。

尚、各多項式がどの数列によるものなのかをわかりやすくするため、数列$A$から作られた多項式$f_A$を単に$A(x)$、その出力値から得られる数列を$\hat{A}=({\hat{a}}_0,{\hat{a}}_1,...,{\hat{a}}_{n-1})$とします。
(数列$A$と混同しないよう気を付けてください)。

多項式の掛け算

さて、数列から作られる多項式の表現として

1. 係数からなる数列
2. 多項式の出力値からなる数列

の2種類を得ることができました。今回やりたいことである畳み込みは多項式の積と対応するので、多項式の積を取ったときにこれらの数列がどう変わるのかを調べてみます。これまで通り、数列$A$と$B$からなる多項式$A(x)$と$B(x)$を考えます。

まず、係数からなる数列は先述の通り二つの数列の畳み込みとなります。問題は出力値の方です。こちらは単なる値の積となってくれます。つまり、$C(x)$について、

$$(C(r_0),C(r_1),...,C(r_{n-1}))=(A(r_0)B(r_0),A(r_1)B(r_1),...,A(r_{n-1})B(r_{n-1}))$$

です。$C(x)=A(x)B(x)$で定義したので当然ですが、こちらはかなり簡単になりました。$\hat{A}$と$\hat{B}$さえわかれば$\hat{C}$の値が即座にわかります。

問題の変換

$C(r_i)=A(r_i)B(r_i)$と、積の計算が随分と楽になりました。しかし、これで終わりではありません。ここまで言及していなかった、重要な事項がいくつかあります。

まずは$A(r_i)$を実際に計算するときの計算量です。$A(x)$は$N-1$次の多項式ですから、この値を愚直に計算するには$O(N)$の時間計算量が必要になります。これを必要なだけ求めると、$\hat{A}$の計算には最終的に$O(N^2)$時間必要となり、高速化は実現されていません。
第二に、$C$から$\hat{C}$への変換に使う引数$r_i$の決定です。どのような値を使えばよいでしょうか？
第三に、$\hat{C}$から$C$への変換です。ここまで、$C$から$\hat{C}$の変換方法は説明しましたが、その逆はまだです。

次の章からは、数列の畳み込みを多項式の積と解釈したことによって出たこの課題を解決する手段を説明します。少しフライングすると、$r_i$を適切に決めることで、これらの問題を一気に解決します。

高速フーリエ変換

入力 $r_i$ の決定

$N$要素の数列$A$から$\hat{A}$を計算することで、畳み込みの計算が1歩進むことがわかりました。ここからはその計算方法を実際に追っていきます。

まずは$A(x)$への入力とする$r_i$の決定です。$r_i$はどんな値がいいでしょうか？まず、異なる$N$個の点が欲しいので、$r_i$も互いに異なっていてほしいですね。他にどんな条件があるといいでしょうか。離散フーリエ変換で用いられる$r_i$は、追加で次の性質を持っています。

• $r_i$は次の性質を満たす数$\omega$の$i$乗
  • ${\omega }^N=1$
  • ${\omega }^{(N/2)}=-1$ ($N$が偶数のとき)

アルゴリズムの解説に集中したいので、この記事では具体的な$\omega$の値は説明しません。ほとんどのFFTの解説記事には書いてあるので、気になる人は調べに行ってみましょう。

$A(r_i)$の計算

では、このような値を使って計算したとき、どんなことが起こるでしょうか。
ここでは、$N$を偶数として計算をしてみます。(もし$N$が偶数じゃないなら、数列に0の項を一つ付け足せば良いです)
まず、$A(x)$は${\sum }_{j=0}^{N-1}{a}_j{x}^j$ ですから、

$${\hat{a}}_i=\sum _{j=0}^{N-1}{a}_j{r}_i^j=\sum _{j=0}^{N-1}{a}_j{\omega }^{ij}$$

と書けます。$N$が偶数なので、この総和について$j$が偶数の項と奇数の項とで分けてみます。

$${\hat{a}}_i=\sum _{j=0}^{N-1}{a}_j{\omega }^{ij}=\sum _{j=0}^{N/2-1}{a}_{2j}{\omega }^{2ij}+\sum _{j=0}^{N/2-1}{a}_{2j+1}{\omega }^{i(2j+1)}$$

ここの第二項について、${\omega }^i$をくくって

$${\hat{a}}_i=\sum _{j=0}^{N/2-1}{a}_{2j}{\omega }^{2ij}+{\omega }^i\sum _{j=0}^{N/2-1}{a}_{2j+1}{\omega }^{2ij}$$

となります。では同じ計算を、${\hat{a}}_{i+N/2}$についても行ってみると、なんやかんやあって ($i$を$i+N/2$に変えるだけです)

$${\hat{a}}_{i+N/2}=\sum _{j=0}^{N/2-1}{a}_{2j}{\omega }^{2(i+N/2)j}+{\omega }^{i+N/2}\sum _{j=0}^{N/2-1}{a}_{2j+1}{\omega }^{2(i+N/2)j}$$

となります。$\omega$周りは、$\omega$の持つ性質、${\omega }^N=1$、${\omega }^{(N/2)}=-1$を使ってさらに整理できて

$${\hat{a}}_{i+N/2}=\sum _{j=0}^{N/2-1}{a}_{2j}{\omega }^{2ij}-{\omega }^i\sum _{j=0}^{N/2-1}{a}_{2j+1}{\omega }^{2ij}$$

となります。

この二つを見比べてみると、なんと足し引きが違うだけでほとんど同じであることがわかります。試しに

$$\begin{gathered} {\hat{e}}_i=\sum _{j=0}^{N/2-1}{a}_{2j}{\omega }^{2ij} \\ {\hat{o}}_i=\sum _{j=0}^{N/2-1}{a}_{2j+1}{\omega }^{2ij} \end{gathered}$$

なんて書けば、

$$\begin{gathered} {\hat{a}}_i={\hat{e}}_i+{\omega }^i{\hat{o}}_i \\ {\hat{a}}_{i+N/2}={\hat{e}}_i-{\omega }^i{\hat{o}}_i \end{gathered}$$

となります。つまり、実質的に計算が必要な${\hat{a}}_i$が半分になっています。
そして、${\hat{e}}_i$や${\hat{o}}_i$の式を見ると、これもまた同じ出力値の計算になっていることがわかります。

再帰計算

少し詳しく書きます。$E=(e_0,e_1,...,e_{N/2})=(a_0,a_2,a_4,...,a_{n-1})$ として、$\hat{E}$を考えます。$E$は$A$のちょうど半分から作っているので、その要素数が$N/2$個であることに注意すると、計算に使う$r_i$として$({\omega }^2{)}^i$を使うことができます。実際、

• $({\omega }^2{)}^{N/2}={\omega }^N=1$
• $({\omega }^2{)}^{(N/2)/2}={\omega }^{N/2}=-1$

となって、$A$に対する計算で使った$\omega$と同様の性質を満たします。

では計算してみましょう。$E(r_i)$を求めます。

$$\begin{gathered} E(r_i)=\sum _{j=0}^{N/2-1}{e}_j{r}_i^j=\sum _{j=0}^{N/2-1}{a}_{2j}({\omega }^2{)}^{ij} \\ ={\hat{e}}_i \end{gathered}$$

となって、確かに${\hat{e}}_i$が$E(r_i)$となっています。同様に、${\hat{o}}_i=O(r_i)$です。

ここまでをまとめると、$\hat{A}$($N$要素)を求める問題を、$\hat{E}$と$\hat{O}$ ($N/2$要素)を求める問題に分割することができました。もし$E$や$O$も偶数個からなる場合、これをさらに分割できます。もし$N$が2冪であれば、この分割を繰り返すことができて、高速に計算できそうです。特に、数列の末尾に0をつけ足しても結果は変わらないので、$N$はいつでも2冪にすることができます。ﾔｯﾀｰ

これによる計算量を見積もります。$A$を$E$と$O$に分割して同じ問題を解いた後、$\hat{A}$はその結果$\hat{E}$と$\hat{O}$から各要素を定数時間で計算できる(${\hat{a}}_i={\hat{e}}_i+{\omega }^i{\hat{o}}_i,{\hat{a}}_{i+N/2}={\hat{e}}_i-{\omega }^i{\hat{o}}_i$)ので、後半の計算は$O(N)$となります。そして、数列の分割は$O(\log N)$段階まで出来るので、$A$から$\hat{A}$の計算は全体で$O(N\log N)$時間で計算できました。

尚、計算を二つに分け、分割しながら計算したこのアルゴリズムを高速フーリエ変換 (FFT) と呼びます。

逆変換

ここで目的を再確認しましょう。当初の目的は数列$A$と$B$の畳み込み$C$を計算することです。そのため、$A$や$B$で作られる多項式$A(x)$と$B(x)$の積を考えました。ここで、$A(x)$や$B(x)$にいくつかの値を代入して得られる数列$\hat{A}$と$\hat{B}$を使うと、$C(x)$を表現している$\hat{C}$を簡単に求めることができます。

ここまで、そのうち$A$、もとい$A(x)$から$\hat{A}$を高速に計算する方法を解説しました。あとは$\hat{C}$から$C(x)$を復元し、$C$を得ることができれば目的達成です。

結論から書くと、この逆変換は

$$a_i=\frac{1}{N}\sum _{j=0}^{N-1}{\hat{a}}_j{r}_i^{-j}=\frac{1}{N}\sum _{j=0}^{N-1}{\hat{a}}_j{\omega }^{-ij}$$

です。
これが正しいことを実際に確かめます。まずは左辺に${\hat{a}}_j$の計算式を代入します。

$$\frac{1}{N}\sum _{j=0}^{N-1}\left(\sum _{k=0}^{N-1}{a}_k{\omega }^{jk}\right){\omega }^{-ij}$$

和の順序を入れ替えて

$$\frac{1}{N}\sum _{k=0}^{N-1}{a}_k\sum _{j=0}^{N-1}{\omega }^{j(k-i)}$$

ここで出てきた${\sum }_{j=0}^{N-1}{\omega }^{j(k-i)}$をさらに計算します。
$i=k$のとき、${\omega }^{j(k-i)}=1$なので、${\sum }_{j=0}^{N-1}{\omega }^{j(k-i)}=N$です。

$i\ne k$なら、${\sum }_{j=0}^{N-1}{\omega }^{j(k-i)}$は初項$1$、公比${\omega }^{k-i}$の等比数列の和になります。(${\omega }^{k-i}$は$1$にならないという性質を持ちます。)

そのため、等比数列の和の公式から

$$\sum _{j=0}^{N-1}{\omega }^{j(k-i)}=\frac{({\omega }^{k-i}{)}^N-1}{{\omega }^{k-i}-1}=\frac{({\omega }^N{)}^{k-i}-1}{{\omega }^{k-i}-1}=\frac{1^{k-i}-1}{{\omega }^{k-i}-1}=0$$

です。以上まとめると、

$$\frac{1}{N}\sum _{k=0}^{N-1}{a}_k\sum _{j=0}^{N-1}{\omega }^{j(k-i)}$$

は$i=k$の場合だけが残って、

$$\frac{1}{N}\sum _{k=0}^{N-1}{a}_k\sum _{j=0}^{N-1}{\omega }^{j(k-i)}=\frac{1}{N}\times N{a}_i=a_i$$

となって、確かに逆変換が成立していることがわかりました。

順変換との差異

$a_i$と${\hat{a}}_i$の相互変換を求めることができました。
2つの式を比べてみます。

$$\begin{gathered} {\hat{a}}_i=\sum _{j=0}^{N-1}{a}_j{\omega }^{ij} \\ {a}_i=\frac{1}{N}\sum _{j=0}^{N-1}{\hat{a}}_j{\omega }^{-ij} \end{gathered}$$

まず逆変換の方は、和の後に$N$で割っています。もう一点、$\omega$が${\omega }^{-1}$に置き換わっていますね。
それ以外は順変換と逆変換は何も変わっていません。はい、何も変わっていません。つまり、順変換のアルゴリズムを逆変換にも使うことができ、順変換、逆変換ともに高速に計算出来るのです。

まとめ

さて、ここまでをまとめます。

二つの数列$A=(a_0,a_1,...,a_{N-1})$と$B=(b_0,b_1,...,b_{M-1})$について、その畳み込み$C=(c_0,c_1,...,c_{N+M-1})$を求めることを考えます。

まず、整数$L$を、$N+M-1$以上となる2の累乗で求めて、$A$と$B$の長さを$L$にします。(新しい部分は0で埋める)
次に$A$から

$${\hat{a}}_i=\sum _{j=0}^{L-1}{a}_j{\omega }^{ij}$$

で得られる$\hat{A}=({\hat{a}}_0,{\hat{a}}_1,...,{\hat{a}}_{L-1})$を高速フーリエ変換により計算し、同様に$\hat{B}$も求めます。これら二つから

$${\hat{c}}_i={\hat{a}}_i{\hat{b}}_i$$

で$\hat{C}=({\hat{c}}_0,{\hat{c}}_1,...,{\hat{c}}_{L-1})$が得られます。
これに対して、

$$c_i=\frac{1}{N}\sum _{j=0}^{L-1}{\hat{c}}_j{\omega }^{-ij}$$

で得られる$C$を再び高速フーリエ変換により計算することで、最初の目的を達成することができました。

以上のアルゴリズムが高速フーリエ変換により畳み込みを高速に計算する方法です。

最後に

(説明のまとめに「まとめに」を使ってしまったので「最後に」です)

お疲れさまでした！！！

🎉これであなたも畳み込み・高速フーリエ変換を理解できました！🎉

と言ってみたものの、実はまだ一つ巨大な問題が2つほど残っています。

まず一つ目は、今回の記事で出てきた謎の数$\omega$の正体です。個人的に、この$\omega$がFFTの理解における一番の壁だと思っています。水や青コーダーでこの類の分割統治につまずく人はほとんどいませんからね。今回、$\omega$は単なる都合のいい数としてしか出ていません。しかし、その性質だけを抑えておくことで、難しい部分をスキップして説明をすることができています。

二つ目は、この畳み込み、およびFFTを処理する実装です。この記事では理論的な部分の(それも一部の)説明にとどめています。今回説明しなかったこれら二つはまた別の記事としていずれ出す、かもしれません。しかし、ここまで理解出来たら、$\omega$の理解も、実装の理解も容易いはずです。

では、またの機会に。

参考

【競プロer向け】FFT を習得しよう！

こんにちは、20B の @tatyam [https://trap.jp/author/tatyam] です。この記事は、traP夏のブログリレー[/tag/summer-blog-relay] 33日目の記事です。 高速フーリエ変換 といえば、競技プログラミングで数列の畳み込みなどに使われるテクニックですね。今日は高速フーリエ変換と高速フーリエ変換を利用した畳み込みを習得していきましょう。 ポエム一般的なフーリエ変換の 定義 / 説明 と異なる部分があるかもしれませんが、競プロであればこれで十分だと思います。AtCoder では AC Library[https://atcod…

東京科学大学デジタル創作同好会traPtatyam

この記事は夏のブログリレー36日目の記事です。

目次

• PixelComposerについて
  • サクッと作れる表現
  • PixelComposerを始めるにあたって
  • 前半のまとめ
• PixelComposerで作れる「ボーンアニメーション」紹介のコーナー)
  • PixelComposerでの「ボーンアニメーション」
  • ルコンポのここが強い！ここが弱い！
  • アニメーションの作り方

PixelComposerについて

前半部分は「PixelComposerとはそもそも何か？」「どんなことができるのか？」「始めてみたいけど何すればいいのかようわからん」という人に向けた内容です！
執筆はMimiが担当します。よろしくお願いします。
(ちなみに以前にもPixelComposerブログを出しているので、是非こちらもご覧ください)

公式の説明

Pixel Composer is a node based VFX compositor for pixel art. Using nodes to pass data and apply different effects. It also support keyframe-based animation with timeline.

PixelComposerはピクセルアートのためのノードベースのVFXコンポジター
と公式ドキュメントで言っています。

blenderのGeometryノードやUnityのShaderGraphを触ったことがある人ならわかると思いますが、

処理を連鎖的に組み合わせて複雑な処理を実現する が根本的なアイディアです。

例えば

例えば上の画像は

1. 円を一つ用意して大きくする
2. 更に内側にもう一つ円を用意し、1の円より少しタイミングを遅らせて大きくする
3. 1の円を2の円で削る
4. ↑でできた画像を複製する(配列として持つ)
5. 回転や位置、色がランダムになるようにする(インデックスごとにバラバラな値を持つ)
6. 一つ一つにアウトラインをつける
7. 複製したものを少しづつタイミングをずらしながら一気に生成する

という風に、処理が連鎖されてできています！

今回はそんなPixelComposerについて

1. 基本的なこと
2. PixelComposerにおけるボーンアニメーション

をまとめた記事となっています！

サクッと作れる表現

爆発・衝撃波

衝撃波も兼ねた簡単な爆発表現なら
①円を膨らませる
②その内側に少し遅れて円を膨らませる
で作ることが出来ます。前後にパーティクルを置いてあげるとちょっと見栄えが良くなるかも

水・液体表現

Displacementノードという歪み処理ができるノードを使った屈折表現や、Blur+Thresholdで液体っぽい表現を作ることが出来ます。

炎の模様表現

ノイズをつかってゆらゆら揺れる表現を作ることが出来ます。それを上にスクロールさせることで炎が上がっていくような表現が作れます。

3D的な表現

なんとPixelComposer内で3Dモデルを読み込んだり生成し、カメラで写したものを画像として扱ったりできます。スゴイ！

このように、色んなノードを組み合わせる事で簡単に色々な表現ができるのがPixelComposer(というかコンポジットツール全般)の強みです。

PixelComposerを始めるにあたって

PixelComposer興味あるよ！という方に向けて、いくつかのノード群の特徴をまとめます！

Generate(生成)

万物の祖です！
Generateという名前の通り、生成ができます。
何が生成できるのかというと

• 図形
  • 
  • テンプレとしてこんな感じのが用意されてる。パラメータとかもいじれる(例えばドーナツなら内側の円と外側の円の半径など)ので、嬉しい
• ノイズ
  • 
  • 色んなノイズがいっぱい。もちろんパラメータつきで。
• 模様
  • 
  • 模様もいっぱい。
• その他にも
  • 
  • UVMapやグラデーション、なんとパーティクルもある。

など、万物を生成できます。
(一応Luaでスクリプトも書けるんですが、)数式的な処理が面倒なぶんこういった素材が充実してるのがアツい所です。

Transform(変形)

モーショングラフィックスっぽいことやるならコイツです。
Transformというノード群があるのになぜかTransformという単一のノードがあります。しかもこのノードは結構他のノードの機能を包含してる。

僕はこんな感じでいっぱいキーフレーム打って使うことが多いです。

Filter(加工)

画像全体への加工を扱えるノード群です。

• アウトライン
• ぼかし(Blur)
  • ブラーだけで15個ぐらいノードある
• ポストプロセス(Bloom、色収差、Vignette...)
• ゆがみ(Warp)
  • これもノードめっちゃある

など、本当に色々あります(本当に色々ある。)

個人的超便利Filterノードは

• Colorize(黒~白をグラデーションの色に置換したりできます。超便利)
  • 
• Threshold
  • 閾値処理。「明度がこの数値以上の部分だけ映す」「透明度がこの数値以上の部分だけ映す」ができる。BlurとかNoiseとかと合わせると大変アツい
  • 
• Posterize
  • 色を段階に無理やりn段階に分けることが出来る。
  • 特に解像度の高い(ちょっとAAがかかりすぎているもの)をドット調にするのにお勧め
  • 

です。特にColorizeはいつも使ってる。

大体この3種類のノードを使い、
Generateで生成→Transform・パラメータのアニメーションで動かす→Filterで加工
の一連の流れでそれっぽいものは出来上がって、嬉しい気持ちになります。

他にも、3D系のノードやシミュレーション系のノードなど様々なノードがあるので、手を動かしてみると良いかもしれません！

前半のまとめ

• PixelComposerはピクセルアート向けのノードベースで色々できるソフト
• 割と色々できる
• Generate→Transform・パラメータのアニメーション→Filter　でそれっぽいものが作れる

PixelComposerで作れる「ボーンアニメーション」紹介のコーナー

執筆担当代わりましてここからは飛ぶ人がお送りします！
私の担当分では、PixelComposer（以下、見出しとか以外ではルコンポと略します）の活用方法の一つとして「ボーンアニメーション」を作成する手法とかを解説します。
レイヤー分けされた1枚のイラストから

こんなのとか

こんなのが作れます！
画像の各レイヤーのパーツを回転させたり位置を変えたりするアニメーションを、パーツごとにボーンに対応させてそのボーンを動かすことでアニメーションが作れちゃいます！

しかも、上の二つのアニメーションに使用している特殊なノードは3つだけなので以外と使うハードルは低いかも！？

そんなルコンポでのボーンアニメーションの世界に、そろりそろりと参ります！

PixelComposerでの「ボーンアニメーション」

ボーンアニメーション（スケルタルアニメーション） とはざっくり言うと「骨格と関節となるボーンとジョイントを動かして作ったアニメーションに、表面の見た目を適用して動きを作るアニメーション」です！
　ルコンポでもそんなボーンアニメーションを行うためのノードシリーズである「Armature」シリーズがあります

たくさんある

ノードごとに役割は決まっており、「ボーンを作成する」「ボーンに動きをつける」「ボーンに画像を設定する」「ボーン情報を統合する」「ボーンに様々な情報を付加する」など様々なノードが存在します
全部紹介しているとブログがもう一本書けてしまうので、今回のこのコーナーでは

• Armature Create（ボーンを作成するノード）
• Armature Pose（ボーンに動きをつけるノード）
• Armature Bind（ボーン情報を統合するノード）

の3つのノードにフォーカスして最小限の構成でのボーンアニメーション作成について解説を行います

この3つのノードで作れちゃうんです

出力はボーンデータではなくあくまでスプライトシートやGifで、複雑なボーンアニメーションやメッシュ変形による3Dライクな表現は苦手ですが、かなり簡単に最低限のアニメーションを作成することができます！

ルコンポのここが強い！ここが弱い！

ボーンアニメーションとなると、Unityで直接作ったりSpineなど他のソフトによる制作したりする方が様々な利点があるように思えます。
実際、ゲーム内で動的にボーンを管理できたり、作ったアニメーション情報をjsonファイルでUnity等のゲームエンジンに直接インポートできたりと、UnityとかSpineの方が正直優秀な部分が多いです…

まぁあくまで「ルコンポでついでにこういうこともできるんだな」程度で考えると良いかもしれません

ルコンポのボーンアニメーションのここが強い！

• Asepriteファイルの連携に強い
  　ルコンポではAsepriteとの相性がめっちゃいいのが強いです！
  Asepriteファイルからレイヤー情報の一括分離する機能があるため、レイヤー分けが適切であればいちいちパーツごとに出力する必要がなくめっちゃ便利です！
  ↓
  
  layersのレイヤーに+が書いてあるボタンをワンクリックでできちゃいます、嬉しい～
  Asepriteで作ったデータをそのままアニメーション作成に持ち込めるのはめっちゃ嬉しいポイントです
  　レイヤー名がそのまま出力名になるためレイヤー名が適当だと面倒になることもありますが、なんとルコンポ側からも出力されるものの名前はいじれるので嬉しいですね
  　レイヤー分けしたpng画像を1枚1枚適用していくことも可能です、柔軟で嬉しいですね（【衝撃】やったことありますが、大変です【苦しさ】）

• ピクセルパーフェクトなアニメーションに強い
  　出力結果がUnityのPixelCameraのようにPixel単位での出力になるためドット絵の雰囲気を崩さずにアニメーションの作成ができます！
  
  アニメーションの1フレーム1フレームがピクセルパーフェクトで嬉しさ満天
  Unityなどでは実際の見た目を確認しながら作業をするのが地味に面倒なのでリアルタイムで描画結果を返してくれるのは結構ありがたいポイントですね

• 平面（xy座標）内での変形に強い
  　斜めの要素が入っていないトップダウンやサイドビューなど、アニメーションが平面のxy座標で完結するものに非常に強いです
  単純な組み合わせであればアニメーションで管理するパラメータが要素が少なく直感的なのでどの要素をいじればどういう動きになるかが想像しやすいです！
  
  　こんな感じで「これをいじると回転するんだな」などがわかりやすいです！
  　ルコンポでの立体アニメーションやメッシュ変形周りでの表現も工夫すればできますが、使用するノードや管理するパラメータが増えまくるので管理が大変になってしまう萎えぽよな面もあります

• Unityできなくても使える
  　これ実は結構嬉しいです
  　色んなメリットがあるから最終的にUnityを選ぶのがおすすめなんですけど、世の中にはどうしてもプログラムが絡むとアレルギーを発動する人間がいます、俺とか
  　そういうタイプの人がグラフィッカーである場合やプログラマ側がまだグラフィック方面の処理を作れない場合などでこのソフトは大いに活躍してくれます！

  • グラフィッカーだけで完結する
    ノーコードでGUI操作なので直感的にアニメーションを作れるのが偉いです
    ゲーム側があんまりできあがっていない段階でもじゃんじゃん作れるのでUnityから分離されているというのが短期開発であったりCodexなどにバリバリUnityプロジェクトを編集させる場合は嬉しい場面が多いです
  • 安い
    制作ソフトは「迷うな……全部買うか………」vs「全部買うと破産ですしねぇ……」問題に直面しがちです
    円安の今、Spineが学生目線では高い… ちょっとお高めの他のソフトもあるので、安く本実装の物が作れるのはありがたいです
  • アニメーション出力が再生やコンパイルを待たずにできる
    シェーダーっぽい表現やエフェクト周りに非常に強いのがルコンポなので、プレビューで一瞬で見た目の確認ができるのがマジでうれしいです
  • 他エフェクトと合わせた見た目をすぐ試せる
    単品でしか使わないようなシェーダー作成の手間を省けるのが短期開発だと開発リソースが限られているのでUnity以外でエフェクト合成などができるのはかなり偉い場面があります
    長期開発や準備段階でも実装イメージをプログラマと視覚的に共有できるのも偉いポイントですね
    
    「こういう感じの効果・計算を組み合わせてこうしたい！」が伝わりやすいです

ルコンポのボーンアニメーションのここが弱い！

• メッシュ変形やz軸方向の変形、画像切り替えに弱い
  　結構重めのデメリットです涙
  　できるっちゃできるんですけど、ノードの組み方やパラメータ調整などが結構大変になってしまいます
  　慣れたらいいんですけど慣れるまでは、ぽよじゃないですね

• サイズの大きな画像では計算処理が重く弱い
  　ルコンポはアニメーションを再生するとデフォルトでは全てのノードのアニメーションプレビューが再生されます
  　画像サイズが大きい状態で考え無しに全てのプレビューの再生を付けていると、ピクセルパーフェクトで計算してくれる都合上計算される量が跳ね上がり普通に重くなります
  　あくまで3桁前半くらいまでの画像サイズじゃないと重さのストレスで、ぽよじゃないですね

• Unityなどに直接ボーン情報がエクスポートできない
  　ゲーム開発だと一番重いデメリットですね
  　一応プロジェクトファイル全体をjsonファイルとしてエクスポートすること自体はできますが、どうやら直接は読み込めない？模様です（ルコンポがGameMaker製であることがUnityとの互換性に影響しているんですかね？詳しくないのでよく分からないです）
  　file→Exportからプロジェクトファイル全体のjsonファイル自体は作れるっぽいので、Unity側でなんやかんや変換したらもしかしたら読み込めるかも？まぁよく分からないので助けてマルグリート！

アニメーションの作り方

さて、使用するノードの紹介とやり方解説のコーナーです
このソフト、Ctrl+Zが不自然な戻り方をするうえにCtrl+Yを押しても元に戻らないです！まるで現実なので気をつけてください！ リアリティ溢れるソフトですね
あんまり日本語で解説してる記事がないのと独学なので、とんちんかんな方法でやってるかもですが許してください
まぁ我流ってかっこいいしな、漢我流もかっこいいしな

やり方はこんな感じ↓の流れです、一個一個解説していきます

やり方の手順

0. 動かしたいイラストを用意
1. ルコンポにイラストをインポート
2. ボーンの骨格作成
3. 各ノード接続
4. ボーンにイラストの各パーツを割り当て
5. 動きを作成
6. エクスポートして完成！

0.動かしたいイラストを用意

レイヤー分けを意識して描きましょう
ポイントとしては「関節」「骨格」を意識してレイヤー分けを行うと良いです
例えば人間の腕を動かしたい場合、「肩」「肘」「手首」が関節（ジョイント）に対応して「二の腕」「前腕」「手のひら」が骨格（ボーン）に対応します
その骨格（ボーン）を動かしたときに回転する関節（ジョイント）を一個のまとめたレイヤーにすると画像の適用がやりやすいです
例えば「肩+二の腕」「肘+前腕」「手首+手のひら」など

↑のイラストでは「足の根元の関節」と「足の上側」を一個のレイヤーにしてます

イラスト部分は気合で作ってください、熱血🔥

1.ルコンポにイラストをインポート

ルコンポにインポートするには、ノードを用いてイラストをインポートします

1-1.Aseperiteファイルをインポートする場合

操作するノード：ASE File In

1. 上のバーの「Graph→Add Node」もしくはShift+Aでノード追加ウィンドウを出す
2. 「ASE File In」を検索
3. インポートしたいAsepriteファイルを選ぶ
4. インポートしたらノードをクリックして画面右のインスペクター上で「layers」の欄の右端の「Generate layers」をクリック
   
   
   ↑の右端
   この時「Use Cell Dimension」は必ずFalseにすること！ これをしないと出力されたレイヤーがそのレイヤーの描画範囲にCropされるので、ボーンに適用するときに大変です、すごく
5. 全てのレイヤーが別々のノードとして出力される
   
6. 必要な場合はレイヤー名をパーツごとにわかりやすい名前にする

俺Boneのスペルずっと間違ってて面白いw

1-2.pngファイルをインポートする場合

Asepriteファイルを扱えるソフトを持っていないor宗教上の理由でpngしか扱えない人向けです

操作するノード：Image

1. 上のバーの「Graph→Add Node」もしくはShift+Aでノード追加ウィンドウを出す
2. 「Image」を検索
3. インポートしたいpngファイルを選ぶ
4. 気合のインポート作業、気合ンポート作業をする
5. 全てのレイヤーが別々のノードとして出力される
6. 必要な場合はレイヤー名をパーツごとにわかりやすい名前にする

pngでやる人向けの注意として、この後の作業の時に便利なので以下のことをやっておくといいです

• 全部のパーツを統合した1枚絵のpngもインポートしておく
• レイヤーが下の物からインポートしておき、画面上から下に向かってレイヤーが下の物→レイヤーが上の物の並びになるようにする

また、統合した1枚絵からCropしてパーツ分けするのは、ボーンへの適用の際に位置がめちゃめちゃになって不便なのでオススメしません （1敗）

2. ボーンの骨格作成

ボーンの作成です、初見だと分からない要素多めなので丁寧丁寧丁寧に描くと決めていたよ

2-1.ノードを出す

操作するノード：Armature Create

1. 上のバーの「Graph→Add Node」もしくはShift+Aでノード追加ウィンドウを出す
2. 「Armature Create」を検索

クリックして画面に出たらオッケーです

2-2.ボーンを作成する

操作するノード：Armature Create

1. プレビューに表示するため、AsepriteならASE File Inの、pngならレイヤー統合されたノードをダブルクリック
   これをやることでプレビューにレイヤー統合されたイラストを表示でき、ボーンを置く基準にできます（これをやらないと何もない画面にボーンを置くことになる）
2. Armature Createをクリック
   ダブルクリックするとプレビューが消えるので注意！
3. プレビュー画面を見て、Add Boneのうち「Add Control Bone」をクリックしてControl Boneを重心の位置に追加
   
   通常のBoneは骨格と関節なのですが、Control Boneはイメージで言うと「重心」の要素でControl Boneを親にもつ子ボーンはその重心の動きに合わせて制御できます（超重要）
   これの何が嬉しいかは実際のアニメーション制作でわかります！
   ジャンプだったり体が傾く動きだったり歩きのように微妙な重心の変化が起こるアニメーションでは、Control Boneを設定しないと自然な動きにするためにいちいち重心の移動に合わせてボーン一つ一つの位置を調整しないといけません
   しかし、Control BoneがあるとControl Boneの位置を重心の動きに合わせて上下させると、それに子ボーンが追従してくれます！
   親子関係にあるボーンは、デフォルトだと親のボーンが動くと子のボーンも追従して動きます！この動くか動かないかの追従関係は一応Armature Bindで変えられますが、親子関係自体の変更は後からできない（たぶん）ので注意！
   
   
   これのおかげで角度や位置の微調整だけでアニメーションが作れるようになります！
   このControl Boneから色んなボーンを生やすので中心（人物キャラクターなら腰くらい？）の位置に置いておくと良いです
4. Add BoneでControl Boneからドラックしてボーンを追加
   
   こんな感じControl Boneから生やしてください
   ボーンの位置や大きさは後からいじれます
5. Control Boneの開始点と関節の位置が一致していない場合、Detach Boneでボーンの開始点側の関節の位置をControl Boneから離す
   
   こいつをクリックして選んで
   
   離したいボーンの根元からドラックすると分離できます！
   これの何が嬉しいかというと、余計なボーンを追加せずに、最小限の数でボーンのジョイントの位置設定ができるので後々アニメーションさせるときに管理するボーンの数が減ります！
6. Move Selectionでボーンの終点側の関節の位置を調整
   
   これでジョイントの位置を調整します
7. Add Boneで追加のボーンをどんどん追加してDetach BoneやMove Selectionでジョイントの位置調整！
   
   
   これでボーンが配置できました！ジョイントの位置がイラストの関節or動かしたいものの終点の位置になるように調整するとアニメーションが作りやすいです（重要）
   また、ボーンのコピペ機能は無いのですが、Mirror Bonesでボーンを複製した後に複製したやつをもう一回複製するとミラーのミラーなので実質的なコピペができます（超裏技）
   
   
   ↑のミラーしたボーンを更にミラーしてもう片方の足のボーンを作っています
   上にはみ出た一回目のミラーは削除しましょう
8. Boneの名前の変更をしておく
   インスペクター上で変えられるので変えて起きましょう、後で地獄を見ますよ（暗黒微笑）
   

3. 各ノード接続

操作するノード：ASE File Inから出力したASE layer（もしくはImage）、Armature Create、Armature Pose、Armature Bind、Export

1. 上のバーの「Graph→Add Node」もしくはShift+Aでノード追加ウィンドウを出す
2. 「Armature Pose、Armature Bind、Export」を検索
   
   
   
   ExportはクリックするとExportのウィンドウがいきなり出ますがキャンセルをクリックするとノードが追加されます
3. 各ノードを以下の様に繋ぎ合わせる
   
   Armature Create→Armature Pose
   
   Armature Pose→Armature Bind
   
   ASE layer（もしくはImage）→Armature Bind
   レイヤーが下側の物から接続すること！ Armature Bindのインスペクター上でレイヤーが追加されて行っている部分がいわゆる「レイヤーの上下関係」を表しており、後に追加されたものは最終出力でレイヤーの上側に配置されてしまいます！
   
   後から変更することもできますが、「ボーンへの適用後にここをいじるとボーンの適用関係まで変わります！なんでやねん！」地獄を見ないようここでレイヤーの上下関係は整えておきましょう（1敗）
   
   Armature Bind→Export（ここだけ全部終わった後につなげてるので既に完成してますが気にしないでください）

4. ボーンにイラストの各パーツを割り当て

操作するノード：Armature Bind

1. Armature Bindのインスペクターをクリックして開く
   
2. インスペクターのレイヤー欄から、適用したいボーンにレイヤーをドラック＆ドロップ
   
   
   上記のように適用すると画像の位置がずれて表示されますが、これはボーンの中心位置に合わせて適用されるためです
   これは後で直せるので一旦全てのレイヤーを適用しましょう
   
3. ずれたレイヤーをプレビュー上で直す
   
   
   ドラックして直せます
   元のイラストと同じ縦横サイズであれば枠に合わせるだけでオッケーです
   ここで最初のASE File InでレイヤーごとにUse Cell DimensionをTrueにしていたりpngでレイヤーをCropで切り出すと位置調整が大変なんですね（1敗）
   
   一回位置調整したやつを再度選択しないように矢印マークをクリックするとそのレイヤーの位置調整がオフになるので、有効活用しながら全てのレイヤーを位置調整しましょう
   
   できたー！

ここまでができれば、同じボーンで別のアニメーションを作る際は接続したノードやプロジェクト自体をコピペして5.動きを作成からやればいけます！嬉しい～～～～

5. 動きを作成

ついに動きを作成します！結構泥臭い作業なので耐えましょう
また、ここからはArmature Bindをダブルクリックしてプレビューに表示させましょう

操作するノード：Armature Pose

1. 時間に合わせてアニメーションさせたいボーンの「Toggle Animation」をクリックしてオンにする
   
   オンでない場合、Armature Poseでは時間に関係ない変化として全てのフレームに適用されます
2. 画面下側のタイムラインのうち変化の最終地点にしたいフレームを選ぶ
   
   
   15フレームを選びました
3. そのフレームを選択した状態でインスペクター上の数値を変えるorArmature Poseのプレビュー上でボーン直接動かす
   
   上記の画像では「gun」ボーンが1フレームのx=0,y=0,rot=0,sx=1（大きさ）から15フレームのx=0,y=0,rot=30,sx=1（大きさ）まで変更されています
   これにより左下の再生ボタンを押すかスペースキーを押して再生すると2~14フレームではrotの値が0から30が滑らかに変わるように適用されます
   この時タイムラインに追加される四角のマークをキーフレームといいます
   ドラックで位置調整などができたり、キーフレームをダブルクリックしながら左右にドラックすると滑らかに変化する数値の度合いをタイムライン上で変更できたり、タイムライン左側のボーンの部分の波みたいなマークをクリックして変化の仕方を変えられたりします
   アニメーション再生する速度やフレームの長さを変更したい場合はタイムライン右下の歯車マークから変えられます
4. この作業を繰り返し、アニメーションを作成する
   
   後は気合です
   上記の画像は先に添付したこのアニメーションのキーフレームです
   
   あるボーンの動きを別のボーンにコピペしたいときは、1行（1種類のボーンのタイムライン上のキーフレーム）を選択して別のボーンのコピペしたいフレーム列、コピペしたいボーン行の部分をクリックしてCtrl+Vしてください
   しっかり選ばないと、コピー元のボーンにキーフレームが張り付けられてしまいます
   また、複数行を選択してコピペはできないので注意してください

6. エクスポートして完成！

Expotノードのインスペクターからファイルの保存先、ファイル名、アニメーションのファイルFormat（TypeからAnimationにしましょう）、ファイル形式、主力サイズなどの設定をします
その後インスペクター右上の「再生ボタンみたいな緑色の三角」を押してエクスポートです

初見でわかるか～w

いかがだったでしょうか。
どうしてもルコンポでボーンアニメーションを作りたいという情熱をお持ちの人はどんどん開拓していってください！（他人任せ）

おわりに

読んでくださりありがとうございました！かなりボリューミーな記事になってしまいましたが、ここまで読んでくれたあなたなら大丈夫。PixelComposerと共に日々を歩んでいきましょう。

Pixel Composer on Steam

A Node-based pixel art generator, editor, and VFX compositor. Create beautiful and complex effects in a non-destructive manner. Pixel Composer comes with a powerful graph system that supports multiple image manipulation, feedback effects, loop, physics, and fluid simulation.

STEAM

次のブログリレーの記事の担当者は@2251799813685248です。

この記事は夏のブログリレー34日目の記事です。

traPでは、年2回合宿を開催しています。今年も合宿先の山中湖から大学までの100kmを歩いて帰ってきたので、その様子をお伝えします。

前回開催時の記事はこちら：

traP夏合宿から歩いて帰りました

この記事はtraP夏のブログリレー30日目の記事です。 traPは年2回「合宿」というイベントを開催しています。今回の合宿は山中湖で開催され、ほとんどの部員は往復にバスを使用しました...が、我々はバスに乗らず、山梨県の山中湖の合宿先から東京都の大岡山キャンパスまでの100kmを歩いて帰りました。今回はその旅程を紹介します。 1日目 荷物を発送し、トイレを済ませて午前10:00に宿の玄関に集合。100kmの長い道のりがスタートします。途中までお見送りをしてくれた2人と別れて、10人でいざ出発。 山の中の道ですれ違うのは車ばかりなのですが、途中で歩行者の集団とすれ違いました。向こうの集団から「俺たちなんでこんなことやってるんだろう」という声が聞こえてきましたが、多分そういうことは考えないほうが良いと思います。 2020東京オリンピックの自転車競技にこの道が使用されたそうです。18%の坂ってすごくないですか？ 10km歩いたところでようやく人里が。自販機のありがたみを噛みしめました。 小山町内の飲食店で昼食を取った後、駿河小山で2人が離脱。 ここで3日目の夜までお世話にな

東京科学大学デジタル創作同好会traPramdos

概要

合宿先の山中湖から大学のある大岡山までの100kmを歩きました。

また、今年は✝Vibe Coding✝した専用アプリで進捗をリアルタイムで共有していました。

合宿中のLT会で登壇したときの資料があるので、興味のある方はご覧ください：

徒歩帰宅にVibe Codingを！.pptx

徒歩帰宅にVibe Codingを！ ramdos

Google Docs

1日目

1日目は山中湖から開成までを歩きました。

山中湖を6人で出発。1日中大雨に降られており、なかなか大変でした...

峠の上は霧が深かったです。

国道246号線に入り、神奈川県へ。

2年前には繋がっていなかった橋が繋がっていて感動しました。

2日目

開成から海老名までを2人で歩きました。

開成を東に向かい、秦野でお昼を食べます。

国道246号線をひたすら東に進みます。

晩ご飯はお肉を食べました。

そして厚木へ。

3日目

海老名から大岡山キャンパスまで歩きました。

すずかけ台横浜キャンパスを通過し、サークルの友人からの激励を受け東を目指します。

東名青葉ICを抜け、市が尾でおやつを食べました。

鷺沼で応援に来た先輩と合流。二子玉川まで同行してくださいました。

二子玉川を抜ければ、あとは大井町線沿いの住宅地を抜け感動のフィナーレです。

感想

足のマメが潰れたり、雨で体温が奪われたりと想像通り大変な行程でしたが、山を抜け246のロードサイドの移り変わりを眺め、東京の住宅地を通り抜ける行程を一歩ずつ歩くことは何事にも代えがたい経験になりました。

明日の担当はMimi_yearさんです。お楽しみに！（この記事は遅れて投稿されたので、すでに投稿されています）

この記事は夏のブログリレー35日目の記事です。

こんにちは！かっこいいエフェクト作りたいですよね。作ってみました。

今回は普段Unityで主に2Dゲームの制作をしている僕が初めて3Dのエフェクト(?)に手を出した話をします。

ちなみにこれはClaudeにお世話になりながら丸一日かけました。パラメータ調整がしんどかった。

目次

• blenderMCPありがとう
• リムライトありがとう
• VFXGraphありがとう
• Timelineありがとう
• Cinemachineありがとう
• Unityありがとう

blenderMCPありがとう

さて、3Dに手を出すと決めたんですが、なんと筆者は3DCGのソフトをまともに触れません。ｺﾏｯﾀ...

どうやら世界にはMCPというものがあるらしいです。自然言語ｶﾀｶﾀで勝手にソフト内のAPIを叩いて良い感じにしてくれるんだとか。
今回使いたい素材は↓コイツだったので(多分)そこまで労力はかからないと思いましたが、ここで時間食うのも嫌なのでガッツリ頼りました。

こんな感じで雑にお願いしたら一瞬でやってくれました。ありがとう。

自分が求めるクオリティぐらいなら秒でお出ししてくれてすごいですね。どうなってるんだ最近のAIは。
というわけでblenderMCPとAIありがとう。

リムライトありがとう

イメージしてたのはの形をしたエネルギー弾みたいな感じでした。
でもエネルギー感出すの難しい！ただ光らせるだけだと表面にLED付けただけっぽく見えるんですよね。

ふとスーパーゴーストカミカゼアタックのゴーストが参考になるんじゃないかと思って最近出たドラゴンボールのゲームの動画を漁ってみました。
見つけました。

ちょっと眺めて「これリムライトつけたらぽくなるんじゃね？」と思いました。なんでかはあんまわかってないです。
リムライトについてはこちら(もしかしたら↑はリムライトじゃないのかも。詳しい人がいたら教えてください。)

というわけでリムライトを実装し(てちょっと色味いじった)らこうなりました。

さっきよりなんとなくエネルギーっぽい気がします。
ドラゴンボールの気弾(特に元気玉とか)って端っこの方が白くて中心部にほんの少し寄ると色が濃くなると思うのでそういうイメージが反映されてるのかもしれないですね。
リムライトありがとう。

VFXGraphありがとう

UnityにはVFXGraphという大量のパーティクル等のVFXをノードベースで扱えるパッケージがあります。
雑にパーティクルを出していきましょう。こんなんなんぼあってもいいですからね。

パーティクルを置く事で画面の余白が少なくなってぱっと見良さそうですね。

あと雑に衝撃波も出してます。最初はテクスチャ一枚で賄うつもりでした。が、地味だったのでShaderGraphで良い感じのものを作りました。

VFXgraph(あとShaderGraph)ありがとう。

Timelineありがとう

UnityにはTimelineという機能があって、これを使う事で「一連の流れが決まっているもの」を楽に扱うことが出来ます。
Animatorという機能も似たようなこと(AnimationClipの再生)ができるんですが、これだとVFXGraphの発火のようなイベントの発火を扱うのが大変面倒です。
しかもTimelineにはVisualEffectControllTrackというVFXGraphを扱うための機能があります。最高か！

後述しますがCinemachineControlltrackという、Cinemachineカメラに対する機能もあるそう。嬉しいですね。(まぁそりゃ扱えるだろという気もしなくもないですが...)
Timelineありがとう。

Cinemachineありがとう

ここまでやりましたがまだちょっと地味です。

大体こういう時は画面揺らせば何とかなります。
UnityにはCinemachineという機能があります。超ざっくり言うとカメラに関するアレコレを良い感じにしてくれる機能です。Cinemachineを使って画面を揺らすことが出来るのでインパクト時に揺らしてみましょう。

さっきよりかなりドパくなったんじゃないでしょうか。
Cinemachineありがとう。

Unityありがとう

というわけで完成したのが冒頭の動画になります。
リッチな3Dエフェクトを目指すならUEとか触れると良いんでしょうが今回は初めて3Dに手を出したのもあって普段使い慣れてるUnityで作りました。
学びとしては

• 光ると嬉しい
• パーティクルいっぱい出てると嬉しい
• 画面揺れると嬉しい
• フレーム単位の調整がしんどい
• AnimationCurveの使い心地とAnimationClipのCurveの使い心地違いすぎないか？

などがありました。全体的にずっと嬉しかったです。Unityありがとう。

ありがとう

ここまで読んでくれてありがとうございました。
明日のブログリレー担当者は
@Mimi_year,@tobuhitodesuです！お楽しみに！

参考

• https://github.com/ahujasid/mcp-for-blender
• ドラゴンボール Sparking! ZERO
• スーパーゴーストカミカゼアタック ゴテンクス ブラスト技【ドラゴンボールスパーキングゼロ】
• 【UE5】キャラクターに立体感を–「リムライト」の追加方法【アニメ調表現:part5】