アプリ / 店内注文・厨房・会計
寿司オーダー
システム
選ぶ、つくる、届ける。
一つの注文を、3つの画面で。
写真付きのメニューから寿司を注文し、厨房で調理・提供、管理画面で会計まで進められるデモです。客用・厨房・管理を切り替えて、お店の一連の流れを体験できます。
デモを試すブラウザごとに独立した仮想店舗を使います。注文や編集はほかの訪問者に影響せず、入口から初期状態に戻せます。
食べたい一皿を、
迷わず選べる。
48商品の写真と税込価格を掲載し、カテゴリと種類で絞り込めるようにしました。商品詳細で数量を選び、カートで内容を確かめてから注文します。送信した商品は受付・調理中・提供済の状態で確認できます。
次につくるものが、
ひと目で分かる。
厨房では卓番号、商品、数量、経過時間をカードにまとめました。握り・揚げ・ドリンクなど提供場所で絞り込み、調理と提供の状態を更新します。品切れの変更も客用メニューへ反映されます。
注文のあとも、
会計までつながる。
卓の状況と伝票を確認し、会計を完了すると客用画面も閉卓状態に切り替わります。商品編集、呼び出し対応、品切れ、売上レポートを試せます。公開デモのスタッフ・端末・店舗設定は閲覧用です。
小さな画面でも、
写真も操作も見える。
スマートフォンではカテゴリを折り返し、商品を縦に並べます。追加後は画面下のカートボタンから注文内容へ。管理画面の一覧は項目名付きのカードに切り替え、編集や会計のボタンが横に隠れないようにしました。
制作情報
- 種別
- 自主制作・店内注文デモ
- 制作範囲
- 画面設計・実装・スマホ対応・公開
- 使用技術
- React / TypeScript / Vite
NestJS / Prisma / SQLite
WebSocket - 対応画面
- PC・タブレット・スマートフォン