要件は“従来のシステムと変わらない使い勝手”~レガシーシステムのリプレースに、JavaScriptライブラリ「Wijmo(ウィジモ)」 + Angularを採用

株式会社日本プロテック

株式会社日本プロテックは、BtoB向けのアプリケーション開発を得意とするSI企業である。Javaや.NETをプラットフォームとした開発を多く手掛けている。今回は、Silverlightで作られたシステムから、JavaScriptライブラリ「Wijmo(ウィジモ)」とAngularを利用したシステムへの移行について、早川様、荒井様、疋田様にお話を伺った。

開発概要
開発案件使用製品主な利用機能
SliverlightからJavaScriptアプリケーションへのマイグレーション
(販売管理、CRM)
WijmoFlexGrid、TreeView ほか

コンポーネントベースで作られた旧システムを、WijmoとAngularを利用し、同じコンポーネント単位でリプレース

ー はじめに、御社の事業内容についてご紹介いただけますでしょうか。

早川さま
弊社は、BtoB向けのWebアプリケーション開発を中心としたシステムインテグレーターです。主に製造業向けの、販売や生産、物流といった部分の基幹システムを開発しています。Java言語や、.NET FrameworkならC#やVBなどのメジャーな言語を使って開発を進めていますが、最近は単なるスクラッチ開発だけではなく、FlashやSilverlightの置換えをはじめとした、レガシーシステムのリプレース案件も手掛けています。

早川 誠さま
株式会社日本プロテック
代表取締役

ー Silverlightからの置換えの案件というのは、数として多いのでしょうか?

荒井さま
今回の案件は、他社ベンダーが作ったシステムが老朽化して…という相談でした。古くからお付き合いのあるベンダーさんだと新しい技術のキャッチアップができない…という話はお客さまからよく聞こえてきます。また、海外のシステムのほうがSilverlightからの移行案件は多いように感じますね。

荒井 光司さま
株式会社日本プロテック
執行役員
システム本部長

ー 今回ご紹介いただくシステムについては、SilverlightからJavaScriptを利用したWebアプリケーションへの移行ということで「Wijmo(ウィジモ)」をご採用いただいたとのことでしたが、Wijmoを採用するきっかけは何かあったのでしょうか。

疋田さま
我々としては、1からスクラッチで手作りしていくよりは、部品ごとに作っていったほうがバグが出る発生確率が少なくて済む、という考えです。今回は海外向けの販売管理システムのリプレースだったこともあり、まずは英語版のWijmoを採用しました。また、個人的な話になるのですが、私はTypeScriptが好きなんです。WijmoはTypeScriptで作られていて、型もしっかり用意されている…というところも採用のポイントでした。

荒井さま
フレームワークはAngularを選択しました。元のシステムはコンポーネントベースで作られていたので、もちろん言語は違うのですが、それを同じ単位で作りたかったんです。一番コードの書き換えが少なく、開発効率が良いものを…ということで検討した結果、Wijmoを利用するというところに落ち着きました。

疋田 直樹さま
株式会社日本プロテック
情報セキュリティ部
情報セキュリティグループ
システムエンジニア

お客さまの要望は“従来のシステムと変わらない使い勝手”

ー SilverlightとJavaScriptではまったく違うものになると思うのですが、お客さまへのアプローチはどのようにされているのでしょうか?

荒井さま
正直なところ、2021年のサポート切れに向けたリプレースなので、お客さまに対してのメリットがなかなか出ない部分ではあります。そうなるともう、置き換えにあたってどれだけ開発工数を削減できるのか…というところでの提案に尽きます。

疋田さま
お客さまは「今までと同じシステムで」という部分を強調されます。見た目はもちろん、使い勝手の部分でも「従来のシステムと同じものを」という要望でした。こちらは、購入したい部品を画面上で選択し、見積もり、購入リストに入れて発注までできるという海外の販売管理システムなのですが、WijmoのFlexGridやTreeViewなどを利用し、Silverlight版とほぼ同じものを作ることができました。

ー こちらのシステムは海外のお客さま向けということで英語版のWijmoを採用されたとのことですが、もう1つのシステムは日本のお客さま向けの対応ということで日本語版のWijmoを採用されていますよね。英語版Wijmoをきっかけに日本語版も採用いただいたのでしょうか?

荒井さま
はい、きっかけはその通りです。対象システムはSilverlightのFlexGridコントロール(※ComponentOneに収録)などを利用して構築されていました。こちらのお客さまも、既存の機能は落としたくない、むしろ元のシステムより良いものを、という要望でした。FlexGridのソートやフィルタの機能が優秀だったので、スクラッチ開発で同等のものを…となると技術的難易度が高く、機能を実現できるJavaScriptライブラリがWijmoしか無かった、というのも後押しのポイントです。

疋田さま
グリッドのコピー&ペーストは元のシステムには無かった機能でしたので、JavaScript版で実現できた時は喜ばれましたね。

ー 販売管理システムもCRMも、従来のシステムと同等レベルよりも高いものにできたということですね。お客さまからの反応はいかがでしたか?

荒井さま
移行前は「同じものを作ります」と提案しても信じてもらえなかったです。『どれくらい変わっちゃうの?』と不安の声を聞くこともありました。実際作ったら、機能は高くなっているのに見た目が同じすぎて「代わり映えしないね」と言われてしまいました(笑)でもそれは褒め言葉でもあって、移行後のお客さまの互換性や違和感、以前のシステムからの差異といったものは無かったという感想をいただいています。

移行にあたっての勘所と、Wijmoを利用した感想は?

ー 何件かSilverlightからの移行案件をこなされてきて、移行にあたっての勘所などはありましたか?

荒井さま
いえ、基本的にはすべて作り直しになるケースがほとんどだと思います。システムごとに細かい部分はそれぞれ違うので、コンポーネントを利用して開発工数を減らすということのほうが重要であると感じます。よっぽど納期と予算に余裕がない限りは、現行システムの作り方を踏襲していく方法が一番であるという結論です。

ー Wijmoを利用した感想について教えてください。

荒井さま
正直、もっと苦労するかなと思っていましたが、開発メンバーに聞いても「問題ない」と言っていました。すべてのコンポーネントでサンプルが用意されているので、それを見ればある程度使えると思います。Webサイトの資料も分かりやすかったです。

≫SilverlightからWijmo 5への移行(PDF)

疋田さま
個人的にOSSや他社ベンダーのライブラリも調査したのですが、海外製であることや「今後も継続したメンテナンスが望めるのか」というサポート部分の信頼性に不安がありました。お客さまは費用をかけてシステムに投資するわけですから、やはり『サポート切れ』のリスクを気にしています。30年コンポーネントを提供しているというところで、グレープシティの信頼性は高いと感じます。

ー E-mailサポートなども利用されたのでしょうか?

疋田さま
はい、利用しました。「FlexGridのこのメソッドの使い方が分からない」というような質問はもちろんなのですが、「こういうことがしたいんだけど、どうしたらいいですか?」という質問にも具体的に丁寧に答えていただけますし、回答も早いのでとても助かりました。

荒井さま
バグフィックスが早いのも嬉しいですね。いくつかのバグを弊社からご連絡させていただいたのですが、次のバージョンでは直っていました。これについてはお客さまへの説得材料としても使えるので、ありがたいなと感じています。

ー 改めて、Wijmoを導入したメリットについて教えてください。

疋田さま
一番は自作しなくて良い、という点だと思います。別の話にはなるのですが、グレープシティ製品を使いたくても使えずに自作しなければならない案件がありました。それはもう、地獄でした(笑)お客さまからしても、我々が1か月かけて自作するよりは、費用をかけてライブラリを利用したほうが安上がりになりますので、今後も利用を推進していきたいと思っています。

荒井さま
疋田が言ったとおり開発工数削減が一番ですが、あとはパフォーマンス面でもメリットを感じています。エンタープライズアプリだと、平気で300列、500列のグリッドで、何千件の行というのがあるのですが、そういう場合の表示のパフォーマンスも問題ないので、そこはメリットとして大きいですね。

品質と開発効率の向上を目指すために

ー 御社として今後チャレンジしていきたいことはありますか?

疋田さま
今回のシステムではAngularを利用したのですが、WijmoはReactやVue.jsもサポートされていますよね。そういうところにもどんどん手を広げていきたいと思っています。Angularのようにフルスタックが良い場合と、小回りが効いたほうが良い場合とで、最終的に弊社としてどれをスタンダードにするべきなのか、それは時間をかけて決めていきたいと思っています。

荒井さま
新しい仕組みを取り入れたり、新規案件でのアプリケーション開発というところには非常に魅力を感じますし、今後もどんどん挑戦していきたいです。できるだけWijmoを使って社内で開発して、いろんなお客さまに同じ環境で納品できるようになれば弊社の品質も上がりますし、開発効率も良くなるので、そこを目指していきたいです。

疋田さま
Wijmoマスターを増やしていく、ということですね。

ー お客さまによりそいながら、先進的な取り組みにもチャレンジしていくということですね。グレープシティも製品を通して、陰ながら応援させていただきたいと思います。本日はありがとうございました。


取材協力:2018年6月

株式会社日本プロテック

所在地本社
〒101-0044
東京都千代田区鍛冶町2丁目6-2
上野ビルディング7F
設立1982年12月
URLhttp://www.nihon-protec.co.jp/

ご紹介した事例内容をPDF形式でご覧いただけます。

PDF版をダウンロードする(723 KB/A4・2ページ)