사용자 인터페이스에 대한 와이어프레임 다이어그램 만들기
Applies ToVisio 플랜 2 Visio Professional 2024 Visio Professional 2021 Visio Professional 2019 Visio Professional 2016

Visio Professional 및 Visio 플랜 2 와이어프레임 템플릿은 소프트웨어 애플리케이션의 중간 충실도 모형을 만들기 위해 설계되었습니다. 이 템플릿은 Windows, 인터넷 및 모바일 디바이스용 애플리케이션과 같은 광범위한 소프트웨어 유형에 사용할 수 있습니다.

  1. 먼저 대화 상자 스텐실을 클릭하고 애플리케이션 양식 또는 대화 상자를 페이지로 끌어다 놓습니다. 이 스텐실의 다른 셰이프를 추가하여 UI의 기본 구조를 간략하게 설명합니다.

  2. 도구 모음 스텐실을 클릭하여 메뉴 및 기타 애플리케이션 아이콘을 추가합니다.

  3. 다른 네 개의 기본 스텐실(컨트롤, 커서, 공통 아이콘웹 및 미디어 아이콘)의 셰이프를 사용하여 UI를 채우고 애플리케이션의 기능을 표시합니다.

일부 와이어프레임 셰이프에는 사용자 지정 가능한 속성이 있습니다. 다음은 해당 셰이프를 사용하는 방법에 대한 몇 가지 팁입니다.

실행할 작업

Create 대화 상자

도형

애플리케이션 양식

전체 애플리케이션의 범위를 제공하는 컨테이너입니다. 오른쪽 위 모서리에 있는 연결점은 Windows 단추 셰이프를 배치합니다.

대화 상자 양식

대화 상자의 아이콘, 컨트롤 및 텍스트를 저장할 컨테이너입니다. 오른쪽 위 모서리에 있는 연결점은 Windows 단추 셰이프를 배치합니다.

Windows 단추

닫기, 최대화, 최소화 또는 복원(일반적으로 애플리케이션 및 대화 상자 양식의 오른쪽 위 모서리에 있는 단추)을 사용하여 나타낼 단추를 선택합니다. 폼에 셰이프를 놓을 때 원하는 단추를 선택하고 도형을 마우스 오른쪽 단추로 클릭하고 단추 형식 을 클릭하여 나중에 변경할 수도 있습니다.

도형을 마우스 오른쪽 단추로 클릭한 다음 활성 표시를 클릭하여 단추의 음영을 변경합니다.

상태 표시줄

상태 표시줄 항목, 아이콘 및 분할기용 컨테이너입니다. 상태 표시줄 항목은 두 번 클릭하여 텍스트를 추가할 수 있는 중간 길이의 막대입니다. 아이콘, 진행률 표시줄, 슬라이더 또는 기타 도형을 추가하기 위한 가운데 연결점도 있습니다. 상태 표시줄 아이콘은 공통 아이콘 또는 웹 및 미디어 아이콘에서 아이콘을 놓을 수 있는 가운데 연결점이 있는 짧은 막대입니다. 상태 표시줄 분할기를 다른 셰이프 사이에 놓아서 표시되는 나누기를 만들 수 있습니다.

스크롤 막대

마우스 오른쪽 단추를 클릭하여 세로 또는 가로로 지정하고 슬라이더의 길이(엄지 손가락 길이)를 설정합니다. 노란색 컨트롤 핸들을 사용하여 스크롤 막대의 길이를 따라 슬라이더를 이동합니다.

그래버 크기 조정

스크롤 막대 및 상태 표시줄에서만 사용할 수 있습니다. 페이지에 삭제한 후 형식을 설정할 수 있도록 대화 상자가 나타납니다.

탭 표시줄

탭 항목에 대한 컨테이너입니다. 위쪽 탭 항목 또는 아래쪽 탭 항목을 추가한 후 탭 항목을 마우스 오른쪽 단추로 클릭하거나 탭 모서리에 포인터를 놓을 때 주황색 강조 표시와 함께 표시되는 파란색 삽입 화살표를 클릭하여 더 추가할 수 있습니다.

도형을 마우스 오른쪽 단추로 클릭한 다음 활성 탭 설정을 클릭하여 탭의 음영을 변경합니다.

탭 표시줄을 선택하면 컨테이너 도구 아래의 서식 탭을 사용하여 탭 막대 스타일을 변경할 수 있습니다.

맨 위로 이동

Create 도구 모음

도형

메뉴 모음

메뉴 모음 항목에 대한 컨테이너입니다. 메뉴 모음 항목을 추가한 후 항목을 마우스 오른쪽 단추로 클릭하여 상태(예: 사용 또는 선택), 형식(일반 또는 드롭다운) 및 아이콘에 대한 공간을 추가할지 여부를 설정합니다. 바로 가기 메뉴를 사용하여 메뉴 모음 항목을 더 추가하거나 파란색 삽입 화살표를 클릭할 수도 있습니다.

드롭다운 메뉴

메뉴 항목에 대한 컨테이너입니다. 메뉴 항목을 추가한 후 항목을 마우스 오른쪽 단추로 클릭하여 상태(예: 사용 또는 선택됨), 형식(예: 일반 또는 라디오) 및 메뉴 너비로 설정할지 여부를 설정합니다. 바로 가기 메뉴를 사용하여 메뉴 항목을 더 추가하거나 파란색 삽입 화살표를 클릭할 수도 있습니다.

드롭다운 메뉴를 메뉴 모음 항목에 연결하여 열린 메뉴를 표시할 수 있습니다. 메뉴 모음 항목에는 드롭다운 메뉴의 위쪽 모서리에 연결할 수 있는 연결점이 아래쪽 모서리에 있습니다.

맨 위로 이동

폼에 컨트롤 추가

도형

하이퍼링크

페이지에 하이퍼링크 셰이프를 놓으면 링크 대상을 설정할 수 있도록 하이퍼링크 대화 상자가 나타납니다.

단추

단추 셰이프를 마우스 오른쪽 단추로 클릭하여 단추의 상태 또는 모양을 설정합니다(예: 사용 또는 선택됨).

목록 상자

목록 상자 항목에 대한 컨테이너입니다. 목록 상자를 마우스 오른쪽 단추로 클릭하여 목록의 방향을 설정합니다(예: 위쪽에서 아래쪽 또는 왼쪽에서 오른쪽으로). 목록 상자 항목을 추가한 후 항목을 마우스 오른쪽 단추로 클릭하여 상태를 설정하고(예: 사용 또는 선택됨) 항목에 추가 공간을 추가하려는 경우 자리 표시자를 설정합니다(예: 아이콘 추가). 바로 가기 메뉴를 사용하여 목록 상자 항목을 더 추가하거나 파란색 삽입 화살표를 클릭할 수도 있습니다.

목록 상자를 선택하면 컨테이너 도구 아래의 서식 탭을 사용하여 목록 상자 스타일을 변경할 수 있습니다.

확인란

확인란을 마우스 오른쪽 단추로 클릭하여 선택 항목(예: 선택됨 또는 선택 취소됨) 및 상태 (예: 사용 또는 가리키기)를 설정합니다.

트리 컨트롤

트리 컨트롤 항목에 대한 컨테이너입니다. 트리 컨트롤 항목을 추가한 후 항목을 마우스 오른쪽 단추로 클릭하여 들여쓰기를 제어하고 확장되거나 축소된 상태 및 자리 표시자 공간과 같은 트리의 속성을 설정합니다.

바로 가기 메뉴를 사용하여 트리 컨트롤 항목을 더 추가하거나 파란색 삽입 화살표를 클릭할 수도 있습니다.

트리 컨트롤을 선택하면 컨테이너 도구 아래의 서식 탭을 사용하여 트리 컨트롤 스타일을 변경할 수 있습니다.

음성 메일 슬라이더 아이콘

슬라이더를 마우스 오른쪽 단추로 클릭하여 눈금 표시의 수 및 위치와 같은 속성을 설정합니다. 노란색 컨트롤 핸들을 사용하여 슬라이더를 이동합니다.

진행률 표시줄

노란색 컨트롤 핸들을 사용하여 진행률 표시기를 이동합니다.

일정

페이지에 일정을 놓으면 월과 연도를 설정할 수 있도록 대화 상자가 나타납니다. 나중에 설정을 변경하려면 도형을 마우스 오른쪽 단추로 클릭한 다음 구성을 클릭합니다.

맨 위로 이동

도움이 더 필요하세요?

더 많은 옵션을 원하세요?

구독 혜택을 살펴보고, 교육 과정을 찾아보고, 디바이스를 보호하는 방법 등을 알아봅니다.

커뮤니티를 통해 질문하고 답변하고, 피드백을 제공하고, 풍부한 지식을 갖춘 전문가의 의견을 들을 수 있습니다.