ツール

非エンジニア業務をエンジニアがやってみて効率化してみた

AvatarPosted by

はじめに。

「働き方改革」によって工数削減する動きがある昨今、非エンジニア業務をエンジニアによって工数削減するのは効果的なのでははないか？と思っています。
これは別にエンジニアが優れていて非エンジニアが優れていないとかそういう話ではなく、PCを使った業務である以上、「こういうものだと思って仕方なくやってる」ことに対して「実は簡単に済ませられることに気づけない場合が少なからずある」ということが言いたいのです。

今回、ご紹介するのはクリエイティブの管理業務の膨大な工数をスプレッドシートと Google Apps Script（以下、GAS）を用いて大幅カットしたお話です。
やってることはカンタンですし、もっと良い方法があるかもしれません。
ただ、エンジニアが非エンジニア業務に介入することで月100時間以上のコストカットが実現できる可能性もあるのだということを認識し、自分の業務外のことにも興味を持つようなエンジニアが増えたらこの記事も書いてみた甲斐があるというものです。

基本的にめんどくさがりが多いエンジニア（だと思ってる）ですが、効率よくミスが少なくなるフローを創出していくこともエンジニアの役目だと思いませんか？

改善前後の物事整理

私の所属しているプロジェクトはGREE/dゲーム/モバゲーといった３つのプラットフォームにまたがって展開しています。更にそれらのプラットフォームは１年ごとに遅延を持たせた運用を行っているため、時期に合わせた対応とプラットフォームに合わせた差分が時間差で生じてしまうような特徴を持っています。

そんな中、クリエイティブの管理ってどういう風にやってるの？というのをヒアリングし、実際の作業を少し拝見させていただきました。そして、そこから1か月、実際に作業しながらどんなことに注意を払うのか、現行のやり方でどのくらい時間がかかるのか、簡易化できるところはないかを探ってみた結果、問題点と対策について整理して考えてみました。

◆問題点

  • フィーチャーフォン（以下FP）、スマートフォン（以下SP）のサービスがあるため、それぞれ専用の画像が存在し、エクスプローラや Finder で開いて手動でコピーしていたため、FP用画像とSP用画像が入れ違いに格納されるケースがあった
  • 既存画像をコピーした画像を配置したいが、手動でコピー、リネームしていたため、ファイル名に誤りがあったりした（半角であるべきなのが全角だったとか）
  • プラットフォームや運用年数の差分から生じてしまった格納するファイルパスやフォルダ構造の違いによって単純なコピー作業にならず、当時の構造を追って格納する必要があった
  • 依頼されたテキストが正しく画像に反映されているかをチェックする環境がなく、デバッグ時に仕様と見比べていたため、手戻りする時間が大きかった
  • 画像の確認をデバッグフェーズで行っていたため、格納漏れ、依頼指示漏れに気づけるのがかなり後のフェーズになっていた
    ※デザイナーは開発が終わるまでサーバー上の画像をチェックできなかった

これらの問題点は画像格納管理をExcel上で行っており、紙ベースでやり取りされていたり、手動で地道な作業を行っていたためヒューマンエラーを生じやすい状況を作っていたことから発生していると考えられます。更にデバッグ時の手戻りや修正工数を削減できたらチームとしてもハッピーですよね。
そこで、スプレッドシートと GAS を活用してみようと思い立ちました。

◆対策

  • ファイルリスト管理をスプレッドシートに移行
    →　スプレッドシートで完結することで誰でも同時に編集可能になった
  • スプレッドシートからコピーコマンドを生成するGASを書く
    →　プラットフォーム別、SP/FP別といった特徴を加味して cp コマンドをコマンドシートに書き出しました
  • ファイルパスの内容を関数化し、手入力する場所を減らす
    →　ファイルパスの変化ルールを施策ごとに抽出し、Excelのような関数で対応しました
  • 設定シートを設けて日付と特有の仕様からコピーすべきカード名などの入力欄を設け、関数適用させてリスト作成を簡易化
    →　設定シートさえ編集（仕様をコピー）すれば、制作リストが自動的に生成される環境になった
  • 画像リスト（依頼指示側）は、IMAGE関数を用いてどんな画像をベースに制作されるべきか、どんな画像がコピーされているべきかをチェックできるようにする
    →　以前制作された画像を参照画像として表示することで、「こんなイメージで作って」を伝えやすくした（以前はExcelに手動で張り付けていたが、自動で参照できるようにした）
  • コピー、新規作成などの項目を設けてコピー対応に関してはエンジニアが行い、新規画像作成に関してはデザイナーが行うことにする
    →　作業の最適化ですね
  • 格納チェックシートを設け、デバッグ環境に画像をデプロイされたらIMAGE関数によってスプレッドシート上で画像を目視できるようにした
    →　FP/SP画像とサイズ差分を見やすくし、依頼内容のテキストを並べることで、画像の整合性チェックを一覧表で行いやすくしました。

◆改善効果の考察

  • 依頼側の入力コストは Excel でやってたのでほぼ変わらない。最初の学習コストと改善コストは積み重ねたが、結果、更に作業時間短縮になった
  • コピー作業に関しては cp コマンドを生成するスクリプトを用意したので、依頼指示通りの画像をミスなく格納できるようになった
  • デザイナーは新規画像やプラットフォーム差分の対応のみ行えば良くなった
  • 画像格納者がデプロイ直後にきちんと格納できたか？を一覧で確認できるようになり、デバッグに進む前に不足画像がないか確認することができるようになった（デバッグする人も、画像がないのか、ソースが間違っているのかが一目で分かる）
  • 開発環境の画像を確認するとき、URL指定してアクセス可能であれば IMAGE関数で便利に一覧表を作ることができる

GAS 自体、サーバー側で動作するものです。コピー作業自体は作業者のPCで行われるものなので、コピー作業自体の自動化まではできませんでした。仕方ないのでコピーコマンドを最短時間で作ることに注力しました。
改善後、コピー対応を行う作業のほとんどはエンジニア側で管理するようになりました。
※「コピーコマンドを実行する」という作業はエンジニア側で持つべきでしょ？ということで。

実際、「過去利用した画像のコピーを行うだけの作業」を簡易化する目的だったのですが、チェックしやすくもなりました。

コピー作業自体は月の施策数が多いため、100h/月を4.5h/月に削減できちゃいました。格納ミスがあった場合でもコマンドを生成してコマンドラインを実行するだけなので、修正サイクルも高速化できました。

◆今後の課題

  • 新規画像を張り付けたりしたいとき、スプレッドシートは画像貼り付けが多少めんどくさいのでなんとかしたい
    →　多分なんともならない（Google側のアップデートに期待）
  • 依頼内容自体の入力ミスで格納した画像が違う画像になっていたことがあったが、気づけない
    →　今までもそうだったので気づくしかない
  • プラットフォームごとに運用を見直した時期があったのだが、その時点になるとスプレッドシートに修正が必要になるため、プラス工数が発生する
    →　その時対応する人はスプレッドシート内の関数を理解していなければ対応が難しくなる

Tips

このままではエンジニアっぽいことをあまり書けていないので、今回GAS初心者が身に着けたGASとスプレッドシートのTipsを書いておきます。

  • Spreadsheet > ツール > スクリプトエディタで、js のような VBA のようなものが書けるエディタが開く
  • カスタムメニューをカンタンに作成できるので、コマンド生成などの処理はメニューから選べるようにしておく
  • データの取得とセルへの書き込みは処理終了後、まとめて配列で出力する方が処理コストが低い
    →　処理前後に時間を取るようにして、logger.logで出力して時間計測すれば、スクリプト書いている人だけ時間を気にしてチューニングできる（最初10分くらい返ってこなかった処理が配列工夫して数秒にできました） 
//処理前
var start = new Date();
//（処理略）  
// 処理後
var end = new Date();
var spend_sec = (end - start)/1000;
Logger.log(spend_sec+'秒かかりました');
  • Logger.logの出力はCtrl+Enterで窓が開いて見ることができる
  • １セルにコピーコマンドを書いたら文字数エラー（10000文字超えたらだめ？）ってのに引っかかった。そのままだと1行目に横にコマンドが並んでしまったので、下記転置を使って縦にコマンドを出力できるように工夫した 
function transpose_array(a) {
    return Object.keys(a[0]).map(function (c) {
        return a.map(function (r) {
            return r[c];
        });
    });
}
  • セルで、ゼロパディングは、text(N1,”00″)とする。（例はN1セルの数値を2桁で表示したい）
  • テキストとセルの内容をつなぎたいときは”で括ったテキストとセル表示を&でつなぐ（=”テキスト”&$A$1）
  • Excel同様 VLOOKUP やラベルも活躍できる
  • 入力規制でコマンド生成スクリプトに依存する場所を正しく入力させたりできた
  • 上記参照をうまく使って、cp コマンドでは作れないディレクトリ作成に対応するため、mkdir シートを作った（作業者は mkdir シートコマンドを実行して、コマンド生成スクリプトを実行し、出力されたコマンドを実行すれば作業完了な感じ）

他にも設定シートをローカライズしていけば各作業の効率化は図れると思われます。
Google Form も併用すれば入力箇所を限定的にすることで、更に効率化もできるとは思うのですが、今回の場合、開発しながら改修してというアップデートが多かったため、Google Form までは突っ込めませんでした。

さいごに。

今回は非エンジニア業務を工数削減してみた話だったのですが、スプレッドシートを用いて便利になるものって結構あると思います。

コピペなんて数秒の操作でも数百のコピーを GUI でとなるとかなり大変。CUI に改善しました。
こんな風なこと、めんどくさそうだなーとちょっとググっただけで解決できちゃうこともあるんです。

エンジニアの工夫と発想次第で仕事環境、ワークスタイルを最適化していきましょう！

このエントリーをはてなブックマークに追加