11月六本木一丁目で行われました「Facebook AR Studio ワークショップ＆ハッカソン」に参加してきました。わたしはもともとWebデザイナーだったのでハッカソンではデザイナーの役割として参加することが主です。この記事ではエンジニアがメインのイベントで、どんな役割として活動できるのかを紹介しています。ハッカソンに出たいと思っているデザイナーさんはぜひ参考にしてください。

ハッカソンとはエンジニアの開発イベントです

ハッカソンとは、エンジニアが中心となりAPIやサービスを改良するハック（hack）と持久戦であるマラソンをかけ合わせた造語を意味するITイベントの一つです。
イベントの内容は、与えられたテーマをもとにハードやソフトウェア様々なツールを利用して限られた時間内で成果物を作り、発表をします。成果物の出来栄えも審査基準となるためデザイナーやプランナーが一緒に協力することで出来栄えの精度を高めます。

昔は泊りがけでひたすら作業する大変なイベントとして知られていましたが、最近は一日完結であったり運営者側のタイムマネジメントにより、だいぶ参加のしやすいイベントになってるのではないのでしょうか。

会場はFacebook東京本社

会場はFacebook本社で場所は六本木一丁目。
土地勘がないため遠回りをしてしまいギリギリ到着。
このエリアは坂が多いため余裕を持って行動するようにしましょう。

開幕。まずはFacebook AR Studioや提供企業のツールの紹介がはじまります

10時になり、ハッカソンイベントが開始です。
はじめに、運営側の自己紹介としてハッカソン運営団体の方とFacebookの社員の方、共産企業の方々が参加者に向けて挨拶をします。

Facebook AR Studio とは

ARとは、拡張現実のことで実際の風景をスマホをはじめとしたデバイスを通し
バーチャルを重ねて視覚情報を広げることができる機能です。
Facebook ARはそんな拡張現実をFacebookのカメラを通すことで機能し、
カメラに映された目やまぶたから顔として感知しさまざまな装飾を加えることができます。

Facebook AR Studioハッカソンは、その機能を用いて
新たなAR機能の可能性を作り上げることが目的となります。
開発に使用するものはFacebook AR Studioだけでなく
参加されている提携企業のサービスと絡めたものを作ることで
成果物の評価があがりやすくなります。

海外のサービスだけあって運営者側は外人です。
説明も英語で、英語がわからない私には不安でしたが日本人スタッフが通訳してくれるので安心して聞くことができました。

最初は個人ワークのアイディアソン。ここでは、自分のアイディアを整理します

説明が終わったらチームを作る前に個々のアイディアを形にします。
付箋が配られ、ハッカソンのテーマとは関係なく日常のものとかけ合わせたサービスはなんでしょう？というお題をあたえられます。こうすることで参加者全員のアイスブレイクと思考の柔軟をしていきます。つぎに、今度はハッカソンのテーマで自分のアイディアをどんどん昇華させます。

案を出し切ったらお披露目です。
他の参加者がテーブルを見て回り、いいと思ったアイディアに票をつけていきます。
その中から投票数の多かったものが選出され、それに賛同する形でチームが作られます。

ここで、デザイナーとしてなにができるのかしっかり見極める必要があります。
インターフェースが重要な成果物であれば良いのですが、
例えばガジェットを使ったIOT開発や数値解析がメインのものでは
デザイナーとしての力量を出せぬまま成果物ができて終わってしまうかもしれません。
自分がこのサービスでこうした部分で活躍できるというイメージを持って
チーム参加するようにしましょう。

ハックスタート。エンジニアさんの話はチンプンカンプンです。

チームができ、わたしたちは携帯の自撮り機能を使った
遠くの友人・恋人をカメラに自動で入れることができるサービスの開発をすることになりました。
メンバー構成はエンジニアさん3名とデザイナーの私です。

最初はみんな初対面のため、各々のスキルを話ながらどんな技術で作品を作るのかを話します。
成果物ができないとそもそも発表もできず審査されないので
そのようなことにならないよう効率のよい方法を話し合うのですが、
わたしはフロントエンドしか知識がないため当然会話に入ることができません。

ただ聞くだけの状態が続き頭が真っ白になりますが、
実はここでエンジニアさんの話をしっかり聞くことはすごく重要です。
理由としては

最初に出した案からガラリと変わる可能性があるため

作る時間が限られているためエンジニア間でお互いの力量の限界を知ることとなったら案が180度変更する場合があります。
ひょっとしたらデザイナーの役割もこの時点でなくなる場合があるのでそうした時には自身の判断でやることを見極めましょう。

また、運営者側に相談すればチーム編成から離脱しデザイナーを必要としている
他チームへ移籍することも可能です。

デザイナーは発表者やプランナーの役割を兼任する可能性があるから

作業工数が多いエンジニアは作品の作成をギリギリまで行いますので
発表の仕方や審査員への見せ方まで気が回りません。
プランナーの役割の人がいればまた違ってはきますがコンセプトをしっかり伝えた発表スライドを作り、発表することもデザイナーの作業範疇と捉えておきましょう。

用件を詰めたらいよいよ作成開始です。
さきほどの話合いと検証により、Facebook AR では顔の動きまでの認識で、体全体の動きまでは追えないことがわかりました。
素材として、人の画像がマストとなりますが、全体を切り抜かずにバストアップでの素材が必要であることがここで決まりました。

デザイナーのわたしは、サービスのロゴ、人物の画像切り抜き、エフェクト用のパーツ作成です。
ここまで決まれば後は各々の作業となります。
エンジニアさんの話に耳を傾けつつ自分のタスクをこなします。

作業をして2日間。ハック終了となり発表です。

「Facebook AR Studioハッカソン」は2日目の夕方頃で作業締め切りとなりました。
ここからは、成果物の発表と実機を使ったデモで審査員にアピールをします。
発表時間は5分と短いので、スライドで完結に説明をし、実機での説明となります。
わたしも発表者として登壇しました。

 

 

 

結果としては受賞ならずですが、Facebook AR Studioをはじめとしたハッカソンという場でのエンジニアさんとのやり取りが間近で見ることができて大変勉強となりましたし、ディスカッションから見える自身の立ち位置によってどう動くかがハッカソンの醍醐味だと思います。

 

 

ぜひデザイナーのみなさんの、こうした体験レポートからデザイナーでやれる範囲を学んでいただければと思います。