CASE STUDY / 多言語旅行プラットフォーム
TTR 天天楽
韓国語・中国語・英語に対応する旅行プラットフォーム。ユーザーWebと管理者機能をフルスタックで開発し、Capacitorを使ってAndroidハイブリッドアプリへ拡張しました。
多言語で旅行商品を探すWebサービス
TTR 天天楽は、旅行商品の詳細、日程、価格、日付・人数の選択と予約関連UIを備える旅行プラットフォームです。ユーザー向けWebと管理者機能を構築しました。
UI/UXからWeb・データ・アプリのビルドまで
UI/UXとフルスタック開発を担当しました。React・Meteorによる画面とサービスの実装、MongoDBのデータ管理、外部API・データ連携を経験しています。
既存のWebサービスをCapacitorによるAndroidハイブリッドアプリに拡張し、Android Studio・Gradleを使ったビルドを行いました。
TRAVEL PLATFORM
商品を理解し、条件を選ぶ体験
旅行商品の詳細
商品情報、日程、価格を確認できる詳細画面を実装しました。
日付・人数の選択
旅行日と参加人数を選択するUIを構築しました。
予約関連UI
商品情報と選択条件を扱う予約関連の画面を実装しました。
サービスの対応言語を広げる
韓国語・中国語・英語に対応する旅行サービスを提供しました。多言語の商品コンテンツを扱うユーザー向け画面と、管理者機能を開発しています。
ユーザーWebと管理者機能をつなぐ
旅行商品を閲覧・選択するユーザーWebと、サービスの情報を扱う管理者機能を実装しました。MongoDBを用いてデータを管理し、外部API・データとも連携しています。
WEB → ANDROID HYBRID APP
WebサービスをAndroidアプリへ拡張
Webの実装を起点として、Capacitor経由でAndroidプロジェクトを構成し、ビルドする流れです。
Web Service
Meteor・Reactによる既存の旅行Webサービスを起点にします。
Capacitor
WebサービスをAndroidハイブリッドアプリとして扱える形へ拡張しました。
Android Project
Capacitorを使ってAndroidプロジェクトを構成しました。
Android Studio / Gradle Build
Android StudioとGradleを用いてAndroidビルドを行いました。
CapacitorによるAndroidハイブリッドアプリの構築・ビルド経験です。Webサービスを基盤に、アプリで利用できる環境へ拡張しました。
TECH CONTEXT
WebとHybrid Appを支える技術
- Meteor / React / JavaScript
- ユーザーWeb・管理者機能のフルスタック実装
- MongoDB
- 旅行サービスのデータ管理
- REST API
- 外部API・データとの連携
- Capacitor / Android Studio / Gradle
- Capacitorによる拡張とAndroid Studio・Gradleによるビルド
一つのWeb実装から、利用環境を広げる
多言語の旅行商品UI、管理者機能、データ・API連携を含むWebサービスを構築しました。
WebサービスをCapacitor経由でAndroidハイブリッドアプリに拡張する工程を経験し、Web実装とアプリのビルド工程の関係を学びました。