熊本市様 職員向けUI改善ワークショップを行いました
「利用者視点」でUI改善 市民ペルソナになりきってユーザーテスト
熊本市役所の職員向けに電子申請フォームのUI改善ワークショップを開催しましたので、その様子をレポートします。
開催概要
2024年7月10日(水) 会場 熊本市教育センター
参加者 熊本市の職員の皆様
所要時間 3時間（午前・午後で30名ずつ）
ワークショップの目的
今回のワークショップは、市民がより使いやすい電子申請フォームを目指し、職員が市民の立場でUIを改善するために実施しました。
テーマは「なりきる」
市民ペルソナになりきって
市民にとって申請しやすい申請フォームを
職員の皆さんで考えていきました。
当日の流れ
前半は「なりきる」練習として
・即興演劇
・ペルソナ作成
後半は「利用者になりきって」申請フォームを改善するため
・ユーザーテスト
・ペーパープロトタイピング
を行いました。
当日の様子
「なりきる」準備体操として
チームで「社長ごっこ」を行いました。
これをやりきると、チームで意見を出しやすくなります。
改善対象フォームの発表
「国民健康保険資格喪失手続き」の電子申請フォームを改善対象としました。
ペルソナを考える
このフォームを使う人は、どんな家族構成で、どういう状況でやってきているのか
思いをめぐらせてもらいます。
もちろん、家族構成を考えておくのは申請フォーム入力時に
いちいち家族の年齢設定で迷わなくするためでもあります。
ファシリテーターとして工夫した点は
2分間は個人で考えてもらい、次の2分にメンバーで共有して決める、といった
拡散と収束を短時間で繰り返して
みんなの意見を吸い上げつつ、短時間で形にする流れを作ったことです。
ユーザーテスト1回目
スマホで件のフォームにアクセスし、いざユーザーテスト。
被験者以外のメンバーは観察して、気になる点を付箋にメモしていきます。
ユーザーテスト後は、印刷しておいた同申請フォームの上に
気づきをメモした付箋（ふせん）を貼っていき
メンバーで気づきや改善案を協議していきます。
ペーパープロトタイプ
印刷した申請フォーム、付箋、ペン、ハサミを駆使して
ペーパープロトタイプを作成。
ハサミで思い切り削ったり、説明図を入れたり、入力の流れを変えたり
みなさん積極的に改善していました。
ユーザーテスト2回目
ペーパープロトタイプを使ったユーザーテスト。
テストしながら、同時進行で改善しているチームもあったり
とても前のめりに改善されていて、見ている私たちも胸が熱くなりました。
ナイスUI評価
自分のチームや他チームのプロトタイプを評価。
「いいね！」「ナイスUI」「よくできました」を付箋に書いて
互いの健闘を褒め合いました。
ワークショップ終了後
電子申請フォームの改善サンプル
今回題材にした電子申請フォームとは別のフォームを題材に
私達が改善した、具体的な改善サンプルをご覧いただきました。
申請受付後の職員の運用フローを考慮すると、質問項目数を減らせることが分かり
改善前は質問項目が90点だったのが、改善後は25点プラス書類添付に収められました。
チェックアウト
最後に、チェックアウトとして
「今日気づいたこと」を付箋に書いていただきました。
アンケート結果
参加者のアンケート結果は概ね良好でした。
自由記述回答（一部抜粋）
「利用者目線で早く作成し、早く試して、早く修正する。」
「みんなが見やすいようにと思っていても、『あれもこれも書いとかなければ』と思いがちでなかなかシンプルにできないが、もっと深くなりきることを日々実践していくことで少しずつでもステップアップしていきたいと思った。」
「画像と文章での説明を使い分けることの大切さを学びました。」
「利用者目線でのフォーム作成。」
「無駄を省いてフォームをコンパクト化するだけでなく、フォームに至る前のサイトの状態など全体を含めて精査すること。」
「行政サービスとしては利用者視点で考えることが第一と改めて学びました。」
「ペルソナという概念。」
「ペルソナ目線（利用者目線）の実践。」
「さまざまな利用者の目線で考えること。」
「利用者目線で見ていたようで、見ていなかった自分に気づきました。」
「作成者(業務実施者)と申請する人では目線がことなるため、相手に分かりにくい表現になっているのがよく学んだ。」
「ペルソナとしてテストする重要さ。」
「ページは短い方がいいこと。」
「第三者目線のチェック！ペルソナ設定。」
「利用者目線で、テストを繰り返し改善をしていくことが大切になる。また、入力フォームにたどり着くまでの道筋についても整える（ホームページの作り方）ことが重要。」
「どこでつまづくか、入力する立場にたって想像することが大切だと学びました。」
「多様な視点が大事。」
「ユーザーのテストの手法。1人がペルソナを演じ、その様子を周囲の人が観察するという手法があるということ。」
「市民になりきった確認テストの重要性。」
「チームでの取り組みがとても大切だということを改めて実感した。」
「利用者のイメージをすることで、何が必要かそうではないかを判断すること。」
「早くやる、早く試す、早く失敗する。どんどんやります！」
「多くの目でチェック。」
「自分の感想を口に出すこと。」
「フォーム作成を予定しているので、テストを多くの人にしてもらうようにしたいです。」
「ペルソナの設定、ユーザーテスト。」
「分かりやすく短く伝える必要がある。」
「みんなでチェックしあって、いいものを作ろう！」
「必要に応じてテストプレイや周囲に意見をもらいながらUIを組み立てること。」
以上で当日のワークショップについては終わります。
ワークショップの設計について
当日のワークショップの内容をどうやって設計したのかも書きます。フォーム候補を選んだり、事前にリハを行ったり、数回のお打ち合わせを重ねてきました。
開催の背景
熊本市様の背景は大まかに以下の内容でした。
職員自身でオンライン申請フォームを作成できるシステムに刷新した
職員自身で使い勝手の良いフォームを作る必要がある
オンライン申請の利用率を上げたい
利用率を上げるには、いくつか方法がありますが
・オンライン申請フォームまで辿りつきやすくする（認知）
・オンライン申請フォーム自体の使い勝手を良くする（利便性）
今回は「使い勝手を良くする」ためのUI改善を研修対象としました。
ワークショップの目的決め
さて、使い勝手の良さって、どうやって判断するのでしょう？
それは利用者目線になると見えてきます。
私たちは、作る側に回ってしまった途端「利用者目線」を失いがちです。
そこで「利用者目線」になりきって、使い勝手の良し悪しを検討するような
ワークショップを構成しました。
「ユーザーになりきる」の体験知を高める
CGFMが得意なのは、情報設計する上で「利用者」の視点を盛り込むこと。
座学よりも、体験して身体で覚えてもらうことを重視しました。
当日までの事前準備
ユーザーテスト対象になる申請フォームの試用
事前にいくつか対象フォームを挙げてもらい、私達も実際に入力を試すなどしてワークショップに最適なフォームを3つに絞りました。
ユーザーテストのリハーサル
デジタル戦略課の方、グラビス・アーキテクツ株式会社の方に実際に
ペルソナ作成とユーザーテストを試していただきました。
こうやって事前にテストするのもワークショップ内容やスケジュールを見直せるので大事なプロセスです。
改善例の作成
別の申請フォームの改善前・改善後のサンプル用フォームを作成していただきました。
印刷して繋げてみると巻物のように長くなり
「こんなに長いフォームを入力するのは大変」と一見で分かります。
ついでに、この申請受付後は職員が手動でデータ整形する運用だとわかり
必ずしもフォームの項目に入れなくて良いと判断できました。
あとがき）ワークショップ終えて
想像以上に、参加された皆さんが積極的に手を動かして、
意見を出し合っていたのが印象的でした。
ファシリテーターの進行を待ちきれず
早くペーパープロトタイプに手を入れていきたいと
ウズウズしている方がかなりいらっしゃいました。
「ここはマイナンバーカードを活用したらいいんじゃない？」
「国民健康保険証を添付させるなら、この質問項目省けるんじゃない？」
など、良いアイデアが出ていて
私たちがリハーサルでペーパープロトタイプ検討した時より
もっと便利なフォームになりそうで
私たちにとっても良い刺激になりました。
今回のワークショップを通じて、市民にとってより使いやすい電子申請フォームの実現に向けた一歩を踏み出してもらえたなら幸いです。
今後も引き続きUI改善に取り組んでいかれることを願ってます。
お礼
会場の手配とワークショップ道具（付箋・ペンなど）を
熊本市職員の方々が準備してくださり、とても助かりました。
ワークショップの場を一緒に作っていただき、ありがとうございました。
今回のきっかけは、知人よりグラビス・アーキテクツ株式会社さまを通じて、熊本市のデジタル戦略課さまをご紹介いただきました。打ち合わせやワークショップのリハ時には同社の天神オフィスの会議室を貸していただきました、本当にありがとうございました。
余談
今回、福岡市在住の私が知人から声かけてもらったのは、私（金内透）が10年近く行っている崇城大学のデザイン学科での集中講義がきっかけでした。（前期中のみ毎月1日集中講義でデザインワークショップのために熊本市に行っています）
ずっとご縁があった熊本市に何かしらプラスになることができたことを嬉しく思います。
この記事が気に入ったらサポートをしてみませんか？