화면 흐름 템플릿
사용자 흐름에서 시각적 화면 구성요소를 검증하고 사용자 상호 작용에 대한 이해를 얻습니다. 모든 플랫폼에서 더 나은 경험을 구축합니다.
화면 흐름 템플릿 소개
화면 흐름 ("와이어 흐름"이라고도 함) 은 와이어 프레임과 흐름도의 조합입니다. 엔드 투 엔드 흐름은 각 화면에서 사용자가 보는 내용과 사용자의 제품 또는 서비스를 통해 의사 결정 프로세스에 어떤 영향을 미치는지 매핑합니다. 이러한 정보를 통해 인터랙션 설계에 대해 내린 결정을 더 잘 설명할 수 있습니다.
화면 흐름 템플릿을 사용하여 처음부터 끝까지 마찰이나 좌절을 겪지않는 사용자 경험을 만들수 있는 새로운 기회를 찾을 수 있습니다.
만약 작품을 더욱 발전시키고 UX 디자인의 영역에 관심이 있다면, 사용자 여정을 화면이 아닌 텍스트와 기호가 있는 흐름도로 보여줄 수 있으며 사용자 흐름 템플릿에 흥미를 가지게 될 것입니다.
화면 흐름에 대해 자세히 알아보려면 계속 읽으십시오.
화면 흐름이란 무엇입니까?
화면 흐름 (또는 와이어 흐름) 은 흐름도처럼 연결된 다중 화면 레이아웃을 통합하여 고객의 의사 결정 지점과 움직임을 처음부터 끝까지 표시합니다.
와이어프레임 자체에는 대화형 페이지별 사용자 흐름이 어떻게 보일 수 있는지에 대한 컨텍스트가 부족합니다. UX 흐름 자체는 보다 추상적이며 고객이 실제로 보고 있는 것을 보여줄 수 없습니다.
와이어 흐름 또는 화면 흐름은 두 가지 방법의 장점을 결합하고 사용자가 보는 것이 제품이나 서비스를 경험하는 방식에 큰 영향을 미치는 방법에 대한 사례를 만드는 데 도움이 됩니다.
화면 흐름을 사용해야 하는 경우
와이어프레임은 UX와 제품 팀이 고객 여정을 화면 집합이 아닌 전체 흐름으로 생각할 수 있도록 지원합니다. 와이어 흐름 또는 화면 흐름은 화면 자체와 고객 서비스 또는 제품과의 상호 작용에 초점을 맞춥니다.
디자이너는 필요할 때 화면 흐름을 계획할 수 있습니다.
누락된 시나리오가 없는지 확인: 엔드 투 엔드 전환을 계획하면 고객의 요구에 적용되는 모든 잠재적 사용 사례를 고려할 수 있습니다.
사용자 상호 작용 향상: 가입, 확인 또는 팝업과 같은 흐름의 모든 기회를 통해 고객을 알 수 있습니다.
기능 간 커뮤니케이션 개선: 디자이너와 개발자를 하나로 묶어 별도의 화면이 아닌 전체 경험에 대해 생각하도록 유도합니다.
이해관계자 교육에 참여: 고객 또는 팀이 제품 또는 경험을 통해 이동할 때 고객이 무엇을 보는지 전혀 고려하지 않았다면, 흐름을 따르는 것이 고객의 당면 과제에 대한 공감대를 형성하는 데 도움이 됩니다.
자신만의 화면 흐름 만들기
자신만의 화면 흐름을 만드는 것은 쉽습니다. Miro의 가상 협업 플랫폼은 이를 생성하고 공유할 수 있는 완벽한 캔버스를 제공합니다. 화면 흐름 템플릿을 선택하여 시작한 후 다음 단계를 수행하여 자신만의 템플릿을 만드십시오.
1. 사용자 스토리 정의
시각적 시퀀스 매핑을 시작하기 전에 해결해야 할 사용자의 요구와 문제점을 설명합니다. 이것은 여러분의 화면 흐름을 위한 시작 지점을 설치할 수 있는 기반입니다.
2. 주요 화면에 표시할 내용을 결정합니다.
여정의 시작과 끝점을 곰곰이 생각해 보십시오. 랜딩 페이지가 필요하신가요? 등록 양식 화면입니까? 확인 페이지인가요? 분할해야 하는 페이지 또는 추가해야 하는 화면과 같이 프로세스의 변경 사항 또는 추가 단계를 식별합니다. Miro의 와이어프레임 라이브러리에는 15개 이상의 UI 구성요소가 있으며, 영감을 필요로 하는 경우 화면 흐름에 쉽게 추가할 수 있습니다.
3. 화면 연결
Miro의 연결 선 도구를 사용하여 화살표를 추가하고 사용자가 과제를 따라 갈수 있도록 각 화면들을 연결합니다. 또한 의사 결정 지점을 포함하여 사용 가능한 모든 인스턴스에서 발생하는 작업을 사용자에게 표시할 수 있습니다.
4. 피드백을 위해 팀 또는 이해 관계자와 화면 흐름을 공유합니다.
Miro의 멘션 기능을 사용하여 고객과의 라이브 워크샵 세션 전에 빠른 피드백 라운드, 디자인 비평 또는 리뷰를 위해 팀 또는 개별 사용자에게 태그를 지정할 수 있습니다. Miro 보드를 다른 사람과 공유할 수도 있습니다 (아직 등록되어 있지 않더라도!). 멤버 초대 단추를 클릭합니다.
UX에서 화면 흐름이란 무엇인가요?
화면 흐름은 주로 제품 화면에 집중하면서 사용자의 상호 작용을 분석할 수 있게 해줍니다. 최고의 와이어프레임과 순서도를 결합하여 고객 흐름에 대한 자세한 개요를 제공하기 때문에 더 많은 데이터를 기반으로 사용자 경험을 향상하실 수 있습니다.
프로토타입 템플릿
다음에 경우 적합합니다:
UX Design, Design Thinking
프로토타입은 시각 디자인 등의 최종 디테일에 구애받지 않고 제품의 구조, 사용자 흐름 및 인터페이스 디테일(예: 버튼 및 메뉴)을 정의하는 제품의 실시간 모형입니다. 프로토타입 기능을 사용하면 사용자가 귀하의 제품이나 서비스를 어떻게 경험할지 시뮬레이션하고, 사용자 컨텍스트 및 작업 흐름을 매핑하고, 시나리오를 만들어 캐릭터를 이해하고, 제품에 대한 피드백을 수집할 수 있습니다. 프로토타입 기능을 사용하면 프로세스 초기에 장애 요인을 찾아 비용을 절감할 수 있습니다. 프로토타입의 유형은 다양하지만, 일반적으로 화살표 또는 링크로 연결된 일련의 화면 또는 아트보드가 포함됩니다.
저충실도(Low-fidelity) 프로토타입 템플릿
다음에 경우 적합합니다:
Design, Desk Research, Wireframes
저충실도 프로토타입은 제품 또는 서비스의 실용적인 초기 비전의 역할을 합니다. 이러한 간단한 프로토타입은 최종 제품의 기능 중 몇 가지 만을 공유합니다. 프로토타입은 광범위한 개념을 테스트하고 아이디어를 검증하는데 가장 좋습니다. 저충실도 프로토타입은 제품과 UX 팀이 빠른 반복과 사용자 테스트에 집중해 제품 또는 서비스 기능을 연구하고 향후 디자인에 반영하는데 도움을 줍니다. 콘텐츠, 메뉴, 사용자 흐름을 스케치하고 매핑하는데 초점을 맞추면 디자이너와 디자이너가 아닌 팀원 모두가 디자인과 아이데이션 프로세스에 참여할 수 있도록 해줍니다. 연결된 대화형 스크린을 제작하는 대신, 저충실도 프로토타입을 사용하면 사용자의 요구 사항, 디자이너 비전과 이해 관계자들의 목표 조정에 대한 통찰에 중점을 둡니다.
3시간 브랜드 스프린트 템플릿
다음에 경우 적합합니다:
Marketing, Workshops, Sprint Planning
고객이 브랜드를 신뢰하기 전에 팀이 먼저 신뢰해야 합니다. 브랜드 스프린트가 놀라운 효과를 발휘하는 부분입니다. Google Ventures 팀에 의해 대중화된 브랜드 스프린트는 팀이 브랜드에 대한 다양한 모든 아이디어를 정렬하고 가치, 청중, 성격, 사명 선언문, 로드맵 등 브랜드의 기본적인 요소를 조정할 수 있도록 지원합니다. 새로운 브랜드를 구축하거나 기존 브랜드를 쇄신하든 관계없이 브랜드 스프린트는 회사 이름 지정, 로고 지정, 에이전시 선정 또는 성명서 작성 등 트리거 이벤트에 이상적입니다.
앱 와이어프레임 템플릿
다음에 경우 적합합니다:
UX Design, Wireframes
앱을 만들 준비가 되었습니까? 이 기능이 어떻게 작동하고 사용자가 어떻게 상호 작용할지는 상상만 하지 말고 와이어프레임이 보여주도록 하십시오. 와이어 프레임은 각 화면의 기본 레이아웃을 만드는 기술입니다. 이상적으로 프로세스 초기에 와이어프레임 작업을 수행하면 각 화면이 무엇을 달성하는지 파악하고 중요한 이해 관계자의 동의를 얻은 후 디자인과 콘텐츠를 추가함으로써 시간과 비용을 절약할 수 있습니다. 또한 사용자의 여정 측면에서 사물을 생각함으로써 보다 설득력 있고 성공적인 경험을 제공할 수 있습니다.
웹사이트 와이어프레밍 템플릿
다음에 경우 적합합니다:
Wireframes, User Experience
와이어프레밍은 웹사이트를 구조적 차원에서 설계하는 방법입니다. 와이어프레임은 각 페이지의 인터페이스 요소를 보여주는 웹 페이지의 양식화된 레이아웃입니다 이 와이어프레임 템플릿을 사용하여 웹 페이지에서 빠르고 저렴하게 반복하십시오. 와이어프레임을 고객 또는 팀 동료와 공유하고 이해관계자와 협력할 수 있습니다. 와이어프레임을 통해 팀은 너무 많은 시간이나 자원 투자 없이도 이해 관계자가 받아들이도록 할 수 있습니다. 그들은 여러분의 웹사이트 구조와 흐름이 사용자 요구와 기대에 부응할 수 있도록 도울 수 있습니다.
세일봇 템플릿
다음에 경우 적합합니다:
Agile Methodology, Meetings, Retrospectives
세일봇 회고전은 팀이 프로젝트를 어떻게 처리했는지 되돌아볼 수 있는 편리한 방법입니다. 여러분의 위험 (암초), 지연 문제 (닻), 도움 팀 (바람), 그리고 목표 (육지) 를 정의함으로써 여러분이 잘하고 있는 것과 다음 스프린트를 위해 개선해야 할 것을 알아낼 수 있을 것입니다. 세일봇 은유로 팀 역학을 분석하고 무엇이 작업을 느리게 하고 미래 목표를 달성하는 데 도움이 되는것은 무엇인지를 알아냄으로써 모든 사람들이 함께 무엇을 지향하는지 설명하는 데 도움이 됩니다.