重なった予約カードは、指を離してから前へ出す

キャストのスマホに出す今日の予定は、1分を1.1ピクセルで描いている。60分の予約なら高さ66ピクセル。 その帯に、時刻とお客様の名前とボタンを詰めてある。 時間に正直な絵なので、予約どうしの時間が重なれば、カードも重なる。

キャスト画面のタイムラインを2枚並べた図。左は20:00〜21:30の予約カードの下半分に21:00〜22:00のカードが重なり、到着予定やお預かり額が隠れている。右は上のカードをタップした後で、20:00〜21:30のカードが枠つきで最前面に広がり、到着予定・90分・行き先・「¥24,000 お預かり」まで読める
左がタップ前、右がタップ後。20:00 の予約に 21:00 の予約がかぶって、下半分が読めなかった(画面はデモデータです)。

延長が次の予約に食い込んだ日や、予定が詰まった日にこうなる。後ろの予約が上にかぶさり、先の予約は頭の2行しか見えない。 到着予定も、行き先も、お預かりの金額も下に隠れる。いちばん読みたい日に、いちばん読めない。

触ったカードを前へ出す。ただし指を離してから

直し方は単純で、触ったカードを最前面に出すことにした。高さの制限を外し、短い予約のときに削っている行も戻して、中身を全部見せる。 位置は動かさない。カードの上端が開始時刻、という約束まで崩すと、今度はタイムラインが読めなくなる。 もう一度タップすれば元に戻る。戻せないと、広がったカードが下の予約を隠したままになるからだ。

はまったのは「いつ前へ出すか」だった。指が触れた瞬間に切り替えるのは、反応は速いがうまくいかない。 カードが広がると中のボタンが動くからだ。押そうとした指の下からボタンが逃げて、最初のタップが空振りする。 それで、切り替えは指を離したとき、つまりタップが成立したときに変えた。ボタンやリンクを押したのなら、その操作を優先して、前へ出す切り替えはしない。

このデリヘル管理ツールのキャスト画面は、スマホで見る前提で作っている。 幅390ピクセルの画面で、隠れたカードをタップして全部読めること、広げても横にはみ出さないこと、中のボタンを押しても勝手に閉じないことは、E2E テストにして残した。

重なりそのものは消していない。時間が重なっている、という事実は絵に残したまま、読みたいほうを選んでもらう。