paiza開発日誌

IT/Webエンジニア向け総合求人・学習サービス「paiza」(https://paiza.jp ギノ株式会社)の開発者が開発の事、プログラミングネタ、ITエンジニアの転職などについて書いています。

デザイナーにもGit/GitHubを使ってもらうようになったらメリットばかりだった話

f:id:paiza:20171219204804j:plain
Photo by Nick Quaranto
高村です。

エンジニアは、普段からGitやGitHubを使ってバージョン管理をしている人が多いですよね。一方、周りにいるデザイナーなどエンジニア以外の職種の方々はどうでしょうか?

普段からGit(GitHub)を使っているエンジニアからしたら「便利になるんだから、つべこべ言わずに使ってよ」って感じかもしれませんが、非エンジニア職の人たちに「使ったら便利になるっぽいけどよくわからない」「なんかコマンドとか必要で難しいイメージがある」「Git怖い」などと言われて、なかなか使ってもらえない&導入が進まない…なんてケースも多いのではないでしょうか。

paiza(ギノ)社内でも、かつてはそんな状態でしたので、社内で非エンジニア職向けにGitの勉強会を実施するようになりました。現在は、デザイナーさんなどの職種の人たちもGitHubを少しずつ使ってもらえるようになり、実装もスムーズに進むようになってきました。

今回は、弊社の事例を参考に、非エンジニアがGitを使えない場合のデメリットと使える場合のメリット、そして導入する際のポイントをお話ししたいと思います。

■Git/GitHubとは

Gitとは、簡単に言うとファイルの変更履歴を管理してくれるシステム(一般的にはバージョン管理システムと呼ばれているもの)です。

開発をしていると、ファイルを編集前の状態に戻したいとか、間違えて編集しちゃったとか、どれが最新かわからないとか、そういうことがたびたび発生します。(デザイナーの方がページデザインなどを作っているときも、こういう「間違えちゃった」「戻したい」みたいなケースって発生するかと思います)

そんなときに、バージョン管理をしておけば、コードの変更履歴を管理したり、過去のバージョンのファイルに戻したり…といった作業も簡単にできます。

さらにGitでは、リポジトリ(簡単に言うとファイルや履歴を保存する場所)を分散して保持できるため、ローカルのリポジトリを利用することで、リモートリポジトリのサーバにアクセスできない環境(オフライン環境)にいても作業ができます。

そしてGitHubは、このGitの仕組みを利用して、個人・企業問わずにオンライン上でリモートリポジトリの作成・公開ができるサービスです。複数人での共同作業に必要な機能も揃っているため、学校や企業などで広く使われています。

github.com

特にWebサービスアプリ開発をしている企業では、ユーザーの反応を見てすぐに機能追加するなどスピード感のある開発をしていくために、多くがGitHubを使った開発フローを実践しています。

■デザイナーさんがGitHubを使っていなかった時に起きていた不便

◆HTMLなどのデザインデータの共有が超不便

私が入社したての頃は、HTMLファイルなど、作ってもらったデザインデータはなんとチャットでやりとりをしていました。

まぁ、本当にちょっとしたファイルならよいのですが、徐々にデータが大きくなりすぎてチャットに貼れなくなる…といったケースが起こり始めます。

で、貼れないサイズのデータはどうやって共有するかというと、firestorageなどのオンラインストレージサービスにアップしてもらっていました。

これの何が不便かというと……

◇どのデータが最新かわからなくなりがち

一つのファイルを複数人で修正していると、「どのファイルが最新かわからない問題」がよく起こりますよね。

「これが最新だと思って作業してたのにどうやら違うらしい」「古いデータに新しい要素を追加してしまった」「いつの間に変わってたの?」「上書き前が正なの?後が正なの?」みたいな……。

◇差分がわからない

これ!!

例えばフォントサイズの変更や文言追加など、ちょっとした追加・修正でも、そのデータを新たにアップしてもらって、ダウンロードして、そのデータをエンジニアがGitHubリポジトリを作って差分をとって確認して、本番環境に反映して……ということをやっていました。

これはエンジニアにとって不便なだけでなく、デザイナーの方が複数いる場合でも、差分がとりづらくて大変だったのではないかと思います……。

◇とかやってる間にまた修正が発生したら、またアップしてもらって、ダウンロードして、差分確認して……

うぅ……。

◇オンラインストレージサービスだと数日後にはデータが消えてしまう

これも不便ですね。

社内サーバに置くようにしていても、外注しているデザイナーの方だと入れなかったりしますし、落とし忘れたまま期限が過ぎたらまたアップしてもらわないといけないし。やはり担当者であれば、誰でも・いつでも・どこからでも共有できる状態じゃないとつらいですね。


…というわけでいろいろ面倒な問題が多すぎたので、デザイナーさんにもGitHubを使ってもらうようにしました。

最初は「興味あるー!使いたいー!」という人もいれば、「怖い…」という人もいたので、paizaラーニングの「Git入門編」を使った社内勉強会を定期開催したり、段階を踏んで少ーしずつ導入したりしていったところ、以下のようなメリットがありました。

f:id:paiza:20171221135413j:plain

paizaラーニングGit入門編はこちら

■デザイナーさんもGitHubを使えるようになり生じたメリット

◆差分がすぐわかる!

まずは、「デザインデータをGitHubにアップロード(pushするといいます)するようにしてください!たったそれだけです!」というところから始めました。

これだけでも、いちいちダウンロードして、リポジトリを作って、差分をとって…っていう作業をしなくて済むので、エンジニアの作業的にはすごく楽になりました。

◆エンジニアが実装時に修正した部分もデザイナーさんと共有できる

作ってもらったデザインをサービス側に反映させていく際には、軽微な修正が発生するときがあります。実装してみたらちょっと文字がズレちゃいそうなのでいじりたいとか、画像の位置を調整したいとか…。

GitHubでデザインデータを管理できていれば、そういった実装時に発生した差分もすぐにデザイナーさんと共有できて最高です。

■非エンジニア職にGitなどのツールを導入してもらう際のポイント

そんなわけで、少ーしずつデザイナーさんにもGitHubを使ってもらうようになりました。今でも全機能をモリモリ使ってもらっているわけではありませんし(みんなが全機能使えるようになる必要もないですし)、導入の進み具合も人によって違いますが、導入に際してわかったことや気をつけたのは以下のことです。

◆まずは課題を明確にする

エンジニアはいろいろなツールを使うのに慣れているので、ついつい「使えば便利になるんだし、いいから導入しろよ!」と思いがちです。ただ、考えがそこで止まっているエンジニアは、「Git(GitHub
の導入」だけが目的になっちゃっているんじゃないかと思います。

でも、本当の目的って、今の仕事の進め方における課題を解決することで、Git(GitHub)の導入じゃないですよね。極端な話、導入したのにいつまで経っても誰も使えないとか、使える人が教える時間をとれないとか、わからないまま使い始めるしかなくて以前より効率が落ちるとか、そんな結果になったら意味がありません。

だからまずは、「このツール導入しようぜ!」じゃなくて、現在どこにどんな課題があるのかを明らかにしたほうがいいですね。

◆コストについて考える

当たり前ですが、新しいツールを導入するのであれば、誰かが使い方を教えなければなりませんから、教育コストがかかります。

また、今までのやり方を新しいやり方に変えるのであれば、担当者が慣れるまでの効率はどうしても落ちてしまいます。

長期的に見て考えたときに「それでも新しいツールを導入するのが本当にプラスになるのか?」はきちんと考慮した方がいいですね。「Git導入してよかったよ」という記事でこんなこと言うのもなんですが、コストを考慮した上で、導入しない選択肢をとるパターンも大いにあると思います。

実際、私は前職(受託開発をしていました)でSVNを使ってバージョン管理をしていた案件でもGitの導入を検討したことがあったのですが、そのときの現場の課題感や担当者たちの教育コストを考えて、最終的には「Gitは導入しない、SVNの利用を継続する」ことにしました。

このときは「コストの方がかかりすぎてプラスにならない」というのもありますが、前述の課題を明確にしていくうちに、「SVN自体が問題なのではない(≒改善すべき点はもっと他の部分にある)」とわかったからです。

◆導入を進めるなら一段階ずつ

弊社の場合だと、まずは「作ったデータをGitHubに置いてもらうだけ」から始めました。しばらくは他の難しそうな作業は置いといて、とにかくデータを置いてもらうだけです。で、置くのに慣れきったらもう一歩だけ新しいことを覚えてもらう…って感じで、本当に少ーしずつ導入していきました。

「使ったことない、怖い」な状態から、一通りの使い方をいっぺんに覚えてもらうなんて無理ですよね(もちろん業務の状況によってはそんなにゆっくりやってられないケースもあるかと思いますが…)。

急にすべてのやり方を変えてしまっても効率が落ちますし、そうなると担当者側も「効率落ちるのに何で今までのやり方を変えなきゃいけないの」ってなりますし、余計に「Git怖い」と思われてしまいますので…。

もちろん担当者が「Git興味あるー!使いたいー!」という人なら、一気に三段階ずつぐらい教えていってもいいと思います。その辺は人によりますね。仕事なのでそんなこと言ってられないケースもあるとは思いますが、本当はその人のペースに合わせて、柔軟に導入を進められるのが一番いいです。

◆「使ってくれたから、こんなに便利になったよ!」ってちゃんと言う

「まずはGitHubにデータを置いてもらうだけ」を始めた段階で、デザイナーさんに「GitHubに置いてくれたおかげで、差分がとりやすくなって、こんなメリットがあって、こんな場面ですごく助かってます!最高~!」みたいなことは伝えまくってました。

「Git(GitHub)やろうぜ」とだけ言われても、エンジニア以外の人たちが「何で今までのやり方を変えないといけないの」「何でよくわからないものの使い方を覚えなきゃいけないの」と思うのは当たり前です。コマンドとかコンソールとかに慣れてない人からすると、怖く感じるのも当たり前です。

だからこそ、「使ってくれてこんな場面で助かった、前よりもこんなことが便利になった」というのは伝えたほうが、具体的なメリットがわかるし、「そんなに便利なのか、じゃあ使おっかな」と納得感が出る(はずです)。

■まとめ

というわけで、デザイナーさんにもGitHubを使ってもらうようになってよかったですという話でした。

エンジニアチームがGitでバージョンを管理している現場であれば、やはりデザイナーやディレクターといったエンジニア以外の方も使えたほうが何かと便利になると思います。

導入にハードルがある場合は、前述のようにまずはデータを置くだけ~というように、段階を分けながら進めていくといいのではないでしょうか。

「最終的にはマージとかプルとかコミットとかもできるようになりたい~!」という場合は、paizaラーニングGit入門編を受講すれば、初心者でも使い方を少しずつ学べますのでぜひどうぞ。


paizaラーニングGit入門編はこちら





paizaラーニング」では、未経験者でもブラウザさえあれば、今すぐプログラミングの基礎が動画で学べるレッスンを多数公開しております。

そして、paizaでは、Webサービス開発企業などで求められるコーディング力や、テストケースを想定する力などが問われるプログラミングスキルチェック問題も提供しています。

スキルチェックに挑戦した人は、その結果によってS・A・B・C・D・Eの6段階のランクを取得できます。必要なスキルランクを取得すれば、書類選考なしで企業の求人に応募することも可能です。「自分のプログラミングスキルを客観的に知りたい」「スキルを使って転職したい」という方は、ぜひチャレンジしてみてください。

paizaのスキルチェック

ITプログラマ・エンジニア向け転職・就活・学習サービスのpaiza