アウトドアウェアの修復サービス「FiTOリペア」・アカウント管理サービス「FiTOアカウント」ウェブアプリ・サービスサイト

Creative Direction

今後もFiTOの新サービスが素早く展開できるように、マイクロサービスとして構築

FiTOは、縫製の自動見積りサービスとしてスタートしました。株式会社フクルさまからブランド・サービス開発、UIデザイン、フロントエンド実装のご依頼をいただき、2022年にリリース。その後すぐにFiTOのリペアサービスについてもご相談をいただき、同じブランドデザインを踏襲しながら、新たなサービスの開発・デザイン、制作をお手伝いしました。

FiTOリペアは「お気に入りの衣服をリペアして、長く大切に着る」というコンセプトをもとに、破損した衣服をリペアを依頼できるサービスです。

現在ではシェルジャケット、ダウンジャケット、ナイロンパンツなど、全7種類の衣服のリペアに対応しています。アイテムごとに詳細なリペア方法を選択することができ、今後も対応アイテムは順次拡充していく予定です。

FiTOリペアの特徴として、温室効果ガスを打ち消すためにリペアの過程で排出されるCO2を差し引きゼロにする「カーボン・オフセット」を実施しており、利用者は持続可能な服づくりに間接的に参加することができます。また、環境に貢献した証としてFiTOオリジナルの「カーボン・オフセット証明書」を発行しています。

neccoでは、FiTOというブランドやサービスが長く続くよう、フクルさまと一緒に丁寧に企画や設計、デザインを進めました。リペアサービスのウェブアプリケーションの制作からFiTOリペアの紹介サイト、ご利用ガイドなど、サービスの運用に必要なウェブサイトなども制作させていただきました。

FiTOは、今後も新サービスを素早く展開できるようにマイクロサービスとして構築しています。FiTOというブランドを軸とした見積もりとリペアのサービスの発展と新しいサービス展開を、とても楽しみにしています。じっくり着実に大きな構想を描き進んでいくフクルさんを、これからもデザインやエンジニアリングで支援できればと思います。

Web Design

FiTOらしい世界観で伝えるリペアサービス

FiTOリペアのサービス内容や特徴を、イラストを使い直感的に伝えられるようデザインしました。

リペアの工程や環境への取り組みは、Lottieアニメーションを使用することでよりわかりやすく表現しています。
また、ご利用ガイドもはじめての方でも安心してご利用いただけるよう、わかりやすさを重視した構成にしています。

FiTOらしい世界観で、楽しみながら知ってもらえるようなストーリー性のあるデザインを目指しました。

UI Design

大切な衣服を安心して預けられる、操作性と世界観を重視したウェブアプリケーション

FiTOリペアのUIデザインでは、大切なアウトドアウェアを安心して預けていただける体験を目指し、操作のしやすさ、わかりやすさを意識しました。オリジナルのイラストを使ったボタンや画面デザインは、直感的な選択をサポートしながら、FiTOの世界観や楽しさが自然と伝わる設計にしています。

FiTOアカウントでは、目的の情報に迷わずたどりつける情報設計を行い、グラフやイラストなどを用いて視覚的にも楽しんでいただけるよう工夫しています。フィトくんがアパレルと環境の関係について教えてくれるコンテンツもご用意しているので、ぜひチェックしてみてください。

Graphic Design & Illustration

リペア対応衣服の質感やディティールを直感的にわかりやすく伝えるイラスト

それぞれの材質が持つ質感が伝わるように、FiTOブランドのカラーリングを活かしながらクッション性や硬さ・柔らかさをイラストで表現。

キルティングやダウンジャケットはイラストでありながらどこかリアルさを感じさせる特徴的な立体感とバランスを目指しました。
カラーやアウトラインイラストでもリペアを検討する方が直感的に対象衣服を選べるように、同じカテゴリでも用途や性能が異なるジャケット類は、ディティールやシルエットを描き分けることで識別しやすいようにしています。

Contents Design

FiTOリペア・アカウントを通して、アパレルと環境について学べる体験を提供

リペアのサービスサイトやウェブアプリのコンテンツ設計、ライティングにおいては、安心してリペアサービスをご依頼いただけると同時に、カーボン・オフセットやサスティナブルな服づくりについても学べるように工夫しました。

サービスサイトでは、リペアの流れや対象となる衣服ついてご案内しながら、カーボン・オフセットやトレーサビリティについても楽しく学べる構成にしています。サービスや環境活動について詳しく知りたい方には、「ご利用ガイド」「環境への取り組み」「トレーサビリティ」ページもご用意しました。

FiTOアカウントのホーム画面では、FiTOくんがアパレルと環境課題について教えてくれるコンテンツも作成しました。「服づくりのどんな場面で、多くのCO2が排出されるんだろう？」「森林はどのくらいのCO2を吸収しているか、知ってる？」フィトくんからの投げかけきっかけに、環境負荷の少ない服づくりに興味を持っていただけるとうれしいです。

Web App Development

Next.jsを使用した軽快に動作するシングルページアプリケーション

フロントエンドのフレームワークにNext.js、状態管理にReduxを採用し、軽快に動作する操作性の高いシングルページアプリケーション（SPA）を制作しました。
以前に制作した「FiTO見積もり」のアプリケーション構造を引き継ぎつつも、株式会社リビルドさまにもご協力いただき、フレームワークやライブラリのバージョンアップ、ブラッシュアップを行い、より使いやすいアプリケーションになりました。

Website Development

Next.js + microCMS + Vercel のJamstack アーキテクチャを採用

フレームワークにはWeb Appと同様にNext.jsを採用しました。姉妹サービス「FiTO見積もり」と同様の軽やかで生き生きとしたトーンを盛り込みながら、持続可能な服づくりやリペアの魅力が伝わるよう、Lottieを活用したスムースなアニメーションを採用しています。
お知らせとご利用ガイド記事の投稿管理にはmicroCMSを採用し、姉妹サービスの投稿を同じCMS内で一元管理できるように構成しました。

Client Voice

未来に向けた戦略が、また一つ社会実装できました

FiTOプロジェクトの構想として、当初より多サービスを展開を想定していました。
neccoさんからの戦略提案として同じブランドでマイクロサービスを増やすことを前提にアーキテクチャを設計・構築していただいたことでスムーズに新サービスの開発に向けたコミュニケーションをとることが出来ました。「CO2排出自動算定」「カーボンオフセット付きアウトドアウェアリペアサービス」「個人の善意を可視化できるアカウントページ」「カーボンオフセット証明書」などなど。。。
世界的にも見ても先進的なサービスであると共に、専門的・学術的知識が必要でデリケートな表現を必要とする領域でもあるため、細部にわたりデザイン・UX/UIの調整をしていただきました。
また、随所に遊び心を加えてもらうことでFiTOらしい希望の持てる未来を表現してもらいうことが出来ています。
すべてはneccoメンバーみなさんの確かなデザイン力と技術力であるとともに、真摯な姿勢の賜物だと思いました。
これからもFiTOの根っこを一緒につくってください！

株式会社フクル
代表取締役　木島広