シーエー・モバイルから、本日（2018年2月1日）、何やらエンジニアを幸せにする画期的なサービスが公開されるという情報が、技術広報デスクに飛び込んできました。その名は「Viron（ヴァイロン）」。辞書にも載ってない、謎めいた名前のサービスの全貌を明らかにすべく、早速取材して参りました！
取材参加者:
船ヶ山 慶（監督・以下fkei）、馬場（デザイナー）、岡田 徳貴（サーバサイドエンジニア）、大谷 剛（フロントエンドエンジニア）
ー Vironって何ですか？何ができるツールですか？
大谷： 一言でいうと、統一した操作性・ダッシュボードを備えた管理ツールプロダクトです。OpenAPI(Swagger)に対応したAPIを書くだけで、管理画面とダッシュボードを作ることができます。
デザインもフロントも実装の必要がありません。学習コストはOpenAPI(Swagger)だけ。これが使えるエンジニアが１人いれば大丈夫です。
ちなみに「Viron」っていう名前は、あのパン屋さんじゃなくて、僕らが好きなコーヒーショップの名前にちなみました（※ 綴りは異なります）。コーヒーみたいに優しく、身近な存在でありますように、って願いをこめています。
ー 開発の背景にはどんなねらいと、解決したい課題がありましたか？
fkei： ねらいは、管理画面を使う全てのIT企業をハッピーにすることです。
管理画面というのは、サービス運営に欠かせないものですが、ユーザーやクライアントの目に直接触れない”裏側”であるため、開発コストの承認が得づらかったり、人的リソース（主に、デザインとフロントエンド）の確保が困難だったりということが、過去あったようです。
そのような状況だと、エンジニアは、見た目とかユーザービリティとか汎用性まで熟考する余裕がなく、まずは最低限の機能実装を目指して作りますよね。
リリース時はなんとかそれで乗り切りますが、安定運用フェーズになると、運営者から「この項目を足して」「この商品の売上を比較したい」「この数値をグラフにしたい」など、次々に要望がよせられます。
でも、余裕がないため、そういった要望になかなか応えることができない。結果、管理画面の多くは「イケてない」まま使われ続けることになっていました。
そんな「イケてない」管理画面たちが、事業部やサービスの数だけあって、大小合わせると数十個。しかも、同じ社内でも統一が取れていなくて、それぞれ異なる画面構成とオペレーションルールが存在しているわけです。
これから事業をスケールさせていくフェーズに、この管理画面の問題は、きっと足かせになる、でもここでツールを作れば、すべて綺麗になる、と確信したんです。
ちょうどその時、2017年の2月頃でしたね、社内で事業アイディアを出し合う「深化会議」というのがあったので、僕らは技術による事業貢献案として、綺麗で使いやすい管理画面がサクッと作れるツールの開発を提案しました。そして案が通って、開発がスタートしました。
Vironを使って、事業責任者はコストをカットできてハッピー。エンジニアは時間をかけずにイケてる管理画面を作れてハッピー。運営者は使いやすいUIで仕事が捗りハッピー。そうなったらいいなと。そんな思いでVironの開発を進めました。
ー Vironはどんな技術が使われてますか？革新性があるとしたら、どんな点でしょう？
fkei： 最初にあった通り、OpenAPI(Swagger)に対応したAPIサーバーを書くだけで、フロントもデザインも学習コストもかけずに管理画面とダッシュボードができる点ですね。
おそらく、Swaggerを使って管理画面を作るっていう発想は、これまでなくて、部分的に機能が似たものでは、データを分析してグラフ化したりするサービスがあります。Vironはダッシュボードをつけたので、管理機能を使わず、グラフ作りのためだけに使うことも可能です。
使いやすさもポイントです。Open APIを使うことで、プログラムを、まるでドキュメントのように書くことができます。定義書を作成したら、管理画面も同時に完成してしまっている、というイメージです。
またサーバ側の言語は、javaでもNodeJSでもPHPでも使えるので、色々なエンジニアが使えます。そしてあらゆるサービスに使える広い汎用性も強みですね。
複数の管理画面を一元管理できるのも、複数サイトの運営をする側からしてみれば、かなり便利な構成じゃないかと思います。
それから作った管理画面が、スマホでも見られる点もメリットだと思います。緊急性の高い対応が必要なときに、オフィス外でも対応できるのは、今の時代の管理画面に必要な条件だと思います。
また、シーエー・モバイルは、これまでほとんどオープンソースを出してこなかったので、このタイミングに技術アピールも一緒にできたらなと（笑）。
ー 開発で苦労した点はありますか？
岡田：難しかったことは、管理画面は、データのアップロードを頻繁に行う画面なので、実際のサービスの画面にはない複雑さがあったことですかね。
例えば、商品コードと金額のデータの紐付けみたいな、複数の要素をリンクさせていく必要があるので、UIの見せ方も練らないとわかりづらさに繋がってしまうし。
デザイン面では、ユーザ向けサービスのデザインとは異なる難しさがあったみたいです。ここはデザイナー本人からどうぞ。
ー 管理画面をデザインレスで作るためのデザイン、どんな工夫をされましたか？
馬場： 管理画面は、見た目から与えられる印象がとても大きいです。
そのためプログラムの良し悪しだけでなく、見た目やカラー、形状の選択もその完成度に大きく影響してしまいます。
Vironは、そんなエンジニアの「見た目を考える労力」を少しでも減らし、本業のプログラミングに集中してもらえるように考えて作られました。
開発していく中で、デザインの自由度を高めることも可能でしたが、それでは大目的であるエンジニアの「見た目を考える労力」をカットできません。
なのでVironはレイアウトもカラーもパーツも、大枠で決めて絞り込んでいて、あらゆるものがテンプレート化されています。
それでもテーマ機能に関しては、画面全体の色を切り替えられる仕様にしました。それは、参照している画面が「本番なのか、テスト環境なのか」がひと目で分かることがとても重要だからです。
その判別がつきやすいよう、これまでもエンジニアがヘッダーの色を変えたり、色々工夫してくれていましたが、それもやはり「見た目を考える労力」になってしまっていると感じました。
同じ家で屋根の色だけ違うより、もういっそ「黒い家・白い家」ぐらい大きく変えてしまった方が、わかりやすいと思ったからです。
サービスロゴのデザインは、Vironの頭文字（V）とハートのダブルイメージになっています。「（エンジニアの）心（ハート）に寄り添うもの」になって欲しいという願いを込めました。
ー早く使ってみたいですね。Vironはどうやって入手できますか？
fkei：
本日（2018年2月1日）OSSで、GitHubで公開しましたので、見てみて下さい。
それから、Vironのデモもご用意しています。まずはデモ用のAPIサーバーを使ってVironに触れてみてください！
すでにシーエー・モバイル社内では、 Vironを複数のサービスで使い始めている模様。リリース後も、機能追加や改修を重ねていく予定だそうですので、ぜひ使っていただきフィードバックをいただければ幸いです！