「ご結婚おめでとう」親友に贈ったコードとデザインの話

2013/10/28(月) 14:30

登録タグはありません

今回はまみぺこさんのブログ『はぁはぁブログ』からご寄稿いただきました。

※すべての画像が表示されない場合は、http://getnews.jp/archives/442747をごらんください。

■「ご結婚おめでとう」親友に贈ったコードとデザインの話
新郎新婦には内緒で、「ご結婚おめでとう」の「声」を集めたい。
みんなからのナマの「声」をどうにかして録音することはできないか。
それらを、記念の刻印入りの iPod shuffle にいれてプレゼントできないか。
―――そんな秘密の企画がひっそりとはじまりました。

Twilio（トゥイリオ）というクラウド電話APIサービスでやってみよう！
という計画を思いついたのは幹事チーム・プログラマの3人でした。

「Yoji Shidara @darashi」『twitter』

https://twitter.com/darashi

「大和田純公式アカウント @june29」『twitter』

https://twitter.com/june29

「hmsk @hmsk」『twitter』

https://twitter.com/hmsk

●Twilio（トゥイリオ）って何？
Twilio（トゥイリオ）というのは、クラウド電話APIサービスのことで、プログラミングで電話システムを作れるのだそう。
電話というツールで、何かシステムを作る。なんだかよくわからないけれど、わくわくする遊びがはじまったんだ、ということだけは私にもわかりました。

そんなある日、@hmskさんからRubyでかかれたコードが幹事チームのGitHubグループで共有されTwilioを使ってこんな感じで動く電話システムができあがってきました。

1 番号に電話をかける

2 ウェルカムメッセージが再生される

3 話して「 # 」で終了する

4 サンクスメッセージが再生される

5 電話が切れる

テストユーザーとして電話をかけてみると、Twilioの管理画面に、音声データが新着1件登録されていて、ブラウザでそれを再生すると、いままさに電話で話した自分の声がそこにあったのです。

●Twilio（トゥイリオ）すごい
すごい。これはすごい。
みんなから、この電話番号に電話をかけてもらうことができれば録音した「声」をどんどん集めることができる。
@darashiさんが「祝電2.0だね」と言っていたそうだけれど、ほんとうにそうですね。

私は、Twilioの管理画面のしくみを、しばらくぼんやりと見つめながらプログラマさんが、友達を幸せにするためのコードをかいた、というその爽やかな感動に包まれていました。

電話で再生される声をあててほしいとのことだったので私 @mamipekoが声を担当することになりました。

「まみぺこ @mamipeko」『twitter』

https://twitter.com/mamipeko

「録音した音声を再生できたほうがいい」「やり直しができるといい」など、チームメンバーでリテイクを出しあって、できあがったのがこちらです。

お電話ありがとうございます。
この電話番号にてkeiさん、yucaさんへのお祝いメッセージを承ります。

頂戴したメッセージは、10月19日の結婚式二次会にて、新郎新婦にプレゼントいたします。それまでは、お二人には内緒にしておいてください。

それでは、keiさんyucaさんにお届けするお祝いのメッセージを発信音のあとにつづいて、60秒以内でお話しください。
完了したら「 # 」を押してください。準備はよろしいですか？

最初にお名前をお願いいたします。それではどうぞ！

いただいたメッセージを再生します。

このメッセージをお届けしてよろしければ、数字の「 1 」を
もう一度録音する場合は、数字の「 3 」を押してください。

メッセージを承りました。
あなたのまわりの方にもこの番号をお知らせください。

たくさんのお祝いメッセージが集まるよう、ご協力をお願いします。

お電話ありがとうございました。

●もしもバレてしまったときは
もしも、万が一、なにかのミスで新郎新婦に番号がバレてしまった場合に備えて、新郎新婦それぞれの電話番号から電話がかかってきたときだけ、こちらのメッセージが再生されて、電話が切れるしくみになっていました。

keiさん、yucaちゃん　ご結婚おめでとうございます。
wedding-sでお会いできることを楽しみにしております。

お電話ありがとうございました～。おめでとう～。

●みんなに伝える
あとはこの電話番号をみんなに伝えるだけ。
デザイン担当の私は、お知らせの紙をデザイン・印刷していって結婚式の受付を任せてもらう際、内緒でこっそりご親族やご友人へ配っていました。
（「声」のプレゼントは、結婚式の翌週のパーティで贈るものでした）

「ご結婚おめでとう」親友に贈ったコードとデザインの話

(画像が見られない方は下記URLからご覧ください）

http://px1img.getnews.jp/img/archives/2013/10/212.jpg

ご両家のお父さん・お母さんから、学校の友達、大学の先生、TwitterやFacebookのインターネットの人たちまで伝わって、みんなからのおめでとうの「声」がどんどんどんどん届いてきました。

私は、届きつづける新着の録音データを確認しながら、ほとんど放心状態でした。

コードをかいたりデザインをしたり、そうやってみんなで作ってきたひとつの箱にリアルなデータがどんどん入れられていく。

制作したコンテンツに、命が宿った瞬間でした。

コードが、デザインが、生きたものになりました。

電話をかけてくれたみなさん、どうもありがとうございました。

●刻印入り iPod shuffle
そして最後は、お二人のご結婚パーティのイベント名の「happy #wedding-s」という刻印をうった iPod shuffleを注文。

「ご結婚おめでとう」親友に贈ったコードとデザインの話

(画像が見られない方は下記URLからご覧ください）

http://px1img.getnews.jp/img/archives/2013/10/38.jpg

ここに、みんなから録音してもらった音声データをいれてプレゼントとしてお贈りしました。

●ウェディング時計アプリ
みんなからの「声」のプレゼントとは別に、もうひとつ。
Webブラウザで見れる「ウェディング時計アプリ」も作りました。
新郎新婦お二人の思い出の写真が1分ごとにシャッフルする時計のアプリケーションです。

コードは@june29がRuby、JavaScript、HTML、CSSでかいたもの。

そこに私がデザインしたウェディングロゴを添えてiPhoneやiPadなど複数デバイスで表示できるWeb時計ができました。

「ご結婚おめでとう」親友に贈ったコードとデザインの話

(画像が見られない方は下記URLからご覧ください）

http://px1img.getnews.jp/img/archives/2013/10/42.jpg

●グリッチ時計
さらに@makimotoさんの悪ノリ（というか、大変よい仕事）によってウェディング時計の写真をグリッチさせた時計、というコンテンツまでできてしまい、グリッチされた新郎新婦が大喜びしていた、なんていうことも、あったとかなかったとか。

*5:「Shimpei Makimoto @makimoto」『twitter』
https://twitter.com/makimoto

「ご結婚おめでとう」親友に贈ったコードとデザインの話

(画像が見られない方は下記URLからご覧ください）

http://px1img.getnews.jp/img/archives/2013/10/5.jpg

●URLを贈る
「URLを贈りたいよね」ということで、時計のURLを記載したカードもつくって、パーティの当日にお二人へ。

「ご結婚おめでとう」親友に贈ったコードとデザインの話

(画像が見られない方は下記URLからご覧ください）

http://px1img.getnews.jp/img/archives/2013/10/6.jpg

●パーティの「なふだ」
新郎新婦のお二人からの希望で「パーティに来てくれた人たちが交流しやすくしてもらえるとうれしい」という話があったので「なふだ」もデザインしました。

「ご結婚おめでとう」親友に贈ったコードとデザインの話

(画像が見られない方は下記URLからご覧ください）

http://px1img.getnews.jp/img/archives/2013/10/7.jpg

参加する全員の分をそろえて用意していきました。

少しでも交流のきっかけになっていたらいいな。

●どんな勉強会よりもギークな結婚パーティ
結婚パーティは、LTのある結婚パーティということで、ウェディングドレス姿の花嫁がLTをしたり、新郎のLTでライブプログラミングがはじまったり、「ドラ娘」ならぬ、ウェディングドレスでの「ドラ新婦」がいたり、どんな勉強会よりもギークな結婚パーティだったと思います。

グリッチの話やTwitterのベストツイートの話であんなにみんながもりあがって、結婚パーティなのにインターネット感丸出しでしたよね。

●まとめ
とこんな感じで、親友のご結婚祝いをしました。
いつもの仕事では、クライアントのためだったり、ユーザーさんのためだったり、たくさんの人にむけてコードをかいたり、デザインをしているけれど、私たちの1クリック以内にいる親しい人のためにコードをかくこと、デザインをすること。

作ることへの原点回帰の「だれのために作っているのか」「だれを幸せにしたいから作るのか」を改めて考えるきっかけになりました。

●幹事チーム
幹事チームのみなさん。
いっしょにプロジェクトをお手伝いさせてくれて、私も仲間にいれてくれて、どうもありがとう。

「Yoji Shidara @darashi」『twitter』

「大和田純公式アカウント @june29」『twitter』

「hmsk @hmsk」『twitter』

「tomoko @tomoko_and」『twitter』

https://twitter.com/tomoko_and

「まみぺこ @mamipeko」『twitter』

「sugamasao @sugamasao」『twitter』

https://twitter.com/sugamasao