본문 바로가기
서비스 기획

서비스 기획 단어장 1 - Input Controls

by mihsyeh 2022. 3. 29.

기획자, PM이 기본적으로 알아야할 용어들을 그때그때 정리해보려고해요.

서비스 기획자의 산출물인 화면설계서는 또 다른 이름으로 화면정의서, 서비스 기획서, 스토리보드 혹은 줄여서 SB라고하기도 합니다. 이렇게 같은 정의를 두고도 회사마다 부르는 단어가 다를 수 있다고 하는데, 원활한 의사소통을 위해서는 통념적으로 사용되는 것들을 알아야 하겠죠. 또 내가 어떤 상태를, 혹은 상태에 대해 정의를 할 것인가에 대한 지식이 필요합니다.

읽기만 하는 것보다 나만의 언어로 재정의 해보는 것이 중요하다고 합니다. 앞으로 공부를 하다가 낯선 IT 용어를 보게 되면 바로 기록해 저만의 단어장을 만들어 볼게요. 제가 보기 편한, 제 위주로 기록하기 때문에 정리가 뒤죽박죽일 수 있어요.


 

Input Controls

인터페이스의 대화형 요소. 사용자가 시스템 인터페이스에 정보를 입력할 수 있습니다.

 

  • Button

버튼은 제출, 병합, 새로 만들기, 업로드 등 특정 작업을 수행할 수 있음을 사용자에게 알려줍니다. 

출처 - 마이크로소프트

위 이미지에서는 사용자에게 저장, 저장 안함, 취소라는 세 버튼을 제공합니다.

 

  • Checkbox

체크박스는 사용자가 선택 사항에서 한 개 이상의 여러 아이템을 중복 선택할 수 있게 합니다. 체크된 상태와 체크 해제된 상태로 나뉩니다.

출처 - 마이크로소프트

 

  • Radio buttion

라디오 버튼은 작은 원형의 UI 요소이며 체크박스와 다르게 중복 선택이 불가능합니다. 성별, 동의/비동의 등 양자택일 해야하는 데이터에 주로 사용합니다.

출처 - 마이크로소프트

 

  • Dropdown list (=select box)

말 그대로 아래로 쏟아지는 리스트 형태이며 정해진 데이터 중 하나를 골라서 입력해야 할때 사용합니다. 데이터가 많아도 화면에서 많은 공간을 절약할 수 있습니다. 디폴트 설정이 필요하고, 사용자가 옵션을 선택 시 이를 시각적으로 명확하게 표현해주어야 합니다.

 

  • Toggle

사용자가 상태를 on/off 형태로 전환할 수 있는 스위치와 같습니다. 

출처 - 마이크로소프트

 

 

  • Slider

슬라이더는 특정 범위 내의 값을 설정할때 사용하여, 부적절한 값을 입력할 가능성이 없어 직관적인 요소입니다. 사용자가 드래그하여 값을 미세하게 조절이 가능하고 볼륨, 밝기 조절, 동영상 재생 바 등에 주로 사용됩니다.

출처 - 마이크로소프트

 

  • Date picker, Time picker

 

  • Text field (=text input)

텍스트 필드는 사용자가 UI에 텍스트를 입력할 수 있는 요소입니다. 부적절한 입력값을 방지하기 위해 상태 및 사용자 상호 작용에 따라 직관적인 시각 요소를 넣어주어야 합니다. 비활성, 호버, 유효성 검사, 포커스, 확인, 오류 상태 등 모든 상태는 서로 명확하게 구분되고, 전체 형식과 일관되어야 합니다. 또, 입력칸의 길이는 사용자가 입력할 데이터의 예상 길이에 비례해야 합니다.

출처 - 마이크로소프트

  • Text area

사용자가 여러 줄의 텍스트를 입력할 수 있는 요소.

출처 - 마이크로소프트

 

  • Search field = 검색창

댓글