こんにちは．ストライプデパートメントでエンジニアをしている横山です．
ストライプデパートメント初の技術ブロクを書きます．内容はパーソナルスタイリングで開発を勧めているスタイリング作成画面についてです．

パーソナルスタイリングってなに？

パーソナルスタイリングは，経験豊富なプロのスタイリストがあなただけのためにファッションアイテムを提案(スタイリング)するサービスです．服の好みなどについてのアンケートに答えてスタイリングを依頼します．その後，スタイリストとチャットしながら細かい相談もできます．
アンケート内容やチャットでの会話内容を元にスタイリストがストライプデパートメントで販売中商品の中から，あなたに最適な組み合わせを提案します．お客様は提案された商品の全てもしくは一部を試着・購入することが可能です．(また同様に化粧品を提案するパーソナルビューティーアドバイスも行っております）

パーソナルスタイリングのアンケート画面(スマートフォン番)：

もっと迅速に，もっと的確にスタイリングするために

これまでの商品選択

2018年2月からサービスを開始して以来，順調にお客様からのスタイリング依頼が増えてきました．しかし，依頼が増えたためスタイリストがすべての依頼に迅速に対応しきれなくなってきたという問題がでてきました．（現時点で数日お待ちいただいているお客様，申し訳ありません．もうしばらくお待ち下さい）

新しいスタイリング作成システムを開発

システム的にも対応するためにスタイリストと相談しながら，新しい商品選択・スタイリング作成画面の開発を開始しました．これまでスタイリストは商品検索のためにお客様と同じ商品検索画面を使用しておりました．しかし，お客様とスタイリストでは商品選択の条件指定が異なる場合が多くあります．そこで，スタイリスト向けに特化したUIの商品選択画面・作成画面を開発することで，”迅速に商品を選択できる”　”的確に商品を選択できる”を目指します．

システム構成

システム，フレームワーク等は社内向けシステムということもありナウいものを積極的に採用することにしました．また，UI設計もエンジニアである私が作成に挑戦しました（あくまでも社内向けなので）．

フロントエンドでは，シングルページアプリケーション(SPA), vue.js, vue-router, vuex, vuetify．
バックエンドでは，GraphQL, AWS Lambda
( AWS LambdaはスタイリングのバックエンドAPIはじめ各所ですでに利用済みです. )

下記のようなシングルページアプリケーションだとよくある構成です．

データベースをラッパーするGraphQL APIはビジネスロジックを持たない汎用的なAPIにしたいので，ビジネスロジックはAWS Lambda及びフロントエンドに実装します．

出来上がった画面(まだまだベータ版)

一通り最低限の機能のみを実装できたため，スタイリストに試用してもらうことにしました．早速，「もっとXXXXな方がいい！」といった要望をいただいております．どんどん高速PDCAサイクルを回して期待に答えていきたいと思います．そしてお客様に早く最適なファッションアイテムを提案できることにつなげたいです．

今後の展望

展望は大きく2つです．

1つ目は，まだまだ足らないところ改修して，より使いやすいシステムにしていくこと．

2つ目は，アンケート回答内容を基に，人工知能的な手法を使ってスタイリストの参考になる情報を増やすこと．

現在はスタイリストがアンケート回答内容などを一つ一つ確認しながら商品を選択していますが，回答内容をベクトル化して，過去の提案やお客様の傾向と結びつることで，スタイリストが参考にできる情報を増やしていきたいと考えています．また，これはレコメンドエンジン等の改善にもつながると考えています．

一緒にファッション×テクノロジを盛り上げよう

ストライプデパートメントでは一緒にファッション×テクノロジで新しいライフスタイルを提案したいエンジニアを募集しています．まずは話を聞きに来てください．よろしくお願いします．