9년 전에 디자인된 관리 화면 폼을 개선해 본다

　개요

사내 시스템의 관리 화면 양식을 어떻게 디자인해야합니까?
9년전에 만들어진 사내 시스템의 개수작업이 빠져들었기 때문에, 우선은 관리 화면에서 대량 생산하는 폼에 대해 구구하면서 개선안을 만들어 보았습니다.

※진짜를 얹으면 다양한 각도가 서 있으므로, 대략적인 디자인만 만들고 있습니다. 용서를 바라.

기존 시스템의 양식

개선안

좋은 양식이란?

이번 참고로 한 것은 이 기사
아래의 15개의 규칙을 바탕으로 생각해 보았습니다.

1.フォームは縦一列配置にする
2.ラベルは入力データの上に配置する
3.ラベルと入力データはグループ化する
4.すべて大文字での表記は避ける
5.6項目以下の選択肢はすべて表示する
6.プレースホルダテキストをラベルとして使わない
7.チェックボックスとラジオボタンを縦に配列する
8.CTAに説明を加える
9.エラー表示はインラインで
10.入力途中でのリアルタイムアラート（バリデーション）は使わない
11.基本的なヘルプテキストを表示する
12.現在のアクションと次のアクションをわける
13.入力フォームの幅を適切に
14.*ではなく任意表示を設ける
15.関連情報ごとにグループ化を

기존 시스템에서 할 수없는 것은

1.フォームは縦一列配置にする
2.ラベルは入力データの上に配置する
7.チェックボックスとラジオボタンを縦に配列する
8.CTAに説明を加える
9.エラー表示はインラインで
11.基本的なヘルプテキストを表示する
13.入力フォームの幅を適切に

↑의 7개의 룰을 의식하면서 개선해 옵니다.

개선해 보았다

완성된 것이 이쪽.



불필요하다고 판단한 항목은 없고, 항목수도 줄어듭니다.
헬프는, 별로 붙이고 싶지 않은 너라고 생각했기 때문에, 필요한 것 같은 곳만 붙였습니다.

앞으로 고민하는 것은
회사 등록한 후에 실시할 것에의 동선을 붙일까, 붙이지 않을까 하는 점.

저장 버튼 옆에 "○○로 진행"같은 버튼이 있고,
그것을 누르면 저장과 동시에 다음 흐름으로 진행하면 편리하다고.

잡감

toC용 시스템이라고 하면, 이러한 룰에 더해 이탈율 저하의 시책을 생각하지 않으면 안 된다고 한다.

자신의 경우, 일에서 사용하는 관리 화면이니까 이탈=일 포기가 되기 때문에, 그렇게 생각하지 않아도 좋을까.
아니, 사실은 생각하는 편이 좋을까, 거기엔 스케줄과 싸우면서 노력한다.