다국어 웹서비스 구축을 위한 요구사항 정의

외국인정보센터는 “외국인이 쉽게 정보를 접하고, 필요한 업무를 스스로 처리할 수 있는 웹”을 목표로 했습니다.
리트머스는 요구사항을 다음 3가지 축으로 정리했습니다.

외국인 대상 다국어 웹서비스 구축(22개국어 지원)

국기/국가 선택을 기반으로 페이지를 자동 번역하고, 가입 정보(국적)와 연결해 기본 언어 경험을 제공

상담·정보·커뮤니티 운영이 가능한 게시판 중심 구조

유용한 정보/민원서식/구인구직/온라인 상담/FAQ 등 대부분의 기능을 게시판 기반으로 구성하고, 운영 부담을 줄이는 관리 구조 설계

민원서식 작성→PDF 출력(3종)과 구인구직 지원 플로우 구현

일부 서식은 웹에서 입력 후 PDF로 저장 가능하도록 하고, 구인 게시판은 검색/필터/지원(파일 첨부)까지 이어지는 흐름을 구성

​22개국어 자동 번역을 “운영 가능한 구조”로 고정

이 프로젝트에서 번역은 단순 옵션이 아니라 서비스의 중심이었습니다.

리트머스는 회원 가입 시 국적 정보를 받고,
이후 언어 설정과 연결해 사용자가 별도 설정을 반복하지 않도록 설계했습니다.

또한 Google translator 플러그인 기반의 22개국어 지원 구조를 전제로,
메뉴/게시판/상세 페이지까지 번역 경험이 이어지도록 정보형 레이아웃을 정리했습니다.

– 회원 국적(국기/국가명 드롭다운) 기반 기본 언어 경험
– 22개국 언어 지원을 전제로 한 페이지 구조/메뉴 트리 설계
– 번역 플러그인 적용 범위를 고려한 콘텐츠 구성(내부/외부 페이지 구분)

​

​게시판 중심으로 기능을 통합해, 관리자 페이지를 최소화

센터 운영에서 중요한 것은 “기능이 많아 보이는 것”보다 운영이 실제로 가능한가였습니다.

리트머스는 유용한 정보, 다문화 뉴스, 행사 안내, 상담실, FAQ 등 주요 영역을
게시판+WYSIWYG 에디터 기반 CRUD로 통합해 콘텐츠 업데이트를 단순화했습니다.

또한 공지 상단 고정, 검색/정렬, 첨부파일, 댓글 등 운영에 필요한 요소를 표준화했습니다.

– 게시판 공통 패턴(목록/상세/검색/정렬/페이지네이션) 표준화
– 최고관리자 중심의 등록/수정/삭제 권한 노출 제어
– 댓글/답글/상담 상태 변경 등 운영 기능을 게시판 흐름에 포함

​

온라인 상담을 “상태 기반”으로 운영할 수 있게 구조화

상담은 단순 문의 접수가 아니라, 진행 상황을 관리해야 누락이 줄어듭니다.

리트머스는 온라인 상담 게시판에 상담상태(미확인/진행중/상담완료)를 두고,
최고관리자가 상태를 변경할 수 있도록 구성했습니다.

또한 비공개 상담을 위해 비밀번호 설정 옵션을 포함해 민감한 문의도 처리 가능하게 했습니다.

– 상담글 공개/비공개(비밀번호) 설정
– 첨부파일 포함 상담 접수
– 최고관리자 답글 및 상담 상태 변경 기능

​

“민원서식 작성→PDF 다운로드”를 3종으로 한정해
구현 가능성 확보

민원서식은 범위를 넓히면 복잡도가 급격히 증가합니다.

리트머스는 작성 가능한 민원서식을 3가지로 한정하고,
그 외 서식은 다운로드 중심으로 제공하는 방식으로 구조를 잡았습니다.

작성형 서식은 값 입력 → 항목명 자동 번역 → PDF 다운로드 시 한글 자동 번역 후 저장
흐름을 기준으로 설계했습니다.

– 작성형 민원서식 3종만 지원(1페이지 분량 기준)
– 항목명 자동 번역 + 입력값 기반 PDF 출력
– 그 외 서식은 다운로드 중심으로 제공해 범위/리스크 통제

​

구인구직을 “검색/필터/지원”까지 이어지는 실사용 플로우로 구성

구인 게시판은 단순 게시글이 아니라 지원까지 이어져야 의미가 있습니다.

리트머스는 구인 목록에
검색(제목/회사명/업무), 필터(업무/지역/비자), 정렬(D-Day 중심)을 포함했고,
상세에서 지원 버튼→구인 신청 페이지(회원정보 자동 매핑+파일 첨부)로
이어지도록 설계했습니다.

또한 운영 리스크를 줄이기 위해 승인/비승인 상태 전환을 최고관리자 기능으로 포함했습니다.

– 구인 게시글 승인/비승인 운영(승인 글만 노출)
– 지원 시 회원 정보 자동 매핑 + 파일 첨부
– 담당자 이메일 발송 연계(NHN 서비스 이용료는 별도 부담 가능성 명시)

​

가입/로그인 + 권한 분리(일반·직원·최고관리자)

외국인정보센터 웹은 외국인 사용자와 센터 운영자가
한 서비스 안에서 각자 필요한 기능만 사용할 수 있도록,
가입/로그인과 권한 체계를 먼저 구축했습니다.

– 이메일 기반 가입/로그인(이메일 인증 포함) + 구글 소셜 로그인 지원
– 가입 필수 정보(이메일·이름·국적·비자)와 선택 정보(전화번호·거주지역) 구분
– 권한별 기능/버튼 노출 제어로 운영 안정성 확보(등록·수정·삭제·상태 변경 등)

​

정부24·홈택스형 레이아웃 기반 반응형 정보형 UI 구축

정보 접근이 핵심인 서비스인 만큼,
메인 화면은 단순 소개가 아니라 “찾기 쉬운 구조”가 우선이었습니다.

1차–2차 메뉴 트리를 중심으로 화면 구조를 설계하고, PC/Mobile 반응형 UI로 구현했습니다.

– 1차 메뉴 + 2차 하위 메뉴 확장 구조
– 배너/캐러셀/기관 로고/SNS 외부 링크 구성
– 로그인 상태에 따라 마이페이지, 기업 문의, 언어 변경 진입 제공

​

22개국어 자동 번역 다국어 웹사이트 개발

다국어가 “추가 기능”이 아니라 기본값이 되도록 설계했습니다.
국기/국가명 선택을 통해 언어를 설정하고, 가입 정보와 연동해 일관된 언어 경험을 제공합니다.

– 22개국어 지원(국기/국가명 기반 언어 선택)
– 가입/마이페이지 국적 정보와 언어 설정 흐름 연동
– Google translator 플러그인 기반 번역 적용

​

구인구직 게시판: 접수→승인→지원 플로우

기업 구인 접수부터 승인, 사용자 지원까지 이어지는 흐름을 설계했습니다.

– 기업 구인 접수 폼(업무·기간·상세정보·첨부파일)
– 검색/필터/정렬 + 승인/비승인 전환 기능
– 지원 시 회원정보 자동 매핑 + 파일 첨부

​

민원서식 3종 입력→PDF 다운로드 기능

작성형 서식은 3종으로 한정해 안정적으로 구현했습니다.

– 작성형 서식 3종만 지원, 나머지는 다운로드 제공
– 항목명 자동 번역 + 입력값 기반 PDF 다운로드
– 오번역 가능 항목에 대한 운영 가이드 적용

​

마이페이지 구축(프로필/약관/탈퇴)

상담·구인 지원·서식 작성과 연결되는 기본 정보를 관리할 수 있도록
마이페이지를 구축했습니다.

– 프로필 수정(전화번호/이름/국적/거주지역/비자)
– 비밀번호 변경/약관 확인/로그아웃
– 회원탈퇴 기능 제공

​