こんにちは、クリエイティブ室テーマパートのK.AとY.Tです。
みなさんはLINEをどんなデザインで使っていますか？
デフォルトのままのトーク画面は青空背景にモノクロベースのデザインですが、周りを見ると着せかえを使っていただいているユーザーが意外と多い印象です。
無料のブラウンやコニーの着せかえはもちろんですが、ありがたいことに有料の着せかえも多く利用されている様子。
そんな着せかえを作る仕事をしている、というと「実際どんなことしてるの？」とよく聞かれるんですね。

「LINE着せかえ」の仕事って？

実は、クリエイティブ室ではLINE着せかえのデザインだけでなく、スマートフォンで表示するためのリリースファイルを制作するところまで担当しています。

Q：デザイン以外になにをするのか？
A：デザインのデータ化からアップデートまで

着せかえをみなさんにお使いいただくためには、デザインから色やポジションを数値化してリリースできる状態にする必要があります。イメージとしては、WebのUIデザインをコーディングして組み立てるような工程ですね。
この作業を、「パッキング」と呼んでいます。
たくさんの画像、気が遠くなるような数のコード情報をパッキングして、ようやく一つの着せかえが産声を上げるのです。（実際にはiOSとAndroidの両方が必要なので双子ちゃんです)
最初の着せかえが生まれてしばらくは、このパッキングは手作業で行われていました。ユーザーの目には普段触れることが少ないエラー画面などにも、着せかえデザインは適用されています。
それを一つも漏らすことなく適用していくのは、繊細かつプロフェッショナルな知識が必要とされる地道で難しい作業です。

そうだ、自動化しよう……！

この困難をメンバーで乗り切ろう、そう一致団結した翌月にはすでに簡単な自動化が始まっていました。内部で進めるほうがスピード感を持って対応できるので、「ガンガンいこうぜ」とみんなを巻き込んで日々ブラッシュアップを繰り返します。

・プログラム経験者がいたこと
・反映スピードが早いこと
・得意分野を手分けしてできること
・かゆいところにも手が届く仕様にできること
・いつでも改修やメンテができること

様々な要因がありますが最高のメンバーに恵まれて進化をし続けた結果、2018年末ついにALPACAという名の自動化ツールが完成したのです。
JSX(Photoshop Script)で複数PSDファイルの数百箇所からコードに沿った値を抽出し、更にその情報をプレビュー画面で視覚的に確認することができ、吐き出したコードをそのまま制作に使えるという魔法のようなツールです。
以前は1日かかっていたパッキングの工程が、なんと今は5分で完成するようになりました。

そうして生まれた着せかえもすぐには独り立ちできません。そう、LINEは常にアップデートを続けて進化しているからです。新しいデザインや機能が搭載された環境に合わせて、着せかえたちがのびのびと適用されるように、デザインはもちろん企画や開発担当者と連携してアップデート対応をおこなっています。
アップデート関連業務にも、カラーテストツール等、部内で制作したツールが大活躍していますが、そのお話はまた後日......

クリエイティブな作業でも自動化、結構使えますよ。

ちなみにALPACAという名前ですが、ゴロがかわいいという理由でつけたところメンバーが後付けで"All Packing Automation"という読み方を考えてくれました。
このあたりもクリエイティブ？