![見出し画像](https://assets.st-note.com/production/uploads/images/86586031/rectangle_large_type_2_98ccf7921e2bd93b9ae10fb2b50b4f9b.png?width=1200)
Hack Uにデザイナーとして参加
以前ブログで書いた記事を引っ越しました
2022年2月14-25日にHack UというYahoo!のハッカソンにデザイナーとして参加してきました。
「Hack U」はヤフー社員サポートのもと、限られた期間の中で学生がプロダクトを自ら企画・開発・発表するイベントです。ものづくりを楽しみながらクリエイターになるきっかけ を体感してみましょう!
簡単に言うと、テーマなしで25チームが2週間開発するハッカソンです。
チームはフロント2人、バック3人、デザイン1人の計6人。
この記事では時系列順に何をしたかをまとめます。デザイナーなので、技術系の話は期待せずにお願いします。
Hack U前
アイディア出し
会議の前に、1人3つアイディアを考えて来るという課題がありました。私は結構真面目に考え、リーンキャンバスに競合などもまとめました。結果、8つほどアイディアが集まり、その中かからなんと私のアイディアが選ばれました。
自分で言うのもなんですが、アイディアは天才だと思います。
とりあえず発表プレゼンをご覧ください。/
要件定義
アイディアの発散をMiroで行い、確定事項をHackMDにまとめました。同時に私は簡単なワイヤーフレームをFigmaで作り、イメージを共有しました。
Miroはオンラインホワイトボードツールです。ほぼ無限の空間に付箋や表やマインドマップを書きまくれます。
HackMDはマークダウンが書けるのでエンジニアが大好きなツールです。
Figmaは私の嫁です。
話し合いの時には、「きもい」「陰キャはそんなことしない」「それは陽キャの行動」などという単語が飛び交いました。自分の陰キャエピソードに共感してくれる人がいて感動したと同時に、共感しない人に若干の殺意が湧きました。
私からは絶対に出てこない、めちゃくちゃ面白いアイディアをチームの人がたくさん出してくれたので、サービスへの期待が高まりました。
デザイン
要件定義を基にFigmaでデザインを行いました。
私事ですが、この頃はZliのイベントのポスターや、人生初ポートフォリオを作ったりしていました。加えて、100プログラムという東大(ここ重要!どや!)発のプログラムに参加していて死にそうでした。
なので結局Hack Uのデザインは4,5日かかり、締め切り1日オーバーでした。申し訳ない。
また、Figmaを初めて触るメンバーがいたのに説明が不十分な点がありました。なので、今後のために「FIgmaを初めて触るエンジニアへ」というタイトルでQiitaに記事を書きました。良ければご覧ください.
![](https://assets.st-note.com/img/1662798593592-7jwXlUiY1m.jpg?width=1200)
![](https://assets.st-note.com/img/1662798597485-a199ny5Czs.jpg?width=1200)
Hack U
Hack Uが始まると、エンジニアは大学で夜の2~4時まで稼働していててスゲーという感じ。
ちなみにコアタイムは15時から19時だったのですが、守られたのは初めの2日くらいです。私は夜の2時から朝の8,9時は寝ていたので、朝の4,5,6時に起きているエンジニアのメンションに気づかないこともしばしば。本当に申し訳ないという気持ち。
相談会
Hack Uは開発期間内にメンターさんとお話しできる機会が最低1回用意されていました。新しいアイディアをいただけてとても参考になりました。
ヤバかったのは、以前にFigmaで後輩と鬼ごっこをした時に貼り付けたVtuberの画像が一瞬映ったことです。メンターさんの盲点に入っていたことを祈ります。
資料作成
エンジニアさんが実装に集中できるように、実装以外のタスクは私の役目です。
もちろん技術は分からないので、資料の下書きだけエンジニアさんにしてもらい、装飾などを行います。また、小さいところでは運営からの連絡をリマインドしたり、概要説明文章、デモ動画のシナリオを書いたりしました。
他に特に力を入れたの物が3つあります。
スライド
発表用のGoogle Slideを装飾しました。
Google Slideの「私は最小元のことしかできない!」という姿勢はやはり心地いいですね。PowerPointの「やっぱ私だよね!」と言いながら角丸を数値で調整できないような奴とは違います。
ただ、Group化できないバグが発生してた時は、Google Slideにもキレそうでした。
ちなみにスライドの素材はTwitterのロゴ以外は全て自作です。最近Illustratorのパス関係をやっと理解できたので、できることが増えて嬉しいです。
デモ動画
2つ目は、スライドに挿入するデモ動画です。
ちなみにAfter Effectsを利用するのはこれが2回目で、ちょっと慣れてきた感あります。
アプリの動画がエンジニアから届いたのはギリギリでしたが、それ以外の部分を前日に制作しておいたので、間に合わせることができました。
時間がなかったので、ボケ気味でタイミングがずれているところがありますが、まーまーの出来ではないでしょうか?
女装画像
デモ動画内に女役が二人必要でした。このネタアプリのために現実の女性を召喚するわけにはいきませんし、女装した方がウケるだろうということでチーム内から生贄を出すこになりました。
1人は発表者の先輩が快く引き受けてくれました。その後は、1番学年が高い私が立候補するのが良かったのでしょう。しかし、私は後輩が犠牲になろうとも生き残りたかったで、断固として手は上げませんでした。
結局ジャンケンして、誠にとても本当に遺憾ながら、私が女装することになりました。その時、後輩に「ぽえぽえぽえ〜」と言われて、初めてルイ姉の気持ちが分かりました。そう、殺意です。
権利の問題などからスマホアプリは利用せず、3時間ほどかけてPhotoshopで女装画像を作りました。こんな目的で初めて使われるとは、Photoshopも思っていなかったでしょう。
結果、10メートル先から見れば10回に1回くらいは女性に見える子が完成しました。
後輩に「雑コラで草」と言われたことを私は一生忘れません。
![](https://assets.st-note.com/img/1662798625245-s4nY9V0AXn.jpg?width=1200)
発表会
発表
先輩が発表を行い、ところどころのネタで他のチームの方に笑ってもらえました。
他の人の発表では、小学6年生の方が発表していたチームや、筋肉への愛が強いチーム、IOT系の面白いチームがあり、見ていて楽しかったです。
結果発表
残念!賞はもらえませんでした。
ただ、フィードバックで「アイディアは天才」と運営の方に言ってもらえたので、開発を継続することも視野に入れています。
感想
めちゃくちゃ忙しかったですが、大学生活で一番春休みを有効に使えたと思います。
何より自分のアイディアが実際に動くと感動しますし、Yahoo!の方にフィードバックをもらえて嬉しかったです。
このような体験をさせてくれた、エンジニアさん達には感謝しかないです。ただ、賞は欲しかったので、また機会があれば挑戦したいと思います。
余談
1日経ってもまだ筋肉教が頭から離れないのですが、病院に行った方が良いでしょうか…
Adobe税を払うために使わせていただきます