실행 가능한 사용자: 모든 사용자
사용 가능 플랜: 모든 플랜
사용 가능 환경: 브라우저, 데스크톱, 모바일
프로토타이핑 라이브러리를 사용해 Miro 캔버스에서 바로 프로토타입 레이아웃을 만듭니다. 라이브러리에는 화면, UI 구성요소, 아이콘이 포함되어 있어 워크플로를 시각화하고 아이디어의 구조를 초기에 정리하는 데 도움이 됩니다.
프로토타이핑 라이브러리를 사용해 정적 프로토타입을 만들 수 있습니다. 고급 구성요소, 연결선, 인터랙티브 미리보기와 같은 기능은 Business 플랜 또는 Enterprise 플랜의 경우 Miro Prototypes 애드온 이 필요합니다.
프로토타입 라이브러리에는 Miro에서 단일 및 다중 화면 워크플로를 직접 만들 때 필요한 모든 항목이 포함되어 있습니다
프로토타입 라이브러리 열기
- 캔버스에서 생성 바 에서 도구, 미디어 및 통합 을 클릭합니다 (
).
- 프로토타입을 검색한 다음, 프로토타입 라이브러리 를 클릭합니다
- 프로토타입 라이브러리 패널이 열립니다.
프로토타입 라이브러리 구성
프로토타입 라이브러리는 탭으로 구성되어 있습니다. 모든 사용자는 화면, UI 구성 요소, 아이콘을 사용해 정적 프로토타입 레이아웃을 구성할 수 있습니다.
💡 AI로 생성된 프로토타입과 인터랙티브한 흐름을 만들려면 프로토타이핑 라이브러리를 Miro Prototypes와 함께 사용하세요.
화면
화면은 프로토타이핑 흐름을 위한 미리 만들어진 프레임입니다. 모바일, 태블릿 또는 데스크톱 화면을 캔버스에 추가해 UI 요소를 끌어다 놓아 레이아웃을 구성할 수 있습니다.
화면으로 작업하기
- 화면 크롬 표시 또는 숨기기 — 기기 프레임처럼 보이거나 단순 프레임으로 표시할 수 있습니다
- 화면 회전
- 화면 크기 조정 — 드래그해 세로 방향으로만 높이를 늘릴 수 있습니다
UI 컴포넌트
UI 컴포넌트는 버튼, 입력 필드, 내비게이션 바, 폼 요소 등 화면에 드래그해 넣을 수 있는 일반적인 인터페이스 요소입니다.
다음과 같은 작업을 할 수 있습니다:
- 컴포넌트를 화면으로 드래그해 넣기
- 컴포넌트 크기 조정 및 위치 변경
- 컨텍스트 메뉴에서 텍스트와 기본 스타일을 편집하기
✏️ 컨텍스트 메뉴 옵션은 선택한 요소에 따라 다릅니다.
Miro Prototypes 애드온이 활성화되면 일부 UI 컴포넌트는 미리보기 모드에서 상호작용 가능해집니다. 예: 버튼, 슬라이더, 입력 필드, 드롭다운 메뉴는 정의한 연결선에 따라 사용자 동작에 반응합니다.
일부 컴포넌트 세트(예: 고급 컴포넌트)는 Miro Prototypes 애드온에서만 사용할 수 있습니다. 애드온이 활성화되어 있지 않으면 이러한 컴포넌트는 라이브러리에 표시되며 인디케이터가 함께 보일 수 있습니다.
아이콘
아이콘 탭에는 프로토타입에 사용할 수 있는 검색 가능한 아이콘 라이브러리가 포함되어 있습니다.
아이콘 추가 또는 교체
- 라이브러리에서 아이콘을 캔버스로 드래그합니다.
- 아이콘을 선택한 후 컨텍스트 메뉴에서 색상을 변경합니다.
- 아이콘 교체를 선택해 위치나 크기를 변경하지 않고 다른 아이콘으로 교체합니다.
와이어프레임(레거시)
와이어프레임 탭에는 레거시 와이어프레임 요소가 포함되어 있습니다. 이 요소들은 기존 보드에서 계속 사용 및 편집할 수 있지만, 새 프로토타입은 프로토타이핑 라이브러리의 화면과 UI 컴포넌트를 사용해야 합니다.
연결선 및 상호작용 (Miro Prototypes 애드온)
연결선은 프로토타입에서 화면 간 내비게이션을 정의할 수 있게 해줍니다. Miro Prototypes 애드온이 활성화되어 있으면 요소와 화면 사이에 연결선을 만들어 다단계 워크플로를 구성할 수 있습니다.
연결선은 인터랙티브 미리보기도 사용할 수 있게 합니다. 미리보기 모드에서는 연결된 화면이 클릭 가능한 흐름처럼 동작하며, 화면이 뷰포트를 벗어나면 세로로 스크롤됩니다. Miro Prototypes 애드온이 없으면 연결선과 인터랙티브 동작을 사용할 수 없습니다.
💡 일부 UI 요소는 화면에 추가하면 번개 아이콘이 표시됩니다. 다중 화면 워크플로에서 번개 아이콘을 드래그해 화면 간 연결선을 만드세요.