こんにちは。ラクスルのDTPスクラムに所属する、サーバーサイドエンジニアの荒井です。 ラクスルでは、昨年、冊子のスピードチェック入稿をリリースしました！
今回は、ラクスルの一大プロジェクトだった、こちらの開発についてお話します。
冊子スピードチェック入稿とは
ラクスルは印刷物を扱うECサイトです。ユーザーに印刷用のデータをアップロードして頂き、印刷に適した形に変換する作業が必要です。 ラクスルでは、2つのデータ入稿方法を提供しています。
参考記事: スピードチェック入稿リリース秘話
全データ・全商品でスピードチェック入稿をご利用いただけるのが理想なのですが、まだまだ未対応なデータや商品があります。
このうち冊子は、データチェック待ち時間が平均7時間と長く、DTPオペレーターの作業コストも高い商材でした。スピードチェック入稿ではすでにチラシやパンフレットに対応しており、ページごとに分割すれば冊子も同じ要領でデータチェックができるのではないかという仮説がありました。結果的に、冊子スピードチェック入稿では最短3分で入稿確定ができるようになりました👏
機能
冊子の入稿では、面つけと呼ばれるページ並び替え処理が必要なので、従来1つだった変換処理を分割しています。
ファイルアップロード
ユーザーは最初にファイルをアップロードします。
冊子は複数ファイルで作成する人も多いので、マルチファイルアップロードに対応しています。
面つけ
アップロードしたファイルはページごとに分割され、サムネイルが表示されます。
ユーザーはブラウザ上でページを並べ替え、面つけのプレビューを見ることができます。
データチェック
面つけが決まると、全ページにデータチェックをかけてマージし、発注用ファイルを作成します。データによっては時間がかかることがあるので、ブラウザを閉じてもデータチェック完了時にメールで通知が受け取れ、結果の確認画面に遷移することができます。
技術スタック
サーバーサイドはRails、フロントはVue.jsで開発をしていて、Amazon S3経由でファイルをやりとりしています。
フロント
冊子スピードチェックでは、面付けされたページやスピードチェック結果などのstateを複数の画面をまたいで管理する必要があり、これをVuexを活用することで実現しています。
サーバーサイド：スピードチェック入稿サブシステム データチェックジョブ
スピードチェック入稿サブシステムでは、PDF変換用のワーカーが並列で動いていて、S3からファイルダウンロード・変換・変換後ファイルのS3アップロードをしています。
サーバーサイド：ECサイト データチェック完了ジョブ
データチェック完了通知のために、ECサイト側でデータチェック履歴を保持＆ジョブでデータチェック結果をポーリングしています。
開発プロセス
実際のスケジュールとしては下記の通り、半年弱のプロジェクトでした。
- 3月末 キックオフ
- 4月〜 プロトタイプ実装
- 6月頭 プロトタイプ結合
- 6月〜 本実装、運用系機能実装
- 9月中旬 リリース
キックオフ
大きなプロジェクトが始まるときには、必ず関係者を集めてキックオフをします。開発に関わるUX・UIデザイナー、プロダクトマネージャー(PdM)、エンジニアが集まって実現可能性を議論し、PdMが優先度をつけてファーストスコープを決めていきます。
日本では、冊子の入稿データをすべて全自動でチェックするサービスは他にありませんでした。 今回の開発では、面つけのUIについてはラクスル社内のUX・UIデザイナーがユーザーテストをして決めています。
スクラム・Pre IPM
ラクスルでは開発はスクラムチームで回しています。DTPスクラムもその一つです。 日々の運用タスクや小・中規模の開発も平行して走っているので、こういった大きな機能開発では特に、週に1度のIPMだけでは議論がしきれません。そこで、Pre IPMと称して、まだ機能の煮詰まっていない部分や、その先に検討すべき事項についてチームで集まって話し合います。
毎回、デザイナーやプロダクトマネージャーが作ったUIワイヤーフレームや、フロントエンジニアが作ったプロトタイプを見ながら議論することが多いです。
リリースまで
ラクスルでは、大きな機能のリリース前には、オペレーションチームでの受け入れ期間を設けています。実際にユーザーが利用するときに迷わないかなど、受け入れ期間中に上がってきたリクエストを踏まえて、リリースまでに必要な機能を追加したり、UIを調整しました。
ラクスルでは、絶賛エンジニア募集中です！
「仕組みを変えれば世界はもっとよくなる」
ラクスルでは、印刷・広告・物流の業務について解像度を深めながら、技術を使って課題を解決していきたい方をお待ちしています！是非一度オフィスに遊びにきてください！
