貴方のパソコンに木口さんをインストールするプログラムはどのようにして作られたか

              <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/gist-embed/1.6/gist-embed.min.js"></script>

ふと思うことがあったので、こんなものを作りました。

<blockquote class="twitter-tweet" lang="ja"><p>あなたのパソコンに木口さんをインストールするプログラムのソースコードのスクリーンショットです。実際のソースコードは<a href="https://t.co/FIhbvCAtsu">https://t.co/FIhbvCAtsu</a>で見れます <a href="https://twitter.com/search?q=%23%E4%B8%96%E7%95%8C%E6%9C%A8%E5%8F%A3%E5%8C%96%E8%A8%88%E7%94%BB&amp;src=hash">#世界木口化計画</a> <a href="http://t.co/SVDAY64Wjl">pic.twitter.com/SVDAY64Wjl</a></p>&mdash; さっき作った (@make_now_just) <a href="https://twitter.com/make_now_just/statuses/422351830056566784">2014, 1月 12</a></blockquote>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

今日はあまり艦これの進捗が無かったので、このプログラムをどのようにして作ったのか解説したいと思います。

##その1、どんなプログラムにするか考える

とりあえずどんなプログラム風に動くプログラムにするのか考えます。世間では設計、というのかもしれませんがそんなに大層なものではありません。

今回の場合、こんなプログラムにしよう、と考えました。

1. 木口アイコンの素体の画像を自動生成する。
2. 「Kiguchi.....&lt;&lt;INSTALL&gt;&gt;」と表示する。

で、ソースコードの形を木口アイコン形にしたら面白いんじゃないかなー、とか考えたわけです。

##その2、とりあえず普通にプログラムを書く

最初は木口アイコン形にすることなんて考えずに、プログラムを書きます。

というわけで、書いたものがこちらになります。

<div data-gist-id="9562793" data-gist-file="kiguchi_base.rb"></div>

無駄に長いですが、大部分は画像のデータなので読み解くのはそんなに難しくないと思います。

Base64というのは、簡単に説明すればバイナリファイルをテキスト表現にするエンコードです。詳しくは [Base64 - Wikipedia](http://ja.wikipedia.org/wiki/Base64) でも参照してください。

あとはまあ、コメントを見れば分かると思います、多分。

##その3、ソースコードを木口アイコン形に改造する

さて、ついに最終段階です。といってもここからが長いんですが…。

##その3の1、`%w`記法

みなさんはRubyの`%w`記法を知っていますか?
文字列の配列を書くときに使える特別な記法で、`%w(abc def ghi)`のように書くと、`["abc", "def", "ghi"]`のように解釈される、というものです。

これと`eval`、そして`Array#join`を組み合わせることで、ソースコードを任意の形に変換することができます。

具体的には、`p "hello"`というソースコードがあったとします。
これは、

<div data-gist-id="9562793" data-gist-file="sample_pw1.rb"></div>

と書くのと同じで、さらには、

<div data-gist-id="9562793" data-gist-file="sample_pw2.rb"></div>

や、

<div data-gist-id="9562793" data-gist-file="sample_pw3.rb"></div>

と書くことも出来るわけです。

これを利用して、さっきのソースコードを木口アイコン形にしていきます。

##その3の2、木口アイコンをAA化する

と、ソースコードを木口アイコン化するにあたって、テキストで表現された(=AAになった)木口アイコンが欲しいところですね。
というわけで、素体をベースに5分くらいでこんな画像を自作して、

![ソースコードの元にした画像](https://googledrive.com/host/0B2alsAomgB5jR2NrTjE3R2JuR1k/base-kiguchi.png)

[PICASCII](http://picascii.com/)というサイトを利用して画像をAAに変換しました。

変換したものが [こちら](https://gist.github.com/alucky0707/8386607#file-base_aa1-txt) になります。(デカいのでリンクにしました)

見ていただければ分かるんですが、ちょっと細長い印象があります。なので、ささっとこんなスクリプトを書いて、3倍サイズに変換しました。

<div data-gist-id="9562793" data-gist-file="base_aa_trans.rb"></div>

すると [こんな風](https://gist.github.com/alucky0707/8386607#file-base_aa2-txt) になりました。いい感じです。

ここまでくればあとは簡単ですね。

##その3の3、ソースコードを圧縮する

ソースコードを圧縮します。
なぜそんなことをするのかというと、`%w`記法と`Array#join`を組み合わせて作った文字列に空白や改行を含めることは面倒なため、除いておいた方が楽だったり、空白が無くなることでプログラムが動かなくなることを防ぐためです。

<div data-gist-id="9562793" data-gist-file="kiguchi_base_min.rb"></div>

上のものは、元のソースコードで変数を使っている部分をまとめたり、`A`が大量に並んでいる部分を圧縮したりしています。

##その3の4、AAとソースコードを一体化させる

セクションの通りです。

さっき作った3倍サイズのAAの、空白文字以外のところに`eval$x=%w[...].join`で囲ったソースコードを当てはめていきます。
こんなスクリプトで。

<div data-gist-id="9562793" data-gist-file="gen_kiguchi.rb"></div>

と、これでおk……? あれ?

```
> ruby gen_kiguchi.rb > kiguchi_auto.rb
> ruby kiguchi_auto.rb
test/kiguchi_auto.rb:1: unterminated string meets end of file
```

_人人人人人人人人_
> 突然のエラー <
 ̄Y^Y^Y^Y^Y^Y^Y ̄

何が起きているのでしょうか?

自動生成されたプログラムの冒頭を見てみます。

<div data-gist-id="9562793" data-gist-file="kiguchi_auto.rb" data-gist-line="1-2"></div>

見事に`%w`と`[`が切り離されてますね……。どうりで動かないわけだ。

というわけでそこら辺を修正したり、あとは最後の方がAAになっていないのをそれっぽくしたりして……

完成です!!

<div data-gist-id="9562793" data-gist-file="kiguchi.rb"></div>

当然ですが、このプログラムは実行できます。

```
> ruby kiguchi.rb
Kiguchi.......<<INSTALLED>>
```

##まとめ

* ソースコード中にバイナリファイルを埋め込むときはBase64でエンコードする。
* `eval %w(...).join`でソースコードを任意の形に変形できる。
* ↑ただし空白文字は鬼門。

意外と簡単にこういうプログラムを作ることはできるので、みなさんも是非挑戦してみてはいかがでしょうか?

##結びに

素敵なアイコンを作り始めた木口氏([@Kiguchi1902](https://twitter.com/Kiguchi1902))に最大限の感謝を込めて。

##参考資料

* [木口アイコン (きぐちあいこん)とは【ピクシブ百科事典】](http://dic.pixiv.net/a/%E6%9C%A8%E5%8F%A3%E3%82%A2%E3%82%A4%E3%82%B3%E3%83%B3)
* [Ruby を用いた超絶技巧プログラミング(夏のプログラミングシンポジウム 2012)](http://www.slideshare.net/mametter/ruby-2012)
* [RubyでうどんげQuine(とAA型Quineの作り方講座) - ぬいぐるみライフ(仮)](http://d.hatena.ne.jp/mickey24/20100915/ruby_udonge_quine)

          
最終更新日:
@make_now_just