지난주 수요일 발행한 ‘기획자의 서비스 훑어보기 – 리뷰 기능 기획 시 참고해야 할 7가지 기준’을 작성할 때, 개인적으로 공부하고 정리하고자 하는 목적도 있었지만 이 내용을 저와 같은 업무를 하는 분들이 일종의 가이드처럼 활용할 수 있었으면 좋겠다는 생각도 있었어요. 물론 정답이 아니라, 출발점이 되기를 바라면서요. 이런 가이드는 내가 알고 있는 내용과 비교해보기 좋고, 몰랐던 내용을 채워넣는 과정에도 많은 도움이 되는데요! 오늘은 웹 인터페이스 관점에서 주요 내용들을 잘 정리해주는 서비스를 소개하고자 합니다.

7개 항목에 대한 세부 가이드 제공

Typography, Layout, Forms, Inputs, Buttons, Colors, Patterns 등 7가지 카테고리가 기본 제공되고 있어요. 각 카테고리 별 세부 항목을 클릭하며 가이드에 해당하는 상세 정보를 확인할 수 있습니다. 구분이 자세히 제공되고 있어 필요한 내용을 빠르게 찾을 수 있어요. 몇 개의 세부 항목이 있는지도 볼 수 있고요.

사례와 함께 제공되는 가이드

저는 폼 디자인 – 에러 메시지를 먼저 확인해봤어요. 상세 페이지로 진입하면 에러 메시지에 대한 안내와 목차를 먼저 확인할 수 있어요.

뒤이어 각 목차 별 상세 내용 확인이 가능해요. 설명만 있다면 어떻게 구현해야 할 지 머릿속으로 그려가며 봐야 하지만, 올바른 예와 그렇지 않은 사례를 함께 보여줘 더 구체적으로 이해할 수 있어 좋았습니다. 이메일 유효성 검사 시, 형식을 정확히 안내해야 한다는 내용이 첫 번째였어요. (@,. 등이 포함되지 않았을 때 에러 메시지를 전달해야 된다는 내용)

인풋의 라벨도 확인해봤어요. 가이드 문구를 인풋박스 내 적용하지 않아야 하는 이유를 마찬가지로 사례와 함께 보여주고 있습니다.

7개 카테고리, 35개 항목에 대한 내용을 구체적인 사례와 설명으로 확인할 수 있다는 점. 이해하기 쉽게 설명되어 있어 항목을 하나씩 확인하는 것만으로도 많은 도움이 될 수 있겠다는 생각이 들었어요. 꼭 웹이 아니라 모바일에도 정책 등은 동일하게 사용 될 수 있는 정보가 다수 포함되어 있으니 이 곳을 통해 자세한 내용을 한 번씩 확인해보시기 바라요!

함께 읽어보세요!

스타트업 기획자가 일하는 방법 브런치 글 안내

‘스타트업 기획자가 일하는 방법’을 브런치에 작성하고 있어요. 20개 목차를 기준으로 현재 10개 글이 발행되었습니다. 미리 말씀드리지만, 정답이 있거나 대단한 가르침이 담긴 글은 하나도 없어요. 그저 제가 창업으로 시작해 지금까지 기획자이자 PM으로 일하며 경험한 것들을 바탕으로 저는 이렇게 해봤어요- 라는 참고 내용으로 읽어주세요. 앞으로도 꾸준히 작성할 예정입니다! (자세히 보기)