다시 뛰는 공정도시 서울!

문서번호 전산정보과-11018 결재일자 2018.11.12. 공개여부 부분공개(5) 방침번호 시 민 ★주무관 전산정보과장 요금관리부장 이은주 한병주 11/12 조세연 협조 주무관 오경미 사이버고객센터 디자인 개편 결과보고 2018. 11. 12. 요금관리부 (전산정보과) 사이버고객센터 디자인 개편 결과보고 모바일 사용자 가독성 제고를 위해, 단말기 크기에 맞춰 최적화된 화면을 제공하는 반응형 웹 기술을 적용하여 디자인을 개편하고 그 결과를 보고 드림 Ⅰ 서비스개요 ？？ 서비스명: 아리수 사이버고객센터 ？？ 접속주소: http://i121.seoul.go.kr ？？ 주요 서비스: 요금조회, 민원신청, 이사정산, 자가검침, 요금 관련 정보제공 ？？ 회원 수: 29,918명 ？？ 방문 수: 월평균 53,647회, 일평균 1,765회(2018년 기준) Ⅱ 추진개요 ？？ 대 상: 메인화면 및 서브화면 등 64개(민원신청 내부 화면 제외 민원신청 화면은 대민용 고객지원시스템 페이지를 호출하여 보여주는 부분으로, 고객지원시스템 재구축 서비스 개시 시 연계 예정 (임시 비반응형 웹 유지) ) ？？ 추진기간: 2018. 4 ~ 11월(8개월) ？？ 추진내용 - 홈페이지 이용현황 및 웹서비스 동향 분석 - 원하는 서비스를 쉽게 찾을 수 있도록 메인화면 디자인 재구성 - PC, 태블릿, 휴대폰에서 이용 가능하도록 반응형 웹 기술 적용 ？？ 소요예산: 비예산(2018년 요금관리시스템 유지관리사업에 포함) Ⅲ 세부 추진내용 ？？ 이용현황 및 동향 분석 - 홈페이지 이용현황 분석 (※ 출처: 서울시 웹로그 분석툴. 2017년 이전 자료 없음) ？ 접속 단말기 현황 접속 단말기 서울시청 홈페이지 사이버고객센터 2017년 2018년 2017년 2018년 PC 65.33 % 56.83 % 79.48 % 72.35 % 모바일 단말기 31.38 % 35.26 % 19.12 % 22.01 % 알 수 없음 3.29 % 7.91 % 1.4 % 5.64 % 분석결과 ○ 2017년도 대비 2018년도 모바일 단말기 사용자가 늘고 있음. ○ 모바일용 화면을 제공하는 서울시청 홈페이지에 비해, 사이버고객센터 홈페이지의 모바일 단말기 접속 비율이 낮음. ⇒ 모바일 사용자를 위한 화면 제공 필요 ？ 자주 찾는 메뉴 현황 메뉴 명 조회 비율 메뉴 명 조회 비율 요금조회 30 % 자가검침 7 % 민원신청 9 % 이사정산 3 % 요금계산 8 % 납부방법 2 % 회원전용 메뉴 (마이페이지, 회원정보 수정 등) 7 % 자주하는 질문 2 % 분석결과 ⇒ 현재 메인화면 구성에 없는 ‘납부방법’ 및 ‘자주하는 질문’ 추가 - 웹사이트 동향 분석 ？ 모바일 단말기 사용자에 대한 서비스 제공 기술 구분 설명 특징 반응형 웹 하나의 디자인을 단말기 화면 크기에 맞춰 변경 [장점] 프로그램 소스 관리 용이 [단점] 복잡한 페이지에 적용하기 어려움 적응형 웹 PC용, 모바일용 디자인을 각각 개발하여 서비스 [장점] 복잡한 페이지 개발 시 용이 [단점] 관리 대상 프로그램 소스 증가 분석결과 ⇒ 사이버고객센터 홈페이지는 각 화면의 구성이 간단하므로, 반응형 웹 기술 적용이 적합 ？？ 메인화면 디자인 재구성 - 유선문의 고객에게 링크 위치 설명을 위해 영역별 명칭 부여 ？ 서비스 바로가기, 민원신청 바로가기, 전화문의, 자주하는 질문 - 민원신청 바로가기의 각 항목 이름을 축약하여 가독성 향상 ？ 자동납부(계좌) 신규/해지 ⇒ 자동납부(계좌) ？ 자동납부(카드) 신규/해지 ⇒ 자동납부(카드) ？ 소유자(사용자)명의 변경신고 ⇒ 명의변경 ？ 전자고지(이메일)신청(신규/변경/해지) ⇒ 전자고지 ？ 자가검침 (신규/변경/해지) ⇒ 자가검침신청 서비스 바로가기의 ‘자가검침입력’과 구분하기 위해서, 다른 민원과 달리 ‘신청’ 문구를 추가 - 자주하는 문의사항을 메인화면에 표출 ？？ 반응형 웹 기술 적용 - 단말기 해상도를 5단계로 분류하여 화면 분기점 설정 분기점 1단계 2단계 3단계 4단계 5단계 기준 해상도 (단위: 픽셀) 1200 이상 ~ 1024 이상 ~ 1200 미만 768 이상 ~ 1024 미만 380 이상 ~ 768 미만 ~ 380 미만 대상 단말기 데스크톱 PC 태블릿 PC 스마트폰 - 화면에 표출되는 콘텐츠 특성에 따라 1 ~ 5회 분기 적용 분기 횟수 해당 화면 수 비고 5 25 메인화면, 납부방법안내, 요금계산, 사이트맵 등 4 27 요금감면제도, 공지사항, 자주하는 질문 화면 등 3 6 이사정산요금계산(팝업), 이사정산내역(팝업) 등 2 3 사업소연락처(팝업), 자가검침ARS안내(팝업) 등 1 3 감면세대 조회(팝업), 아이디/비밀번호 찾기(팝업) Ⅳ 개편결과 ？？ 메인화면 디자인 재구성 현재 ② 글씨가 많아 가독성이 떨어짐 ① 유선안내 시 링크 위치 설명이 어려움 개선 ① 유선안내를 위해 영역에 이름 부여 ② 명칭을 축약하여 가독성 향상 ③ 자주 하는 질문을 메인화면에 표출 ？？ 반응형 웹 기술 적용 (※ 서브화면 결과는 붙임2 참조) 1단계 4단계 5단계 2단계 3단계 Ⅴ 향후계획 ？？ 테스트 및 보완 11. 12. ~ 24. ？？ 웹사이트 오픈심의 웹사이트 오픈심의 - 웹 표준, 접근성, 호환성 준수 여부 및 웹 보안 취약점 점검을 위한 절차 - 『서울시 웹서비스 정책 가이드라인 제3장 9』에 의한 의무 준수사항 - 서울시에서 연 2회 실시하는 홈페이지 운영실태 점검의 점검항목에 해당 의뢰(정보기획담당관) 11. 12. ？？ 개편 서비스 오픈 11. 26. (※ 고객지원시스템 연계는 재개발 완료 후 시행) ？？ 웹 접근성 웹 접근성(Web Accessibility) - 장애인, 고령자 등 정보접근 약자가 웹 사이트에서 제공하는 모든 정보를 동등하게 이용할 수 있도록 보장하는 것 - 『국가정보화기본법 제32조의2』에 의한 의무 준수사항 인증 의뢰(웹 접근성 품질인증기관) 12. 03. 붙임 : 1. 홈페이지 화면 목록 1부. 2. 개편결과 세부 화면캡쳐본 1부. 끝.

16511140

20210924173012

본청

전산정보과-11018

D0000034872645