こんにちは。directのUI/UX設計を担当している水嶋です。
業務では、新機能のUI仕様の検討や、各種ボタン・アイコンなどのデザインアイテムの作成をしています。
もっぱら紙の上やPhotoshop・Illustratorでの作業がメインで、開発チームの中では唯一「コードを書かない人」でした。
あの日までは。
キックオフ
ある日のお昼ご飯にて
水嶋「手持ちの仕事がひととおり片付いたので、今ちょっと手が空いてるんですよね」
サーバーサイドエンジニアKさん「あのさ、『directのUIを自分で直接いじって修正できたらいいな』って思ったりしない？」
水嶋「思います」
Kさん「時間があるなら、Gitを勉強して使ってみませんか？」
水嶋「やります」
Kさん「じゃあ水嶋さんのPCに開発環境を構築できるように手順書作ってきます」
話が早い！
弊社では、実際にこの程度の雑談からなにかが始まったり改良されたりすることもしばしばです。
そうしてあっという間に（実際はいろいろ大変な目に遭いながら）、私のPCにサーバーが立ち上がり、directの「管理ツール ※」を起動する環境ができました。
（※ システム管理者がdirectの各種機能設定をするためのツール）
忙しい業務の合間をぬって開発環境の構築手順を整えてくださったKさん、本当にありがとうございました。
「こんなことができたらいいな」と前から思っていたこと
さて、開発中にデザイナーと以下のようなやりとりをした経験のあるエンジニアの方も少なくないのではと思います。
デザイナー「デザイン指示書を作りました」
エンジニア「実装して開発環境にアップロードしました」
デザイナー「見ました。ここのマージンを○px広げてください。あとこのフォント色が違うのでこうして、あと…（以下略）」
エンジニア「修正しました」
デザイナー「見ました。このテキストの文言がほかと揃っていないので修正してください。それから…（以下略）」
デザイナー自身がGitを使えるようになると、これ↑がこう↓なります。
デザイナー「HTMLとCSSを修正しました。GitHubでプルリクエストを投げたのでコードレビューしてください」
エンジニア「承認」
早い！
大前提として「デザイナー自身がコーディングできる」必要がありますが、もしせっかくCSSなどを書けるスキルがあるならどんどん生かしていけるとよいと思います。
Gitの使い方の学習方法
初学者向けのWebサイトをいくつか読んで、自分で実際にひとつずつコマンドを打ち込んでみました。シンプルですね。
なお、GUIツールは使わず、ターミナルでコマンドを入力して勉強しました。 一応、Sourcetreeもインストールしましたが、結局ほとんどさわりませんでした。（ブランチがどこから枝分かれしているかを視覚的に見るぶんには便利でした。使ったのはそのくらいです。）
ターミナルからコマンドを叩いたほうが「今なにをやっているかが分かりやすい」、というよりも「分かっていないとコマンドが叩けない」ため、手でひとつひとつコマンドを入力してみて覚えていったほうが結果的に早いと思います。
わりといい感じにGitを使い始めることができた理由
もし、これを読んでいる方で「デザイナーにGitを覚えて使ってもらいたい」という方がいらしたときのために、ポイントになりそうなことを書いておきます。
私があらかじめできていたこと（アドバンテージ）
- 「バージョン管理システムの概念とそのメリット」をざっくりでも理解した状態である。
- 本人にやる気がある。
- コンソール画面でコマンドを打ち込むことに抵抗がない。
- L is B社内に、デザイナーとエンジニアで協業できる風土がある。
1 について、Gitの概念の説明として一番わかりやすかったのは、こちらの「郵便局メソッド」です。
デザイナーがこうやってGit覚えて大好きになったよ♡ – Qiita
https://qiita.com/yunico-jp/items/87bdd13971e82833f6bb
2 については、前述のとおり「自分でCSS直せたら早いのになー」と思っていたので、今回もらった提案はむしろありがたい話でした。初期学習コストがそこそこにかかりはしますが、そこを乗り越えた後のメリットは大きいと思います。
非エンジニアにとって実は地味なネックになっているのが 3 かもしれません。「真っ黒でなんか怖い」という印象がある人も少なくないので、さわってみてまずは慣れ、「思ったほど難しくない」と感じてもらうのがよいと思います。
また、今回よかったポイントは 4 でした。
弊社ではUI/UXデザイナーと開発担当者が分断しておらず、一つのチームとして仕事をする風土があります。「デザイナーが指示書を作る → 開発担当者がコーディングする」という一方向のつながりではなく、エンジニア全員と「どうしたらUIがよりよくなるか」を共有し、互いに意見を出し合いながら開発を進めています。
ちなみに、社内の雑談トークルーム(チャット)で「今、Gitの使い方を勉強しています」とつぶやいた途端、「この本がおすすめ」「こういうWebの学習コンテンツがある」などの情報があっという間にエンジニアのみなさんから飛んできました。 みんな教えたがり 他者への協力を惜しまない暖かな職場です。
一方、私ができないこと
- 見知らぬエラーが出たときに一人で対応できない。
自分のPCで開発環境を立ち上げようとしたらビルドエラー吐いてる…というとき、一人で解決に至れません。
そこで対策として、前述のKさんにメンターを引き受けていただきました。困ったときに相談できる相手がいるのは大変に心強い思いをしました。
……そんなこんなで、実務で初めて出したプルリクエストは「コピーライトの年号を2017から2018に変更する」という大変ささやかな修正でした。
レビューが通ってマージされたときのうれしさ。
弊社では開発メンバーを募集しています
弊社では新しく開発チームに加わってくださるメンバーを大募集しています。募集職種は多岐に渡りますので、こちら より気軽にご連絡ください。
これを書いている5月末現在、徳島市内では阿波おどりの練習のにぎやかな音があちこちから聞こえてきています。徳島でソフトウェア開発の仕事をお探しの方、ぜひ弊社L is Bでdirectを作ってみませんか。お待ちしています。
