はじめに

京都のUI/UXデザイン事務所でデザイナーをしています。
この記事を含む一連の記事は、

softdeviceのみんなでゆるく記事を書く。 Advent Calendar 2019

の12/4～12/9分の記事として公開しています。

今回のシリーズ記事について

今回は以下のような構成で記事を書いていきます。

全体として、

「C#のライブラリプロジェクトをGitLabにpushしたら自動でDLLが書き出されてついでにDocFXで作成されたドキュメントがCloud Run上にデプロイされる」っていうやつをやる

ために必要な要素なのですが、それぞれの記事単体でも読めるように書いているつもりです。
(最後の三つだけは直接的な関連性がありますが)

タイトルにするとかなりややこしい話に感じますが、CI/CDという言葉を知っている人なら、結構すぐにやりたくなるような事なんじゃないかなと思っています。
僕もCI/CDという言葉や、こういった事が出来る事は知っていたのですが、中々難しそうで手が出せていませんでした。

今回不便が重なったので思い切って取り組んでみたのですが、その背景や経緯を書いておこうと思います。

デザイン事務所とプロトタイピング

デザイナーというと絵を描いているイメージが強いかと思いますが、そもそもデザイン(design)は設計という意味なので、原理主義的に言うとデザイナーは「設計する人」になります。「絵を描く」というのは、デザインしたものの表現手段の一つ、という事ですね。

UI/UXのデザインでは、単体画面の構成や綺麗さだけでなく、画面遷移やその整合性等を統合的に考えてデザインしていく必要があります。そういったものを検討する上では、想像上で検討するよりも実際に動くものを作った方が圧倒的に提案の説得力が上がります。

絵を描いて表現するのと同じように、プロトタイピングを作って検討したり、そのプロトタイプを用いてプレゼンテーションしたりする事もデザインしたものを表現する手段の一つになるのです。

プロトタイピングとプログラミング

プロトタイプを作って確認する、あるいはプレゼンテーションするというプロセスを、古くは Hypercard の時代からやってきているのですが、ツール自体は Adobe Director、 Adobe Flash(現Animate) と変遷してきて、最近では Unity を使う事が多くなってきています。最近は HTML + CSS + Javascript も強いので、Vue や electron を使う事もあります。

ちなみに僕がちゃんと使った事があるのは Flash からです。年齢が分かりますね。

こういったツールを使用してプロトタイピングをする事になるのですが、インタラクティブなものを作る時は必ずと言っていいほどプログラミングをする事になります。

プログラミングとライブラリ化

プログラミングをしているとしばしば

この機能、前も作ったじゃん！

となり、

これ使いまわせるようにしたいな…

ときて、

どうせ使いまわすならスマートにやりたい

となるわけです。

Flash で AS3 を使用していた時代でも、compcを使用して swc を書き出し、asdoc を使用してドキュメントを書き出していました。Unity の場合は C# のライブラリを作る事になるので、Visual Studio を使ってDLLを作成しています。

ライブラリ化と.NET Framework & Macの壁

しかし…

Unity の C# は .NET Core ではなく .NET Framework 系なので、ビルド(DLL化)する時に Windows 環境が必要になります。そしてデザイン事務所あるあるなのですが、基本的にみんな Mac を使ているので、ほとんどのスタッフの端末でビルドが出来ません…

しかし Mac で Unity を使っているユーザーも当然いて、そういったユーザーからライブラリを作成したい、あるいは既存のライブラリに追加したいという要望も出てきます。

.NET Framework & Macの壁をCI/CDパイプラインで解決する

CI/CDパイプラインを使ったビルドを使うと、こういった状況を一気に解決できます。
導入前はライブラリに更新があるたびに Windows を使っているスタッフ(僕とか僕とか僕)がビルドを実行して結果を共有していましたが、ソースを書いてGitLabにpushさえすればいつでもだれでもビルドを実行する事ができ、しかも変更が即座に反映されます。

また、DLLライブラリはドキュメントを共有するのが意外と大変で、せっかく作った機能も使い方が伝わっておらず、中々使ってもらえなかったりしたのですが、今回はドキュメントの書き出しとデプロイも自動で行うようにしたので、その点も一気に解消しました。

おわりに

今回も、僕が実際に構築する上でつまずいたポイント等をまとめています。
同じところでつまずいていている方や、やってみたかったけど躊躇していた方の一助になれば幸いです。