Tweet
Tweet

Slide 1

Slide 1 text

Rails開発の中で デザイナーの私は どこまで担当しているのか 2018/03/07 @フロントエンドLT飲み会 Fumihiro Nakahara

Slide 2

Slide 2 text

株式会社groovesのデザイナー。
 あのForkewellの開発に携わっています。 @711fumi 中原 扶⾒⼤

Slide 3

Slide 3 text

※諸注意※

Slide 4

Slide 4 text

今⽇は 勉強会 飲み会

Slide 5

Slide 5 text

気楽にいこう!

Slide 6

Slide 6 text

1. なぜ発表するのか

Slide 7

Slide 7 text

「エンジニアとデザイナーは  お互いの理解を深めて  協⼒して開発を進めるのが良い！」 →よく聞く

Slide 8

Slide 8 text

「エンジニアとデザイナーは  具体的にどんな感じで  作業を分けているの？」 →あまり聞いたことない

Slide 9

Slide 9 text

⼈の様⼦を聞きたいなら まずは⾃分の様⼦から ↓ 発表に⾄る

Slide 10

Slide 10 text

2. 現状

Slide 11

Slide 11 text

所属チーム(プロダクト)について ・Ruby on RailsでWebサービス ・エンジニア５⼈くらい ・デザイナー２⼈ ・インフラ〜サーバーサイド〜JS ・UIデザイン〜フロントエンド実装(JS含む)

Slide 12

Slide 12 text

私について HTML/CSS JavaScript サーバーサイド UIデザイン インフラ やりたい できる ○ ○ ○ ○ ○ △ ☓ △☓ ☓ ☓ ( Ruby on Rails )

Slide 13

Slide 13 text

3. 実際の役割

Slide 14

Slide 14 text

個⼈として「やりたいこと」「できること」 チームとして「やらなければいけないこと」 のバランスをみて守備範囲を定めているつもり 基本的には

Slide 15

Slide 15 text

コーディングの前に…UIデザイン ・デザイン(仕様)をエンジニアに確認してもらいたい場合は  レビューツールを使う ・フロントエンド実装(ソースコード)がアウトプットなので、  デザイン指⽰書?やデザインファイルのバージョン管理みたいなものは  今のところはあまり必要性を感じない(⼈数が少ないのもあるし)

Slide 16

Slide 16 text

Rails開発における担当部分 JavaScript Decorator/Helper Test View/CSS ModelやController やる (わからないなりに)やる できるところはやる できるところはやる 基本的にはさわらない

Slide 17

Slide 17 text

View/CSS ・HTML/CSSはやりたい＆できるのでもちろん担当 ・Viewはデータ取ってくるとこをエンジニアに依頼 ・データが表⽰されているけどデザインが当たってないPRをエンジニアから引き取る ・デザインが当たっているけどデータが仮のままのPRをエンジニアに渡す

Slide 18

Slide 18 text

JavaScript ・やりたいので学びつつ書く ・JSスキルのあるメンバーに環境構築はおまかせ状態 ・ただでさえめんどいフロントエンドの環境にRailsが絡むともうだいぶアレ ・エンジニアもデザイナーも

Slide 19

Slide 19 text

Decorator/Helper ・Viewに必要な処理なので書ける場合は書く ・ただよくわからない場合はすぐエンジニアに投げる

Slide 20

Slide 20 text

Test ・React component のテスト(Enzyme) ・RSpecでのFeature(E2E)テスト ・デザイン変更してテストが壊れたらなおす ・Reactでcomponent作ることあるので伴って書く(⾃信はない) ・まれに⾃発的にテストも書く ・ただ(私は)基本的にはすぐエンジニアに投げる ・重要性はわかっているが書きたいとは思わない

Slide 21

Slide 21 text

というわけで

Slide 22

Slide 22 text

教えてもらえるとうれしいです! デザイナーとエンジニアの 「協業」 みなさんはどうやってますか？

Slide 23

Slide 23 text

完

Slide 24

Slide 24 text

開発メンバー絶賛募集中です！ こんな感じで開発している弊社 https://www.grooves.com/recruit