2014/03/04

Google Spreadsheetに#FFFF00などと色コードを入れたら自動で背景色をその色にする

最近またストーリーテラー期が来ているので今日は小説調です。

—— あれは先週のことだっただろうか。会社でミーティングに出ていた私は、いつものようにMacBook Airに向かって手を動かしていた。すると、ディレクターとデザイナーの雑談が耳に入ってきた。

「じゃあこのセルにこのキャラクターの髪色を指定する色コード入力しておきますー」

「おねがいします」

「入力した色コードが間違ってないか、入力した色コードの色に背景色が自動的に変わればいいのになー」

「そういうのって自動で出来ないんですかね…」

あまりにも何気ない会話だったのでそのままスルーしそうになったが、よくよく考えてみればこれはエンジニアの出番だ。

ということで、そのまま会話を聞いてないフリをしつつ少し考えて、条件付き書式を使うことを検討した。しかしそれはダメだ。たしかに条件付き書式を使えば背景色を変えられる。ただし任意の色コードに対してその色を背景色にするという要求を満たすには、1677万通りの条件付き書式を作成する必要がある。そんなことは考えたくないものだ。

前職ではExcelマスターっぽい仕事もしていたのでExcelだったらどうするかと考えてみたが、やはりVBAを書くことしか思いつかない。Google Spreadsheetでもそれっぽいことが出来るはずなので、Googleで背景色を設定する方法を調べてみた。そのものずばりのものは見つけられなかったが、類似案件としてGoogle Spreadsheet　任意の文字入力時に自動で背景色を変更という記事が見つかった。

「これで行けるな…。」サンプルのスクリプトに目を通した私はそう確信した。

テスト用のSpreadsheetにスクリプトを貼り付けてスクリプトを加工して試行錯誤すること10分、動くものができたところでちょうどミーティングが終わった。私は、会議室から出て行くディレクターを無表情で呼び止めた。

「キッシュちゃん、ちょっと。」

「なんですか?」

「あのさ… ここにさ… こうしてさ…」「＼ジャーン!／」

「おお! すごい!」

「あとで使い方教えます」

「ありがとうございます」

そのスクリプトが、これだ。

function onEdit(event) {
  rowColor();
}
function rowColor() {
  var range = SpreadsheetApp.getActiveRange();
  var col = range.getColumnIndex();
  var row = range.getRowIndex();

  value = range.getValue();
  if (value.indexOf("#") == 0 && value.length == 7) { // #xxxxxx で7文字!!
    range.setBackgroundColor(value);
    // 色の濃さを確認
    if (getChannelLevel(value) > 400) {
      range.setFontColor("#000000");
    } else {
      range.setFontColor("#FFFFFF");
    }
  }
}
function getChannelLevel(baseColor){
  baseColor = baseColor.replace('#', '');
  if (baseColor.length != 6){ return '#000000'; }
  var totalValue = 0;
  for (i = 0; i < 3; i++){
    channelValue = parseInt(baseColor.substr((i * 2), 2), 16);
    totalValue += channelValue;
  }
  return totalValue;
}

このスクリプトをコピーしたら、Google Spreadsheetのメニューから[ツール] → [スクリプトエディタ] と進み、新しいスクリプトを適当な名前で作成してエディタウィンドウにこのスクリプトを貼り付けて保存。Spreadsheetに戻ってどこかのセルに#FF00FFと入力すれば、自動保存の後自動的に背景色がピンク色になるはずだ。こうしてディレクターの悩みがエンジニアリングにより一つ解決した。

その日の帰り。電車で一日を振り返りながらこの件について今一度考えていた。

自分はエンジニアだからスクリプトを書けばそのぐらい解決できるだろうということは分かっていた。しかし、そう知っているのはよく考えてみればエンジニアだけだ。

ディレクター、デザイナーとエンジニアは持っているスキルが違う。自分は、自分が困ったときはエンジニアリングの力で解決してこれまで生きてきた。しかし、ディレクターやデザイナーはどうか。きっとエンジニアリングで解決できる悩みも解決できないまま、手のかかる作業を強いられている場面があったのではないだろうか。

「その程度だったらエンジニアリングで何とかなりますよ。」これは自分がこれまで多くのディレクターと話をするときに何度も言ってきた言葉だ。にもかかわらず、ディレクターやデザイナーが自動化できそうなことをがんばって手でやっている場面を目にすることは、やはり、ある。

自分の問題は、チームの問題。そう考えれば、チームで仕事をしているのであれば自分の問題や課題を共有して他のスキルを持ったチームメンバーの力で解決したほうがチームの力は強くなるはずだ。

もちろん、相談してくれるのが一番ありがたい。しかし、そもそもエンジニアリングでなんとかなるかどうかが分からないのであれば、そもそも相談するというアクションにつながらないのかもしれない。もしくは、自分の抱えている課題がチームの課題に対して小さいという考えもあるのかもしれない。しかし解決手段をエンジニアリングに求めるのであれば、解決にかかるコストを見積もることができるのはエンジニアだけだ。

やはり、「困ったときにエンジニアリングで解決できないか相談すること」と「エンジニアが立ち上がって自ら困っていることを聞きにいくこと」をそれぞれが行わなければ、個人の課題をチームの課題として解決することは出来ないのである。

もっと、もっともっとエンジニア以外の仲間たちが困っていることを聞いていかないといけないな…。そう内省した一日だった。

この物語はフィクションであり、登場する人物は架空の人物ですが、登場するスクリプトはちゃんと動きます。