この記事を書いた人
machida

12/4(日)東京・恵比寿でデザイナーとエンジニアがペアを組んで動くものを作るハッカソンを「デザイナー向けプログラミング部」皆さんと開催することになりました。

※締切りになりました。どうしても参加したいっていうデザイナは@machidaまでTwitterでメッセージをお願いします。

開催の経緯

以前、mitaka.rbという三鷹近辺のRubyist(Rubyを使うエンジニア)が集まるイベントにデザイナーであるにも関わらず参加させていただいて、厚かましくもLTまでやらせていただいたのですが、そのLTの最後に、

デザインテロをやろうにもGithubが広大過ぎてどれにデザインを入れればいいか迷う、というのと、結構GUIが必要ないものが多い、という問題があったので、今度はエンジニアと0からOSSプロジェクトを立ち上げる一日ハッカソンをします。

という宣言をしました。で、実際「Good Days List」と「Masher」というプロジェクトを一日ハッカソンで作ったのですが、これが予想以上に楽しかったです。どういうところが楽しかったかを挙げてみると、

  • 一人じゃなくチームで頑張るのが楽しい(学園祭の準備みたいな感じ)
  • その場の思いつきがすぐ形になるのが楽しい
  • どんどん目の前でサービスが出来ていくのが楽しい
  • メンバーそれぞれが持ってる強みが完成物に反映されるのが楽しい(即興で作るから調べたりする時間がなくて、自分の得意どころを使う)
  • 逆に普段やらないことにチャレンジするのにもいい機会

…などなど。

これだけでも十分楽しいんですが、複数のチームが同時にそれぞれのものを作ってて、最後に成果物の発表までしたらもっと面白くなるんじゃないか、っていうのもあって、今回の「デザイナーとエンジニアがペアを組んで動くものを作るハッカソン」のイベントを前からやりたいなー、と思ってました。

ハッカソンにGitは便利

「Good Days List」も「Masher」も一緒に作ったメンバー全員がGit、Githubを使えたっていうのが、ハッカソンの成功に大きく貢献しました。「Masher」を一緒に作った@satococoaさんにこういうイベントをやりたいんですが…と相談したところ、やっぱりハッカソンにGitは必須だよね、ってことになって、まずはGitが使えるデザイナーを増やすために@satococoaさん講師で「デザイナーのためのGit勉強会」をやっていただきました。この前の前の記事でも書きましたが、20人を超えるデザイナーがGithubにpull requestを送ったという快挙を成し遂げました。

「よし、Gitが使えるデザイナーは揃った、遂にハッカソンだ!」ということで、勉強会に参加いただいたデザイナーの方々にDMを送らせていただいたのですが、うーむ…反響はイマイチ。年末のせいかなぁ。予想よりこじんまりしたイベントになってしまいますが、いよいよハッカソンのイベントが開催されることになりました。僕は超楽しみにしてます。

ハッカソンの流れ

今回は第一回、僕も初めてなのでどう進めたらいいのかがやってみないとわからないのですが、こんな感じで進めたらどうですかね〜みたいなものを書いておきます。

ペア発表

今回は「デザイナー × 1人」、「エンジニア × 1人」のペアを作ってハッカソンで何か動くものを作る、というイベントです。何を作るのか、どんな風に作業が進むのか…などはハッカソンのペア次第。ペアの発表、ドキドキですね。ペアの発表は11/27(日)(←予定)に発表されます。参加者にはTwitterでお知らせします。

事前の打ち合わせ

12/4(日)の当日に「せーの」で作るのでも全然大丈夫なのですが、一応ちょっとペアのエンジニアと軽くTwitterやLingrやSkypeなどを使って軽く打ち合わせをしておくとよさそうです。もし、実際に会って話したいけど場所がないっていうペアがいましたらフィヨルドオフィスが使えますので言ってくださいね。

何を作る?

では、具体的にどんな打ち合わせをしておくといいか、ってことも書いておきます。

やっぱり、まずは「何を作るか」を決めてしまいたいですね。今回は一日で動くものを作るハッカソンなので、機能が少ないシンプルでちょっとしたツールを作るのがおすすめです。

いきなり「これを作ろう!」って考えるよりも「どんな問題を解決するか」を決めてペアのエンジニアと共有して、「それに役立つツールとは?」を一緒に考えたほうがうまくいきそうです(なんてこんなことは今回参加されるデザイナーさんたちは仕事でしょっちゅう考えてることなので余計なお世話だと思いますが…)。

余計なお世話ついでに、最近した失敗(レンタル漫画屋で読んだことあるやつをまた借りてしまった、せっかくコンビニに行ったのに牛乳を買い忘れた、洗濯機を回してて柔軟剤を入れるタイミングを逃してしまった…など)や、最近イラッとしたこと(送られたテキストデータに全角スペースや半角カタカナが混じってる、あとで見ようと思ったURLをTwitterでFavしたか、はてぶしたか忘れて見つからない、気になる情報を配信してるサイトなんだけどFeedがなくて情報を逃す、せっかくいいサービスが思いついたと思ったらすでにあった…など)なんかを挙げていくといいアイディアが思いつくかもしれません。

今回は一日で動くものを作るっていう企画ですが、全然フライングして作業を開始するのはOKです。ペンタブを使いたいけど持っていくの面倒だから先に絵を描いておくか、とか、そういうの全然OKです。

「作るもの」が事前の打ち合わせで決まったらcacooや手書きのスケッチで画面の図を用意しておくと今後の作業がスムーズです。ここまで事前の段階で共有できてたら当日はサクサクですね。まぁ、当日思い付いたアイディアがリアルタイムで実装される楽しさもハッカソンの醍醐味だと僕は思うので、そこまでガチガチに決めておかずに、当日のトラブルやファインプレーも楽しもうという心の余裕を持って臨むのがおすすめです。

そうそう、作るものが事前に決まったら、デザイナー向けプログラム部 相談室に書いておいていただけると当日作るものが他のチームとかぶらなくなりますので助かります。

Gitのおさらいや環境の準備

今回はエンジニアとペアなので、当日ばたばたしないように思いっきりエンジニアに甘えてGitで忘れたことを聞いたり、環境の用意の仕方を聞いたりしておくといいかもしれないです。黒い画面に文字を打つだけで事は済んでしまうので、TwitterやLingrやSkypeなどで大丈夫。まぁ、忙しかったら当日にエンジニアがどうにかしてくれるはず。僕もこのブログにGitの使い方なんかをまとめておこうと思います。

当日

当日は09:30開場、10:00スタートです。今回の会場のベンチャーカフェ in 株式会社サンブリッジ様 はJR恵比寿駅から徒歩0分。すごい便利な場所にあります。飲み物やお菓子、お昼ごはんの時間も作業をしたいって方はご飯も用意しておくといいかもです。あと、作業で使うパソコンは忘れずに。もし持っていたら延長ケーブルも用意しておいてください。

作業

今回はRubyのエンジニアばっかりなので、エンジニア側はRailsやSinatraなどのフレームワークで大枠をつくるところから始めると思います。その間デザイナー側は、デザインの絵を描いて、HTMLとCSSの用意を進めておくのがいいです。大枠が出来たらエンジニアはそれをGithubにアップするので、それをデザイナーはcloneしてローカルで立ち上げます。で、先ほど用意していたHTMLやCSSをはめ込んでいく作業に入ります。ここから先はエンジニアもデザイナーも「pushしましたー」、「あーざっすー」の繰り返し。

発表会

18:00で作業は終了になります。そのまま同じ場所で発表会を兼ねた懇親会を行います。ピザを食べ、ビールを飲みながら各チーム、みんなの前で今日の成果物を発表します。

メディアに報告

作った後はメディアに取り上げてください、メールも送るといいかもです。取り上げられたときに達成感が倍増します。そうそう、メディアに報告をする際、今回作ったプロジェクトをオープンソースする場合は、ライセンスをREADMEにちゃんと書いておきましょう。ライセンスの一覧はこちら

まだ、参加できます(締切りになりました)

デザイナーの参加者一覧

今回がうまく行ったら毎年恒例のイベントにしたいなぁ。

一緒にGood Days Listを作った吉田さんを発見!

今、会場を貸してくださるベンチャーカフェ様のサイトを見てたら、ここで僕と一緒にGood Days Listを作ったRailsエンジニアの吉田さんを発見!Ruby on Rails でミニブログをつくってみよう!(全2回)という講座を行うみたいです。ついでに、12/8(木)に受託開発の未来 〜10年後も活躍できるエンジニアになるには〜というイベントも開催されるそうです。

最新の実績

  • Remember The Wordpress
  • happy1000days
  • happy1000days
  • happy1000days

こちらも合わせてどうぞ

  • webデザイナーの為の「本当は怖くない」“黒い画面”入門

アフィリエイト