학대피해장애인지원센터 웹사이트 제작 프로젝트
*슬로워크 구성원이 해당 프로젝트를 리뷰한 글입니다.
“저에게 ‘염전에 다시 가고 싶으냐’고 물으면 답은 ‘절대 안 간다’예요. 지금은 편해요.”
학대피해장애인지원센터 웹사이트의 ‘지원사례’ 페이지 중 진수씨의 이야기입니다.
장애우권익문제연구소와 슬로워크 소셜임팩트 사업부 소속 네 명(프로젝트 매니저(PM) 1명, 개발자 1명, 디자이너 2명)이 협력해 학대피해장애인지원센터 웹사이트를 열었어요.
진수씨 같은 학대피해장애인들 혹은 그 주변 사람들이 여기서 학대 상담 신청, 신고를 할 수 있고, 학대 피해 이후 지역사회에 정착하는 데 필요한 정보를 받아볼 수 있어요. 관련 기관 네트워크와 종합적인 지원망도 구축돼 있습니다. 비장애인의 경우 장애인 학대에는 어떤 종류가 있는지 공부할 수 있고, 주변에 학대를 당한 장애인이 있다면 상담 신청, 지원 신청을 할 수도 있어요.
웹사이트가 담당자들의 고충도 어느 정도 해결해주었어요. 웹사이트가 생기기 전에는 학대피해 장애인에게 도움이 될 수 있는 매뉴얼이나 각종 지원 정책이 한 곳에 모여있지 않았어요. 때문에 담당자들은 알음알음, 파편화된 정보를 모아서 공유해야 했습니다. 지금은 빠띠xyz 연동, 학대 상담 및 지원 신청 시 이메일 연동, 지원기관 필터 검색, 자료실, Easy Listening(오디오 재생) 기능이 구현되어 있어서, 담당자들끼리 한 곳에서 소통하고 정보를 얻을 수 있게 됐어요.
학대피해장애인지원센터 웹사이트 주요 기능
웹사이트에서 사용할 수 있는 주요 기능은 상담 신청, 오디오 재생, 지원기관 검색입니다.
상담 신청의 경우 사용자가 신청 페이지에서 양식을 채워 제출하면 센터에서 지정한 각 담당자에게 이메일이 가요. 그러면 담당자가 내용을 받아보고 상담 여부 등을 결정합니다. 상담 항목은 학대 상담 신청, 학대 피해 지원 신청이 있습니다.
오디오 재생의 경우 발달장애인 분들이 내용을 이해할 수 있도록 삽입한 기능이에요. ‘학대 식별’ 탭을 누르면 맨 위에 오디오 기능이 뜹니다. 재생 버튼을 누르면 2분 9초 동안 녹음 음성으로 학대가 무엇인지, 학대받고 있다면 어떻게 해야 하는지 설명해 줘요. 끝부분에는 우리가 학대받지 않을 권리, 행복할 권리가 있다는 것을 친절하게 알려주고 있어요.
지원기관 검색의 경우 지원 유형, 기관, 지역 필터를 적용했어요. 사용자가 원하는 대로 범위를 좁혀서 손쉽게 검색할 수 있습니다. 관련 기관 약 800개의 연락처가 등록돼 있어요.
이 외에 자료실과 빠띠 플랫폼도 유용한 기능이에요. 자료실에는 연구 발간자료, 영상 자료가 일목요연하게 정리되어 있어요. 빠띠는 당사자 참여마당, 실무자 네트워크로 구성했고요. 이중 실무자 네트워크는 비공개로 운영합니다. 의사결정과정에 관여한 기획위원이 빠띠에 대해 ‘의미있다’며 ‘실무자나 당사자가 소통할 수 있는 온라인 공간으로 만들어가면 좋겠다’고 피드백 주었어요.
제작 과정 이야기 - 도구를 중심으로
프로젝트를 담당한 슬로워크 구성원 네 명은 학대피해장애인지원센터 웹사이트 제작 프로젝트를 마무리한 뒤 거기서 끝내지 않고 67분에 걸쳐 회고를 진행했어요. 그 내용을 하나하나 기록했습니다. 이슈 수집, 이슈 그룹화, 집중 주제 선정, 집중 회고, 실무 팁, 동료 피드백 등으로 회고 항목을 나눴고 각 소요시간까지 명시했어요.
팀이 사용했던 생산성 도구, 소통 방식도 명확하게 나와 있어서 다른 조직의 실무에도 도움이 될 것 같더라구요. 그래서 내용을 정리해 보았습니다.
우선 디자인, 개발 킥오프 미팅을 한 뒤, 그 내용과 관리 문서를 구글 시트로 만들어서 내외부 소통에 활용했어요. 관리 문서에는 일정, 계정 정보, 관련 링크, 이슈 히스토리, QA 내역을 항목으로 만들었습니다. 더불어 관리자 매뉴얼도 노션(Notion)으로 만들었어요. 여기에는 관리자 페이지 구성, 배너 및 사례 등 홈 관리 내용을 담은 메뉴별 가이드를 담았습니다.
기획을 할 때는 목업(Moqups)을 썼어요. 포스트잇에 기능과 필드를 나눠 적어 넣었고요. 기능 중 신청 폼의 ‘선택 및 필수 항목’, 제출 시 발송되는 메일 화면까지 그려서 공유했어요. 나중에 기획안을 센터에 전달할 때는 PDF로 저장해서 전달했습니다. 이때 서체를 ‘나눔고딕’으로 설정하면 폰트가 깨지지 않는답니다.!
디자인에는 스케치-인비전-제플린 프로세스를 적용했어요. 피드백 시 인비전에 날짜별로 내외부용 시안을 업로드 해서 히스토리를 남겼고 이를 통해 커뮤니케이션했습니다. 그런데 나중에 기록을 보니 해당 방법이 내부에서는 소통하기 굉장히 편하지만 외부와 피드백을 주고받을 때는 단계를 한번 더 거쳐야했다고 했어요. 그래서 다음 프로젝트에서는 외부용으로 인비전 시안과 진행 사항 확인용 구글 시트를 함께 공유하는 것이 좋겠어요. 제플린의 경우 스타일가이드를 컨플루언스에 따로 만들었습니다. 그리드, 컬러, 타이포그래피, 애니메이션 세부사항을 적어서 개발자에게 함께 전달했습니다.
개발에는 리액트와 워드프레스를 사용했어요. 리액트 기반 SPA(Single Page Application, 단일 페이지 응용 프로그램-간단하고 빠르게 웹앱을 배포)를 만들어볼 수 있었고 워드프레스 API(Application Program Interface, 응용 프로그램 인터페이스-프로그래밍할 때 사용하는 함수를 모아두는 라이브러리에 접근할 때 필요한 규칙)를 그대로 사용해서 개발 공수를 줄였다는 장점이 있었고요. 다만 SPA가 SEO(Search Engine Optimization, 검색엔진 최적화-검색 결과 웹페이지가 상위에 노출되도록 만드는 작업)에는 적합하지 않아서 서브페이지 검색이 용이하지 않았다는 단점이 있었네요.
작업 중간 중간 기록을 해서 히스토리를 남기고 확인을 하다보니 과정에 대한 피드백도 꼼꼼히 들을 수 있었어요. 학대피해장애인지원센터에서 ‘처음에는 절차 때문에 시간이 오래 걸리는 것처럼 느껴졌지만 방향성이나 디자인을 개발 전에 확실히 정리하니 수정 요청할 것이 덜 생겨서 인상적이었다’고 말씀해주셨고요. 또 ‘센터 입장에서는 바빠서 잊을 수 있는데 슬로워크가 계속 연락해주고 언제까지 달라고 분명하게 이야기해줘서 좋았다’며 일정관리 측면에서도 긍정적으로 느꼈던 점을 공유해주셨습니다.
웹사이트 오픈일 받아본 피드백
센터에서 여러 방향으로 결과물에 대한 피드백을 해주셨어요. 예를 들어 더 발전적인 방향으로, “좋았지만 더 좋으려면?”의 차원에서 모의 적용 단계가 있으면 더 좋았겠다는 의견을 전달해주셨습니다. (장애인이 방문자라고 했을 때) 장애 정도에 따라 사용자 계층이 다양하다보니 특정 기간 동안 사용성 테스트를 해보면 좋겠다는 내용이었어요. 1순위 방문자는 관련 종사자이기는 하지만 예상 방문자에 장애인 사용자도 있어서 추후 고려해보면 좋겠더군요.
눈에 띄는 피드백 키워드는 ‘차별화’였어요. 전문성, 소통, 참신한 디자인 이렇게 세 가지 측면에서 슬로워크가 차별화된다는 의견을 주셨습니다.
전문성 측면에서 ‘기존에는 (센터가) 다 정해줘야 했고 그대로 반영했다. 물론 이런 과정이 좋은 면도 있지만 센터는 홈페이지 전문성이 없어 부분적이고 단편적인 의견밖에 줄 수 없었는데 슬로워크는 전체 디자인부터 의견 반영 절차까지 제안해주고, 기술적인 부분까지 설명해줬다’며, ‘선택권을 줘서 좋았고 확실히 전문적인 것 같다’고 하셨어요.
뿐만 아니라 ‘원고를 꼼꼼히 보고 성적 학대 부분에서 오해의 소지가 있는 부분들까지 제안해줘서 놀라웠다. 슬로워크가 아니었다면 문제가 생겼을 수도 있다’고 감사하다는 의견도 받았어요.
소통 측면에서는 ‘슬로워크가 이메일로만 소통하지 않고 필요한 시점마다 센터에 방문해줘서 과정과 결과물에 확실한 차이가 있었다’고 해주셨구요, ‘디자인과 인터페이스도 상대적으로 참신하다는 느낌을 받아서 홈페이지를 많이 홍보하려 한다’는 피드백도 받았습니다.
장애인 학대가 없는 사회를 위한 작은 변화
슬로워크 소셜임팩트 사업부의 학대피해장애인지원센터 웹사이트 제작 프로젝트의 전반적인 내용을 그대로 전달해 드렸어요. 그동안 온라인으로 학대피해장애인 상담 신청, 지원 신청을 할 수 있는 통로가 없었고, 관련 정보를 효율적으로 얻기 어려웠는데 이번에 열린 웹사이트가 그런 역할을 작게나마 할 수 있을 것이라고 기대합니다.
-학대 유형을 확인하고 피해 상담 및 지원 신청을 하려면 학대피해장애인지원센터웹사이트 <학대 식별> 페이지로 접속해주세요!
프로젝트 참여 | 슬로워크 소셜임팩트 사업부 류태석(개발), 이윤슬(PM 및 기획), 이지은(디자인), 호빵(일러스트)
정리 | 슬로워크 테크니컬 라이터 메이
이미지 | 슬로워크 디자이너 길우
'Social' 카테고리의 다른 글
“우리 모두 사회문제에 질퍽하게 발을 담그고 있어요” (0) | 2019.12.10 |
---|---|
그래서 대체 소셜섹터가 뭔가요? (0) | 2019.09.05 |
새롭게, 또 다르게 바라보는 일의 중요성 (0) | 2019.06.21 |
관계를 회복하고 이해관계자를 참여시키는 네 가지 방법 (0) | 2019.05.31 |
익숙함에 속아 소중한 걸 잊지 말아요 (0) | 2019.03.22 |
천연 세제로 안전하게 청소하기 (0) | 2017.10.27 |
페미니즘의 문턱을 낮춰준 책 3 (8) | 2017.05.20 |
오늘부터 눈여겨 볼 만한 여성단체 아홉 곳 (0) | 2017.03.07 |