Slide 1
Slide 1 text
by Brian
November, 17th 2019
ハ
ッ
カ
ソ
ン
の
す
ゝ
め
爆
速
で
ア
ウ
ト
プ
ッ
ト
を
鍛
え
る
Slide 2
Slide 2 text
skinnybrian.com 2
ブ ラ イ ア ン( 2 7 )
本 名 : 堀 口 慎 之 介 出 身 ： 山 口 県 下 関 市
趣 味 : 洗 濯 、 音 楽 、 フ ル マ ラ ソ ン 、 筋 ト レ
n ot e .m u / s ki n n y b r i a n
@ s ki n n y b r i a n _ t w
Slide 3
Slide 3 text
skinnybrian.com 3
イン ハ ウ ス デ ザ イ ナ ー ③ 年 目
工 業 大 卒 か ら の
福 岡 工 業 大 学 短 期 大 学 部
九 州 工 業 大 学 情 報 工 学 部 編 入
留 年
H a m e e 株 式 会 社 入 社
デ ザ イ ン 部 配 属
→ グ ラ フ ィ ッ ク ( W E B , D T P ) 、 動 画 制 作
→ U I / U X デ ザ イ ン 、
フ ロ ン ト エ ン ド ( H T M L / C S S / J S / R e a c t ) 、
バ ッ ク エ ン ド ( P H P )
開 発 部 へ 異 動 ( サ ー ビ ス 改 善 チ ー ム 配 属 ）
2 017
2 018
2 015
2 014
2 012
Slide 4
Slide 4 text
skinnybrian.com 4
と に か く も の づ く り が 好 き な の で 肩 書 き は
そ れ が ブ ラ イ ア ン と い う 人 間 で す
→ 「 も の づ く り す る 人 」
Slide 5
Slide 5 text
skinnybrian.com 5
さ て 本 題 で す
Slide 6
Slide 6 text
skinnybrian.com 6
っ て 知 っ て る ？
Hackathon
Slide 7
Slide 7 text
skinnybrian.com 7
= H ac k + M a r a t ho n
Hackathon
Slide 8
Slide 8 text
skinnybrian.com 8
と は …
エ ン ジ ニ ア 発 祥 な の も あ り 、
ソ フ ト ウ ェ ア 系 の も の づ く り が 多 い 印 象
制 限 時 間 内 に
何 か も の づ く り す る
イ ベ ン ト
Hackathon
Slide 9
Slide 9 text
skinnybrian.com 9
国 内 / 海 外 問 わ ず
ハ ッ カ ソ ン イ ベ ン ト は 存 在
Slide 10
Slide 10 text
skinnybrian.com 10
1 日 、 2 日 、 数 時 間 、 数 日 …
制 限 時 間 っ て ど の く ら い ？
Slide 11
Slide 11 text
skinnybrian.com 11
Slide 12
Slide 12 text
skinnybrian.com 12
イ ベ ン ト も い い け ど …
Slide 13
Slide 13 text
skinnybrian.com 13
勝 手 に （ 身 内 で い い ）
ハ ッ カ ソ ン し ち ゃ う の も
た の し い よ ( ´ ▽ ` ) ﾉ
Slide 14
Slide 14 text
skinnybrian.com 14
勝 手 に ハ ッ カ ソ ン す る と い い こ と
① お 手 軽 ア ウ ト プ ッ ト
② す ぐ 反 応 み れ る
③ 楽 し い
Slide 15
Slide 15 text
skinnybrian.com 15
僕 の 個 人 目 標 の た め と い う の も 続 け て い る 理 由
毎 年 1 つ We b サ ー ビ ス を
リ リ ー ス す る
Slide 16
Slide 16 text
skinnybrian.com 16
最 近 つ く っ た も の 紹 介
Slide 17
Slide 17 text
skinnybrian.com 17
制 作 期 間 : ２ 日
Slide 18
Slide 18 text
skinnybrian.com 18
2019.01.27
17:00
日 本 中 が 震 撼 し た 、 あ の 日 。
Slide 19
Slide 19 text
skinnybrian.com 19
嵐 、2 0 2 0 年 を 持 って 活 動 休 止 を 発 表
h t t p s : / / w w w . o r i c o n . c o . j p / n e w s / 212 8 3 0 6 / f u l l /
Slide 20
Slide 20 text
skinnybrian.com 20
そ の 1 5 分 後 ( 1 7 : 1 5 頃 )
鳴 り 響 く 僕 の S l a c k
Slide 21
Slide 21 text
skinnybrian.com 21
そ の 1 5 分 後 ( 1 7 : 1 5 頃 )
そ の 週 中 に リ リ ー ス
す る こ と が 決 ま っ た 。
嵐の感謝サイトを
爆速で作る！
Slide 22
Slide 22 text
skinnybrian.com 22
メ ン バ ー が 集 ま っ た
そ の 3 0 分 後 ( 1 7 : 1 5 頃 )
Slide 23
Slide 23 text
skinnybrian.com 23
B r i a n
（ デ ザ イ ン ）
お と も だ ち
（フロント / バックエンド）
お と も だ ち
（ 総 指 揮 ）
お と も だ ち
Slide 24
Slide 24 text
skinnybrian.com 24
お と も だ ち
（嵐ファン）
B r i a n
（ デ ザ イ ン ）
お と も だ ち
（フロント / バックエンド）
お と も だ ち
（ 総 指 揮 ）
Slide 25
Slide 25 text
skinnybrian.com 25
ま さ か の 嵐 監 修 が 入 る よ う に な っ た
嵐のことなら
うちに任せて！
Slide 26
Slide 26 text
skinnybrian.com 26
① 日 目
Slide 27
Slide 27 text
skinnybrian.com 27
要 件 定 義 F I X
• サ ー ビ ス 名 は 「 # 嵐 あ り が と う 」
• あ り が と う コ メ ン ト ( 1 0 0 文 字 く ら い )
• 色 が 選 べ る
• 送 信 ボ タ ン
• T w i t t e r シ ェ ア
• O G P 画 像 で メ ッ セ ー ジ 内 容 表 示
Slide 28
Slide 28 text
skinnybrian.com 28
サ イ ト の ワ イ ヤ ー が 完 成
Slide 29
Slide 29 text
skinnybrian.com 29
正 味 1 0 秒 く ら い
Slide 30
Slide 30 text
skinnybrian.com 30
そ の ま ま デ ザ イ ン 落 と し 込 み
Slide 31
Slide 31 text
skinnybrian.com 31
嵐 フ ァ ン の 監 修 ①
嵐のカラーは
決まってるよ！
担当カラーには
順番があるよ！
相葉 : 緑
松本 : 紫
二宮 : 黄
大野 : 青
櫻井 : 赤
Slide 32
Slide 32 text
skinnybrian.com 32
メ イ ン ペ ー ジ だ け ま ず リ リ ー ス
Slide 33
Slide 33 text
skinnybrian.com 33
② 日 目
Slide 34
Slide 34 text
skinnybrian.com 34
メ ッ セ ー ジ 画 像 デ ザ イ ン
Slide 35
Slide 35 text
skinnybrian.com 35
ピ ク セ ル 指 定 と か
Slide 36
Slide 36 text
skinnybrian.com 36
メ ッ セ ー ジ の 入 力 U I
Slide 37
Slide 37 text
skinnybrian.com 37
嵐 フ ァ ン の 監 修 ②
カラーのところ
「担当カラー」で！
Slide 38
Slide 38 text
skinnybrian.com 38
シ ェ ア で き る よ う に な っ た
Slide 39
Slide 39 text
skinnybrian.com 39
そ し て で き た も の が こ ち ら
h t t p s : / / a - r a - s h i . f a n / s h a r e
Slide 40
Slide 40 text
skinnybrian.com 40
Slide 41
Slide 41 text
skinnybrian.com 41
現 時 点 で 9 3 9 シ ェ ア
バ ス ら せ た か っ た か ら M ス テ の 嵐 出 演 タ イ ミ ン グ 狙 っ た り し て
Slide 42
Slide 42 text
skinnybrian.com 42
n o t e で 発 信
Slide 43
Slide 43 text
skinnybrian.com 43
Q i i t a で 発 信 ( 5 0 0 シ ェ ア き た )
Slide 44
Slide 44 text
skinnybrian.com 44
学 び と 、
今 日 の ま と め
• そ の タ イ ミ ン グ で 旬 な も の が 作 り や す い
• 仲 間 集 め 実 際 大 変 （ 俺 た ち は 運 が 良 か っ た ）
• ク オ リ テ ィ < < < < ス ピ ー ド ！
• リ リ ー ス ま で や っ て み ん な に 知 っ て も ら う
• や っ ぱ り 作 る の は 楽 し い
Slide 45
Slide 45 text
skinnybrian.com 45
ぜ ひ チ ー ム 組 ん で 何 か 作 っ て み て く だ さ い ！ そ し て シ ェ ア ！
ハ ッ カ ソ ン た の し い よ ！
Slide 46
Slide 46 text
skinnybrian.com 46
Thanks for your Attention!
1. Fu tu ra P T ( B o o k , B o o k Obliqu e ) f ro m A do be Fo n t s
2 . 筑 紫 B 丸 ゴ シ ッ ク S t d ( L , R , M , D , B , E ) f r o m F o n t w o r k s
3 . 筑 紫 A オ ー ル ド 明 朝 P r 6 ( E ) f r o m F o n t w o r k s
3 . K s o 般 若 ( R e g u l a r ) f r o m F o n t w o r k s
使 用 フォント