事故報告書テンプレートUI設計

担当範囲

・UI/UX設計
・情報設計
・ワイヤーフレーム作成
・デザインカンプ制作
・ドラッグ＆ドロップ機能の提案
・操作性改善提案

使用ツール

・Figma（UIデザイン・プロトタイピング）
・Adobe Illustrator（アイコン・UIパーツ制作）
・Adobe Photoshop（画像調整）

サイト概要

※上記URLの閲覧には認証が必要なため、必要に応じて個別に共有いたします。
介護施設職員向けの事故報告書テンプレート作成UIを設計。
入力項目が多く、操作や記載順に迷いやすい業務課題に対し、入力手順を思考順序に合わせて再設計しました。
さらに、ドラッグ＆ドロップ操作を自ら提案・実装することで、テンプレート作成の入力所要時間を約8割削減し、操作ミス軽減と業務効率化を実現しました。

ターゲット層

・介護施設で事故報告書を作成する現場職員
・報告内容を確認、管理する施設責任者・管理者

目的

・報告書作成にかかる入力負担の軽減
・記載漏れ・入力ミスの防止
・事故報告業務フローの効率化と標準化
・現場業務に馴染む帳票作成体験の提供

制作ポイント

・事故報告書は文字量・入力項目が多く、現場では記載ミスや作成負担が課題となるため、業務の思考順に沿った情報設計を重視
・施設 → 入所者 → 記録ジャンルの順で構成し、迷わず入力できる導線を設計
・登録済み項目をドラッグ＆ドロップで反映できる仕組みにより、入力作業と記載漏れを軽減
・情報量が多い帳票でも確認しやすいよう、拡張操作による表示UIを採用し視認性を確保

注目ポイント

設計で重視したこと

業務の思考順に沿った情報設計

施設→入所者→記録ジャンルの順で構成し、現場職員が迷わず入力できる導線を設計。事故報告書特有の複雑な入力フローを整理。

ドラッグ＆ドロップ機能を提案

登録済み項目をドラッグ＆ドロップで反映できる仕組みを提案。テンプレート作成の入力時間を約8割削減し、操作ミス軽減と業務効率化を実現。

情報量の多い項目の視認性確保

ドラッグ＆ドロップした登録済み項目の右下に拡張矢印を配置。押したままマウスを動かすことで要素が拡大し、見切れた項目名を全て確認できるUIを設計。

プロジェクトタイムライン

設計・制作プロセス

Phase 1 2025年11月

ヒアリング・課題調査

開発担当へのヒアリングを通じて、既存の事故報告書作成フローの課題を整理。入力項目の多さと記載順の複雑さが主な課題と特定。

Phase 2 2025年11月

情報設計・ワイヤーフレーム作成

施設→入所者→記録ジャンルの思考順序に沿った画面構成を設計。ドラッグ＆ドロップ機能の導入を提案し、入力フローを再設計した。

Phase 3 2025年11月

UIデザイン・デザインカンプ制作

Figmaでデザインカンプを作成。fontawesomeでUIパーツ・アイコンをダウンロードし、視認性と操作性を両立したデザインに仕上げた。

Phase 4 2025年11月

プロトタイプ・操作性改善提案

Figmaでインタラクティブなプロトタイプを作成。レビューを経て操作性の改善提案を実施し、現場職員が直感的に使えるUIへブラッシュアップした。

ペルソナ設計

対象ユーザーの設計視点

メインユーザー

佐藤由美（仮） 48歳・介護士／現場スタッフ

現場スタッフ記録業務が多い時間に追われている ITは最低限

■ 業務環境

介護施設のフロアで勤務。事故発生時に現場で報告書を作成する必要があり、業務の合間に記録業務をこなしている。

⚠︎ ペインポイント

入力項目が多くどこから書けばいいか迷う。記載漏れが多く上司から指摘されることがある。

◇ ゴール

素早く正確に報告書を作成して、本来の介護業務に集中したい。

サブユーザー

木村健司（仮） 52歳・施設長／管理職

管理職報告書確認業務あり標準化重視

■ 業務環境

複数スタッフが作成した事故報告書を確認・管理する立場。記載内容のばらつきや漏れへの対応に時間がかかっている。

⚠︎ ペインポイント

スタッフごとに記載内容がばらばらで確認に手間がかかる。記載漏れの指摘と修正依頼が繰り返し発生する。

◇ ゴール

報告書の記載を標準化し、確認・管理の負担を減らしたい。

カスタマージャーニー

体験設計の流れ

項目	認識	情報の入力	保存・送信	最終確認・完了
行動	事故発生後に報告書作成が必要と認識する	施設・入所者情報をドラッグ＆ドロップで反映し、事故内容を各セクションに入力する	入力完了後に保存し、施設長（最終確認者）に自動送信される	最終確認者が内容を確認し、問題なければ提出。修正が必要な場合は作成スタッフに通知される
感情	焦り・プレッシャー	負担感・迷い	負担安心・達成感（自分の作業は完了）	慎重・責任感
課題	手書きからデジタルへの移行で、どこに何を書けばいいかわからない	毎回同じ情報の手入力や、セクションが多く何をどこに書けばいいか迷いやすい	記載漏れや誤入力がないか提出前に不安になる	項目名が長いと表示が見切れ、最終確認者が内容を正確に把握しづらい場合がある
改善策	施設情報・入所者情報・記録内容の3カテゴリに整理し、入力の起点を明確化	登録済み情報のドラッグ＆ドロップ反映と、思考順序に沿ったセクション構成で入力負担を軽減	思考順序に沿った構成で入力しながら確認できるフローを設計し、記載漏れを抑制	拡張矢印を押したままマウスを動かすことで要素が拡大し、見切れた項目名を全て表示できるUIを採用。確認が不要なケースはそのまま提出。

改善前の課題

利用状況から見えたUX課題

手書き運用による属人化

既存の事故報告書は手書き運用のため、記載方法が職員によってばらばら。何をどこにどう書けばいいかわからず、記載内容の品質にばらつきが生じていた。

影響度高

手書きの入力負担と時間コスト

手書き運用のため毎回最初から記入する必要があり、施設情報・入所者情報など定型情報の記載にも時間がかかっていた。

影響度高

記載漏れ・ミスの多発

入力項目が多い帳票を手書きで埋めるため、記載漏れや誤記が頻発。最終確認者による確認・差し戻しが繰り返し発生していた。

影響度高

対応方針

UX設計で重視した点

思考順序に沿った情報設計でデジタル入力を整理

手書きでは属人化していた記載順序を、施設→入所者→記録内容の思考順序に沿って整理。何をどこに入力するかが一目でわかる構成にした。

ドラッグ＆ドロップによる入力効率化

手書きで毎回記入していた定型情報を、登録済みデータのドラッグ＆ドロップで反映できる仕組みを自ら提案・導入。入力所要時間を約8割削減した。

拡張表示UIによる情報確認の改善

ドラッグ＆ドロップした項目の右下に拡張矢印を配置。押したままマウスを動かすことで要素が拡大し、見切れた項目名を全て表示できるUIを採用。

迷わず入力できる段階的なフォーム設計

関連する入力項目をセクション単位で整理し、情報を段階的に入力できる構成を設計。記載漏れや確認ミスを防ぎやすいUIにした。

情報設計・デザインのポイント

WORKS

せいさくぶつ