다음을 통해 공유


Search 2013의 호버 패널 소개

최초 문서 게시일: 2012년 10월 9일 화요일

안녕하세요, 저는 SharePoint 검색 사용자 환경에서 프로그램 관리자로 근무하는 Patrick Quinn입니다. 저는 오늘 여러분들께 SharePoint Server 2013의 새로운 검색 사용자 인터페이스 기능 중 가장 흥미로운 기능 하나를 소개해드리고자 합니다.  바로...

...새로운 호버 패널입니다!

 

 새로운 검색 인터페이스 및 호버 패널

새로운 검색 인터페이스 및 호버 패널

 

이번 릴리스의 UI를 디자인할 때 저희는 관련 정보를 최종 사용자에게 가능한 한 계속 표시한 상태에서 각각의 결과를 쉽고 빠르게 찾아서 읽을 수 있도록 하는 데 주력했습니다. 하지만 이 두 가지 개념은 서로 상충되는 일이 많습니다. 결과에 더 많은 정보를 추가할수록 UI는 점점 더 "복잡"해집니다. 그리고 UI가 점점 더 "복잡"해질수록 원하는 내용을 쉽게 찾기가 어렵습니다. 따라서 정보의 양과 정보의 구성 사이에 적절한 균형이 필요합니다.

호버 패널(마우스를 위로 가져갔을 때 표시되는 창)은 이 릴리스에 추가된 흥미로운 기능 중 하나입니다. 그리고 이 기능은 바로 이러한 균형 문제를 효과적으로 해결해줍니다. 저희는 인라인 결과에 대부분의 결과에 공통적인 중요 메타데이터(예: 제목, URL 및 중요 요약 내용)만 포함하도록 만들었습니다. 이렇게 간소화된 결과를 통해 사용자는 원하는 페이지를 쉽게 찾을 수 있습니다. 그런 다음, 사용자가 특정 결과에 대해 보다 자세한 정보를 보고 싶은 경우, 커서를 해당 결과 위로 가져가면 호버 패널 대화 상자가 표시됩니다. 호버 패널에는 사용자가 클릭해서 문서를 로드할 필요 없이 결과를 보다 자세히 조사할 수 있도록 다양한 메타데이터가 포함되어 있습니다.

 

호버 패널에는 파일 형식, 결과가 마지막으로 편집된 날짜, 최근에 결과를 편집한 사용자, 조회수(해당 문서가 얼마나 자주 조회되었는지 확인)와 같은 중요한 메타데이터가 포함되었습니다. 하지만 단순히 메타데이터만 추가된 것이 아닙니다. 문서 구문 분석 도구를 통해 섹션 제목과 문서 내의 슬라이드 제목을 인덱싱할 수 있으며, 사용자의 쿼리와 관련이 있는 제목을 표시할 수 있습니다. 이러한 기능을 "딥 링크"라고 부르며 호버 패널에서 "자세히 살펴보기"라는 제목 아래에서 확인할 수 있습니다. 더욱이 이러한 제목이 링크로 설정되어, 제목을 클릭하면 해당 문서의 섹션(또는 슬라이드)으로 직접 이동할 수 있습니다. 이제는 수백만 개의 문서를 검색하면서도 한 번의 클릭으로 원하는 문서의 특정 섹션으로 바로 이동할 수 있습니다.  

호버 패널 미리보기, 문서 링크 및 작업 자세히 살펴보기

호버 패널 미리보기, 문서 링크 및 작업 자세히 살펴보기

 

호버 패널의 하단에는 결과에 대해 수행할 수 있는 작업 목록이 있습니다. 이제는 문서를 따르거나 문서를 열고, 문서 라이브러리를 보고, 결과 페이지에서 바로 전자 메일 메시지로 문서를 보낼 수 있습니다. 이러한 작업은 완전히 사용자 지정이 가능하므로 결과에 대한 작업 효과를 이전보다 훨씬 다양화할 수 있습니다.

 

호버 패널에서 가장 유용한 기능은 아마도 SharePoint에 저장된 모든 Office 문서에서 제공되는 고품질 웹 응용 프로그램 뷰어 미리 보기일 것입니다. 이러한 대화형 미리 보기는 커서를 위로 가져간 문서의 구조, 내용 및 스타일을 한 눈에 확인할 수 있도록 충분히 크게 디자인되어 있습니다. 문서의 페이지를 이동하고, 차트 및 테이블을 보고, PowerPoint 슬라이드를 애니메이션으로 볼 수도 있습니다. Word 미리 보기 텍스트가 너무 작게 표시되더라도 두 번 클릭하면 확대됩니다. 사용자가 검색 결과를 이보다 더 쉽게 확인하기는 어려울 것입니다. 이제는 전체 문서를 빠르게 훑어보면서 자신이 원하는 항목인지 빠르게 판단할 수 있습니다. 이러한 미리 보기는 단지 문서로만 제한되지 않습니다. 호버 패널에는 웹 페이지에 대한 다양한 미리 보기를 표시하므로, 클릭하지 않고도 안의 내용을 쉽게 확인할 수 있습니다. 비디오 뷰어도 내장되어 있어서 클릭하지 않고 쉽게 확인할 수 있습니다.

비디오 호버 패널로 비디오 재생 가능

비디오 호버 패널로 비디오 재생 가능

 

확실히 호버 패널에서는 다양한 데이터를 표시할 수 있습니다. 그렇다면 처음에 디자인을 고려할 때의 과제가 다시 떠오를 수 있습니다. 호버 패널에 너무 많은 데이터를 표시하다 보면 또 다시 데이터에 대한 전반적인 가독성이 떨어질 수 있을지도 모릅니다. 이러한 문제는 UI의 새로운 기능인 결과 유형이 해결해줄 수 있습니다. 저희는 모든 결과에 대해 위의 모든 데이터를 단일 호버 패널에 채워 넣지 않았습니다. 대신 결과 유형 규칙을 사용해서 사용자가 찾고자 하는 결과의 '유형'을 결정하고 이러한 규칙에 따라 올바른 호버 패널이 표시됩니다. 

 

결과 유형에 따라 결과 범주를 적합한 렌더링으로 매핑

결과 유형에 따라 결과 범주를 적합한 렌더링으로 매핑

 

기본적으로 각 호버 패널은 사용자가 찾고자 하는 결과에 맞게 사용자 지정됩니다. 커뮤니티 사이트 위로 커서를 가져가면 가장 일반적인 토론이 표시됩니다. Office 문서 위로 커서를 가져가면 문서 미리 보기가 표시됩니다. 토론 스레드 위로 커서를 가져가면 몇 개의 사용자 의견이 표시됩니다. 사용자 검색의 경우 사용자가 작성한 문서 중 검색 쿼리와 관련이 있는 것을 보여줍니다. 이러한 방식으로 호버 패널에 표시되는 정보를 복잡하지 않게 만들고 가장 중요한 정보만 항상 표시되도록 보장할 수 있습니다.

이 게시물을 통해 저는 호버 패널을 어떻게 왜 도입했는지를 소개하고 어떠한 용도로 사용할 수 있는지에 대해 설명드렸습니다. 이후 블로그에서는 사용자 고유의 결과 유형에 대해 호버 패널을 사용자 지정하는 방법에 대해 소개하겠습니다.

이 문서는 번역된 블로그 게시물입니다. 원본 문서는 Introduction to Hover Panel in Search 2013을 참조하십시오.