cologne.
サロンの仕事を、シンプルに。
01・1-1・02をつないだ動くプロトタイプ。予約一覧の予約カードをタップすると、その予約の施術の詳細(1-1)に遷移します。左上の戻るでスケジュールに戻ります。フッターの「顧客一覧」で顧客一覧(02)に、「設定」で設定画面(04)に、「スケジュール」で戻れます。ドロワーメニューの「施術メニュー管理」で施術メニュー管理画面(07)に、「タグ管理」でタグ管理画面(08)に(各行からスキル/設備/顧客属性の各タグ管理画面へ)、そこで各メニューをタップするとその行の内容が入った施術メニュー詳細(#7-1)に遷移します。詳細を編集モードにして必要スキルの「タグを追加」を押すと、スキルタグ選択画面(#99-1)に、必要設備の「タグを追加」では設備タグ選択画面(#99-2)に遷移し、下部のボタンで選択内容が反映されます。顧客名・担当者・時間・メニュー・金額はタップしたカードに連動、画像はサンプル固定、予約メモは追加時の入力内容に連動します。+から予約・シフト・休憩・設備メンテナンスを追加できます。スタッフと設備を固定幅の列で表示し、シフト・休憩・メンテナンスはグリップとダイアログの両方で編集できます。設備予約は表示のみです。
{{ n.text }}
{{ n.by }}{{ t0_scheduleClosedText1 }}
{{ t0_scheduleCloseError1 }}
{{ t0_addDateSchedule1 }}
{{ t0_addErrorSchedule1 }}
{{ t0_resourceMaintenanceError1 }}
{{ t0_resourceDetailDate1 }}
{{ t0_resourceDetailError1 }}
削除してよろしいですか?
{{ t0_resourceDetailDescription1 }}
ここで入力する内容は、予約のための仮情報です。お客様情報の正式な登録は、ご来店時の初回カウンセリングで行います。
{{ t0_reservationError1 }}
ここで入力する内容は、予約のための仮情報です。お客様情報の正式な登録は、ご来店時の初回カウンセリングで行います。
{{ r0_reservationError1 }}
{{ group.emptyMessage }}
{{ q0_equipmentFormHelp5 }}
{{ q0_equipmentFormError5 }}
{{ q0_equipmentDetailMemo5 }}
休み
{{ s0_shiftError33 }}
例外シフトを設定した日
※ 定期シフトは「一覧」表示で変更できます。
この情報と、予約されたメニューに必要なスキルを照らし合わせて、対応できるスタッフを自動で割り当てます。
{{ mMemoS }}
オーナーとして招待したい方のメールアドレスを入力してください。
招待メールのリンクからアカウントを作成すると、このサロンのオーナーとして追加されます。
メンバーとして招待したい方のメールアドレスを入力してください。
招待メールのリンクからアカウントを作成すると、このサロンのメンバーとして追加されます。
{{ p0_managementError }}
初回カウンセリングに必ず含まれる項目です。
変更・削除はできません。
初回カウンセリングで確認したい質問を追加できます。
例:アレルギーの有無、ご希望の過ごし方
お客様に確認・同意していただく書類を管理します。
施術に合わせて、同意書を作成できます。
同意書名と同意内容を入力してください。
施術内容や経過を記録する電子カルテを管理します。
施術に合わせて、種類ごとに作成できます。
スタッフが施術内容や経過を記録する項目を追加できます。
例:使用した薬剤、施術後の状態
電子カルテ名を入力してください。
{{ p0_c21MemoDisplay }}
未登録から、認証・店舗作成・初回利用までを試す独立したデモ。店舗作成時にサンプル顧客1人と予約1件を追加します。画面右側のデモ操作でメール認証、招待、再ログインを再現できます。#0のデータには影響しません。
当日のタイムテーブル(0:00–24:00)。担当者ごとに固定幅の列を設け、横スクロールで表示。担当者名は上部、時刻は左側に固定。#5のシフトを参照し、勤務時間をスタッフ色の枠のあるカードで囲み、その内側に予約と休憩を表示します。シフトはこの画面では編集できません。担当者フィルタは複数選択でき、選択した担当者の列だけを表示します。右上のアカウントボタンから同一店舗のスタッフへ切り替えられ、中央のサロン名から選択中スタッフに紐づく店舗へ切り替えられます。店舗切り替え時はログインパスワードで再承認します。日付タップで月カレンダー、+から予約追加フォームを表示。既存顧客の選択・新規顧客の登録、担当者・メニュー・日時の設定ができ、同じスタッフの予約時間の重複は追加できません。指名は明るい赤の角丸四角の「指」マークと枠で表示し、担当者の背景色は維持。誕生月と重なる場合は、指名の枠の外側に金色の枠を表示します。初回施術は青い角丸四角の「初」タグと枠で表示。重複時は青枠の外に指名・誕生月の枠を重ねます。中村 涼さんを初回施術のサンプルに設定しています。予約データはサンプル。
{{ n.text }}
{{ n.by }}{{ scheduleClosedText1 }}
{{ scheduleCloseError1 }}
{{ addDateSchedule1 }}
{{ addErrorSchedule1 }}
{{ resourceMaintenanceError1 }}
{{ resourceDetailDate1 }}
{{ resourceDetailError1 }}
削除してよろしいですか?
{{ resourceDetailDescription1 }}
ここで入力する内容は、予約のための仮情報です。お客様情報の正式な登録は、ご来店時の初回カウンセリングで行います。
{{ reservationError1 }}
予約一覧画面(01)の予約カードをタップして開く詳細。顧客・メニュー・担当者・時間・金額・施術時の注意メモの確認と、各項目の編集と、下部にキャンセル導線。予約データはサンプル。上部の「予約情報」に予約日・時間・担当者・メニュー・金額・予約メモを行形式でまとめた試案。メニューはカット1つ。特記事項タグ(指名・誕生月・初回施術)はシステムが条件に応じて自動付与する想定で、手動の追加・削除は設けません。佐藤ひかりさんは6回目のため、初回施術は非該当。顧客属性タグはスタッフが設定する情報として別の行に表示し、この画面には追加ボタンを置きません。電話番号の下にメールアドレスとメールボタンを表示。電話・メールの起動は未接続。「いつも注意すること」は顧客詳細の備考メモに統合し、お客様セクションのタグの下に表示する想定。関連書類は初回カウンセリングシート・施術同意書・電子カルテの入口のみ表示。遷移先は共通画面#99-4・#99-7・#99-12へ切り出し、この画面からは遷移しません。顧客は佐藤ひかりさんのまま。
ここで入力する内容は、予約のための仮情報です。お客様情報の正式な登録は、ご来店時の初回カウンセリングで行います。
{{ e11_reservationError1 }}
1-1の右下のボタンから開く画面。上半分が施術前、下半分が施術後。背景は黒。
1-2と同じ機能を横向きのレイアウトで。左半分が施術前、右半分が施術後。背景は黒。端末は縦向きのまま、表示だけ90度回転した状態。
縦向き固定。施術前を下地に、施術後を上に重ねて表示。下部のスライダーで施術後側の不透明度を調整でき、0%で施術前、100%で施術後だけが見えます。スライダーは実際に動きます。
顧客のリスト。ヘッダーに検索バー(名前・かなの部分一致)を置き、並び替えと絞り込みはその下の2つのアイコンに集約。並び替えボタンはタップでプルダウンメニュー(.menu形式)が開き、五十音・誕生日(月日順)・来店回数・最終来店と昇順/降順を選択(現在の条件はボタン内に表示)。絞り込みアイコンからボトムシートを開き、五十音(行)・誕生月・性別を複数選択で絞り込めます。条件数はアイコンのバッジに表示。+ボタンで初回カウンセリングシート入力の確認ダイアログを表示します。OK・キャンセルの動作は未接続。行タップの遷移は未接続。顧客データはサンプル。
スタッフを1列のカードで表示し、役職は各カードのタグで表記。「本日出勤」は初期状態オフ。オンにすると、基準日2026年8月28日に勤務シフトがあるスタッフだけ表示します(勤務開始前・休憩中も対象)。名前・アイコン色はスケジュールの担当者と対応。各カードの遷移先と招待の導線はまだ未接続。
未着手。
オーナーとして招待したい方のメールアドレスを入力してください。
招待メールのリンクからアカウントを作成すると、このサロンのオーナーとして追加されます。
未着手。
メンバーとして招待したい方のメールアドレスを入力してください。
招待メールのリンクからアカウントを作成すると、このサロンのメンバーとして追加されます。
03の各行からの遷移先。名前・スタッフ画像・役職・メールアドレス・備考メモを表示。画像はプレースホルダー(右下のボタンで変更する想定)。
休み
{{ shiftError33 }}
例外シフトを設定した日
※ 定期シフトは「一覧」表示で変更できます。
この情報と、予約されたメニューに必要なスキルを照らし合わせて、対応できるスタッフを自動で割り当てます。
{{ mMemo }}
フッター「設定」タブの遷移先。営業時間・定休日、顧客画像の自動設定は「アプリ機能の設定」にまとめ、外部サービス連携やセキュリティなどは用途ごとに分けています。開店・閉店時間はタップでMaterialの時刻選択ダイアログが開き、ダイヤルまたはキーボード入力で指定できます。各項目の遷移先は未接続。
設定画面「営業時間」の遷移先。日曜日から土曜日まで、曜日ごとに開店時間と閉店時間を設定します。時間をタップで時刻選択、左上の戻るで設定画面へ。遷移・選択処理は未接続。
設備管理フェーズ1。種類・台数の追加/変更と、個々の設備の本日の利用・メンテナンス予定を確認できます。「本日」は2026年8月28日、現在時刻は14:20のサンプル。#1の設備・予約データに連動します。タブの変更と#0への反映は後続フェーズで行います。
{{ group.emptyMessage }}
{{ equipmentFormHelp5 }}
{{ equipmentFormError5 }}
設備一覧の各カードから確認する詳細画面。設備の基本情報、本日の利用状況、メンテナンス予定、管理メモを表示・編集します。
{{ equipmentDetailMemo5 }}
戻るボタンとタイトルのみのツールバーを持つ空の画面。中身はこれから設計します。
戻るボタンとタイトルのみのツールバーを持つ空の画面。中身はこれから設計します。
施術メニュー管理から1件を開いた画面。中身はこれから設計します。
施術メニュー管理の右下の+から開く新規追加画面。項目は詳細画面の編集モードと同じ並びで、すべて空の状態から入力します。
まず編集対象の種類(スキル/顧客属性)を選ぶ入口画面。選んだ先の一覧はこれから設計します。
タグ管理から「スキルタグ」を開いた画面。右上の選択で複数選択、+で新規作成(色の指定あり)。
タグ管理から「顧客属性タグ」を開いた画面。右上の選択で複数選択、+で新規作成(色の指定あり)。
書類フォーマット管理の入口。初回カウンセリングシート・施術同意書・電子カルテの3種類を選びます。右隣に#9-1〜#9-3を配置。画面遷移は#0で確認できます。
初回カウンセリングに必ず含まれる項目です。
変更・削除はできません。
初回カウンセリングで確認したい質問を追加できます。
例:アレルギーの有無、ご希望の過ごし方
改訂情報はバージョン1・2026/09/01のサンプル表示。#2-4の7項目を必須項目として固定。お店独自の質問は、この見本内で追加・編集・削除できます。変更は再読み込みで戻ります。画面遷移・保存・記入画面への反映は未接続。#0には未反映。
お客様に確認・同意していただく書類を管理します。
施術に合わせて、同意書を作成できます。
同意書名と同意内容を入力してください。
同意書のひな形を管理する見本。3件のサンプルには名称・管理用の説明・版・制定日を設定。本文は空欄。各行から編集、+から追加ができます。同意書名は新規作成時のみ入力でき、既存書類では変更できません。版・制定日は入力欄の上に配置。既存の同意書は編集画面の一番下で削除できます。既存書類は「更新」で版が1つ上がり、制定日が更新日になります。新規作成は第1版。改訂履歴の保存は未実装。保存・削除はこの見本内のみで、再読み込みで戻ります。お客様の署名・同意記録や#0とは未接続。
施術内容や経過を記録する電子カルテを管理します。
施術に合わせて、種類ごとに作成できます。
スタッフが施術内容や経過を記録する項目を追加できます。
例:使用した薬剤、施術後の状態
電子カルテ名を入力してください。
3種類の電子カルテを管理する見本。一覧から編集、+から追加ができます。名前は新規作成時のみ入力でき、既存の名前は変更できません。説明・独自項目は種類ごとに編集できます。更新でバージョンが1つ上がり、制定日が更新日になります。記入項目はお店独自の項目のみで構成します。保存・更新・削除はこの見本内のみで、再読み込みで戻ります。改訂履歴の保存・記入画面への反映は未接続。#9-1や#0とは独立。
初回起動の入口。新規ユーザーと既存ユーザーの行き先を分ける。
サロンの仕事を、シンプルに。
デザイン確認用。画面遷移・認証・送信・保存は未接続。
既存ユーザー向け。ログイン後は所属店舗の有無に応じて案内する。
登録済みのアカウントでログインしてください。
デザイン確認用。画面遷移・認証・送信・保存は未接続。
店舗・役職の指定はここでは行わない。招待リンクから来た場合も共通の入力画面。
まずは、あなたのアカウントを作成します。
店舗の作成・参加は、このあとに行えます。
招待を受けている方は、招待メールが届いたメールアドレスで登録してください。
デザイン確認用。画面遷移・認証・送信・保存は未接続。
Firebase Authenticationのメール確認待ち。メール内のリンクで認証後、アプリに戻って認証状況を確認する。
次のメールアドレスに、確認用のリンクを送りました。
メール内のリンクを開いて認証を完了したら、このアプリに戻り「認証を完了しました」を押してください。
メールが届かない場合は、迷惑メールフォルダや入力したメールアドレスをご確認ください。
デザイン確認用・Firebase未接続。ボタンは未認証時も押せる想定。押下時にUser.reload()後のcurrentUser.emailVerifiedを確認し、認証済みの場合だけ次へ進む。未認証時はメール内のリンクを開く案内、通信失敗時は再試行の案内を表示する。確認中は連打を防止する。戻る場合もFirebase上のアカウントは作成済みのため、新規作成を繰り返さない。
#10-3で認証済みを確認した後の見本。所属店舗がない場合の、店舗作成・招待参加の案内。
メールアドレスの認証が完了しました。
続いて、利用する店舗を設定しましょう。
店舗を作成すると、その店舗のオーナーとして利用できます。
招待メールのリンクから、店舗に参加できます。招待が届いていない場合は、お店のオーナーにご確認ください。
デザイン確認用。認証・画面遷移・店舗作成は未接続。認証後の未所属ユーザーを想定。招待リンクから登録を開始した場合の招待情報の引き継ぎは、別途設計する。
#10-4の状態で招待メールのリンクを開いた場合の見本。店舗と指定された役職を確認して参加に同意する。
次の店舗に招待されています。
店舗名と役職をご確認ください。
この店舗に、メンバーとして参加します。
デザイン確認用。招待先とログイン中のアカウントが一致し、有効な招待を受け取った想定。役職は招待元が指定する読み取り専用の情報。オーナー招待では役職と参加説明をオーナーに置き換える。「今は参加しない」・閉じる操作は招待を辞退・削除せず#10-4へ戻る想定。画面遷移・参加処理は未接続。
#10-4の「新しく店舗を作成」から開く想定。店舗名と種類を指定し、オーナーとして店舗を作成する。種類に応じた初期設定を用意する。
新しい店舗を作成して、オーナーとして利用をはじめます。
デザイン確認用。店舗名・店舗の種類は必須の想定。種類に応じて施術メニュー、スキル・顧客属性タグ、初回カウンセリングシート・施術同意書・電子カルテのひな形を用意する方針。種類別の具体的な内容と「その他」の初期設定は今後設計する。既存アカウントがオーナーとして店舗を作成する。入力・種類の選択のみ操作可能で、初期データ生成・入力検証・保存・画面遷移は未接続。
既存の営業時間設定と同じ曜日別のUI。開店・閉店時刻と定休日を設定し、次にオーナーの定期シフトを設定する。
曜日ごとの開店・閉店時刻と定休日を設定してください。
見本内で設定可能。初期値は毎日10:00〜19:00、定休日なし。既存設定とは独立。保存・画面遷移・#0への反映は未接続。
スタッフ詳細の定期シフト一覧と同じUI。曜日をタップして勤務時間を編集する。
休み
{{ ob108shiftError33 }}
お店の営業時間をもとに、定期シフトを設定しています。勤務時間や休みが異なる曜日をタップして変更してください。
#10-7の営業時間・定休日を初期シフトとして使用。変更・キャンセル・休みの設定はこの見本内のみ。休憩は今日の予定で設定。店舗作成・保存・画面遷移・#0への反映は未接続。
店舗作成後の任意設定。店舗専用の予約取り込み用メールアドレスを案内する。設定を後回しにしても今日の予定へ進める。
予約通知の受信先に次のメールアドレスを設定すると、ホットペッパーなどの外部サービス経由の予約を、このアプリに自動で取り込めます。
メールアドレスは、設定画面の「外部サービス連携」からいつでも確認できます。
デザイン確認用。アドレスはサンプルで、コピー・予約取り込み・画面遷移は未接続。両ボタンとも今日の予定へ進む想定で、連携成功を判定するものではない。外部サービスごとの受信先設定手順と対応範囲は本実装前に確認する。定期シフトから期限なく勤務予定を算出し、個別日の例外を優先する方針。
スタッフ詳細や施術メニュー詳細から呼び出す共通画面。登録済みのタグをタップでON / OFFして複数選択する。
施術メニュー詳細から呼び出す共通画面。選択は#99-1と同じON / OFF。タグの登録時のみ、サロンの設備数を紐づける。
顧客のカルテから呼び出す共通画面。登録済みの顧客属性タグをタップでON / OFFして複数選択する。
記入済みの内容を閲覧する共通画面。バージョン・制定日・記入者・日時を表示。内容は編集不可。青木 結衣さんのサンプル。#1-1・#99-15からの遷移と、呼び出し元に戻る操作は未接続。#0には未反映。
初来店のお客様が基本情報とご要望を記入する画面。記入完了・左上の閉じるボタンで、端末返却の案内とスタッフ用パスコード入力を表示します。
試作用パスコード「1234」で解除すると、入力内容を保ったまま記入画面に戻ります。保存・本番認証・他画面との連携は未接続。#0には未反映。
スタッフが記入内容を確認し、顧客画像・顧客属性タグ・備考メモを追加設定して、顧客情報に反映するための画面。
中村 涼さんの記入内容を表示した独立した見本。備考メモは入力でき、ご要望・気になることの全文をコピーできます。写真・タグの設定、顧客一覧への反映、#99-5との連携は未接続。#0には未反映。
種類ごとに記入済みの最新の版を表示する同意書一覧画面。各行・+ボタンからの画面遷移は未接続。閲覧画面は#99-8、同意書選択画面は#99-9に独立して配置しています。青木 結衣さんのサンプル。#1-1・#99-15からの遷移と、呼び出し元に戻る操作は未接続。#0には未反映。
#99-7の各行から開く想定の閲覧専用画面。記入時点の同意書本文・版・制定日・記入日時・署名を表示します。青木 結衣さんの施術同意書(第2版)の見本。#99-7からの遷移と、戻る操作は未接続。#0には未反映。
#99-7の+から開く想定の同意書選択の見本。#9-2の同意書と青木 結衣さんの記入履歴を照合し、未記入の種類・更新された版のみ表示します。複数選択できます。「同意書を表示」の遷移・記入処理は未接続。#99-7からの遷移と、戻る操作は未接続。#0には未反映。
お客様用の同意書記入画面。2種類を選択した見本です。同意チェックと手書き署名で記入を完了でき、端末返却の案内とパスコード入力を表示します。「書き直す」で署名を消去できます。試作用パスコード「1234」で解除すると記入画面に戻ります。#99-9の選択内容との連携・画面遷移・保存・本番認証は未接続。本文はデザイン確認用のサンプル。#0には未反映。
#99-10と同じ構成で、スタッフが同意書の本文・同意チェック・署名を確認する画面。
#99-10の記入完了後、スタッフがパスコードを解除して確認する想定の見本。2種類の同意書を記入済みとして表示し、本文・同意チェック・署名は編集できません。署名は青木 結衣さんの固定サンプルを共通の署名欄に1つ表示。同意書一覧への反映、他画面との連携は未接続。#0には未反映。
顧客ごとの全種類・全バージョンの記録を作成日時順に表示する共通画面。行をタップして詳細へ進み、記録内容を編集できます。作成情報を保持し、最終編集者・日時を更新します。青木 結衣さんのサンプル。#1-1・#99-15からの遷移と、呼び出し元に戻る操作は未接続。#0では顧客に紐づけた作成・閲覧・編集の操作を接続済み。
スタッフが記入する電子カルテを複数選択する見本。#9-3に登録された電子カルテの最新版を表示し、過去の記入状況にかかわらず選択できます。選択数に応じて「記入に進む」が有効になります。戻る操作・記入画面への遷移・保存は未接続。#0では顧客に紐づけた作成・閲覧・編集の操作を接続済み。
スタッフ向けの入力見本。施術カルテとカラー施術カルテの2種類を選択した想定で、記録項目は入力できます。記入項目はお店独自の項目のみで、予約には紐づけません。項目はサンプルです。#99-13の選択内容・#9-3の項目設定との連携、キャンセル・保存処理は未接続。#0では顧客に紐づけた作成・閲覧・編集の操作を接続済み。
{{ c21MemoDisplay }}
#02の顧客一覧と#1-1の施術詳細から共通で開く顧客詳細画面の見本。青木 結衣さんの基本情報・関連書類・顧客属性タグ・来店情報・備考メモを表示。右上の「編集」で基本情報・メモの変更とタグの削除ができます。変更はこの見本内のみで、再読み込みで戻ります。関連書類の遷移先は共通画面#99-4・#99-7・#99-12へ切り出し、この画面からは遷移しません。編集モードでは関連書類を非活性にします。呼び出し元からの遷移・戻る操作・写真の変更・タグ追加は未接続。
過去の検討案として保管している画面です。
顧客一覧の+から、下から上がるフルスクリーンカバーで開く想定。#7-2と同様に空欄から入力します。左上はキャンセル、右上は追加。開いた状態のデザイン見本で、開閉・登録・写真変更・タグ選択は未接続。#0には未反映。
お客様による個人情報の入力を始める前に、スタッフが表示する同意書の種類を選ぶ画面。複数選択できる独立した見本です。同意書は#9-2と同じ3種類のサンプルを表示。閉じる操作・#2-4への遷移・選択内容の引き継ぎは未接続。#0には未反映。
お客様ご自身にご記入いただく電子カルテ。基本情報とご要望のみをご記入いただきます。お客様用の閉じるボタンは設けず、写真・タグの設定も表示しません。下部の「同意書の記入に進む」から、#2-3で選んだ同意書の記入へ進む想定です。同意書記入画面は#2-5に配置。画面遷移・登録処理は未接続。#0には未反映。
お客様用の同意書記入画面。2種類を選んだ状態の独立した見本で、本文はデザイン確認用のサンプルです。同意チェックと手書き署名を入力すると完了でき、返却案内を全面表示します。指・ペン・マウスで署名でき、「書き直す」で消去できます。署名はこの画面内だけで保持し、#2-6とは連動しません。試作用パスコード「1234」で解除すると、この見本では記入画面に戻ります。#2-3との連動・画面遷移・保存・本番認証は未接続。#0には未反映。
スタッフ用の確認画面。#2-5の同意書記入を完了し、パスコードを解除した後に表示する想定の見本です。画面遷移は、後で#0に実装する想定です。「お客様の記入書類」に#2-2と同じ電子カルテ・施術同意書の行を配置。タップすると閲覧専用画面が開き、電子カルテの回答や同意書の本文・同意状況・署名を編集できない形で確認できます。追加設定項目のスタッフ用メモは編集可能。署名は固定の手書き風サンプルを表示し、#2-5とは連動しません。写真変更・タグ選択は未接続。「顧客情報を反映」による保存処理は未接続。#0には未反映。