페이지 및 뷰 커스터마이즈

지금까지 네비게이션 기능과 워크플로우에 대해 알아보았습니다. 이제 다음 사항에 대해 자세히 살펴보겠습니다.

a) 워크플로우 자동화 및
b) 스튜디오에서 일관된 워크플로우 유지

먼저, 더 많은 일정 정보를 입력하고 좀 더 진행한 태스크(Tasks) 페이지부터 살펴보겠습니다. 프로듀서 및 매니저는 여기서 일정을 조정하고 입찰 내용과 실제 현황을 한눈에 파악할 수 있습니다. 이 뷰는 일정과 직접 상호 작용할 수 있다는 점에서도 유용하지만, 프로젝트가 진행됨에 따라 입찰 내용과 실제 현황의 요약 정보를 볼 수 있다는 점에서도 대단히 도움이 됩니다. 그럼, 시작하겠습니다.

먼저, 페이지를 디자인하고 새 뷰를 만들어 보겠습니다.

몇 가지 뷰 중에서 선택할 수 있습니다.

  • 그리드(Grid): 레코드 목록을 표시하는 뷰입니다.
  • 썸네일(Thumbnail): 각 레코드를 보다 시각적으로 보여 주는 뷰입니다. 
  • URL: 웹 페이지의 전체 페이지를 볼 수 있습니다.

각기 고유한 데이터 유형을 표시할 수 있는 다양한 위젯으로 구성된 페이지인 캔버스(Canvas) 유형을 선택하겠습니다. 대부분의 페이지에는 새 뷰가 있을 수 있습니다. 이를 통해 새 페이지를 만들지 않고도 더 많은 정보를 유연하게 표시할 수 있습니다. 부서 뷰에 적합하며 통계와 같은 프로덕션 세부 정보를 표시할 수 있습니다. 또한 뷰에 대한 액세스를 제한할 수도 있습니다. 여기서는 매니저 및 관리자(Admin)로 제한합니다.

이제 처음 두 개의 위젯을 추가해 보겠습니다. 사전 구성된 두 개 위젯이 맨 아래에 있습니다.

  1. 태스크 상태 및
  2. 부서당 태스크 위젯입니다.

에셋 및 샷을 표시하도록 구성하고 있는 그대로 사용해 보겠습니다. 사전 구성된 위젯을 다른 위젯의 기반으로 사용하면 좋습니다. 이를 통해 입찰 항목과 실제 현황에 대해 생성하는 다음 그래프의 컨텍스트가 설정됩니다.

이제 다음을 수행합니다.

  • 그래프 위젯을 캔버스에 추가하고
  • 레이아웃을 약간 조정한 다음
  • 태스크를 표시하도록 구성하고
  • 위젯 이름을 "Bids vs. Actuals"로 지정합니다.

다음으로, 데이터 세트를 구성합니다. 수직(Vertical) 그래프 유형이 마음에 들지만 다른 유형도 살펴봅니다.

그래프 스타일의 경우 막대(Bar)가 가장 적합하지만 다른 옵션도 있습니다.

다음을 수행하겠습니다.

  • 파이프라인 단계로 그래프를 표시하고
  • "로깅한 시간 - 입찰 초과/미만(Time Logged - Over/Under Bid)"을 기준으로 요약하고
  • 합계를 계산하고
  • 원하는 대로 색상을 조정하고
  • 위젯을 저장하면 아티스트가 시간 로깅을 시작한 후 시간이 초과되었는지 기준 미만인지 여부를 확인할 수 있습니다.

아직 디자인 페이지(Design Page) 모드에 있으므로 이 새 뷰를 커밋하려면 페이지를 저장해야 합니다. 이 페이지를 방문할 때 팀에게 이 뷰가 표시되도록 일정 뷰를 기본 뷰로 설정한 다음 저장합니다.

이제 프로듀서 팀과 공유하겠습니다. "Bids vs. Actuals" 뷰를 선택한 다음 URL 링크를 복사하여 해당 뷰에 대한 직접 링크를 전달할 수 있습니다. 다음 작업도 수행할 수 있습니다.

  • 이미지로 그래프 내보내기
  • 데이터 내보내기
  • 인쇄하여 다른 작업자와 공유

각 그래프는 대화식이므로 필요한 경우 자세한 내용을 상세하게 확인할 수 있습니다.

프로듀서를 위한 멋진 뷰를 만들었으므로 이제 팀을 위한 대시보드를 만들고 프로젝트 네비게이션 막대로 승격시켜 모든 사람의 첫 화면에 표시되도록 하겠습니다. 이렇게 하면 모든 사람이 프로젝트 전체 현황 및 진행률을 한 눈에 확인할 수 있습니다.

먼저 새 페이지를 만든 다음 “Dashboard”라고 지정합니다. 다시 한 번 이 페이지를 캔버스 유형으로 만들고 디자인 페이지 모드로 전환하여 몇 가지 위젯을 추가하겠습니다.

먼저, 썸네일 위젯을 추가하여 Drednots 프로젝트의 시각적 표현을 추가하겠습니다. 그러면 현재 프로젝트와 연관된 기본 썸네일이 표시됩니다.

이제 그래프 위젯을 추가하고 알파벳순으로 유형별 그래프를 작성한 다음 상태별로 그룹화하고 스택을 조정하여 에셋 진행 상황을 표시해 보겠습니다.

다음으로, 상태 색상이 사이트 전체에서 팀이 보는 것과 일치하도록 "상태 색상 사용(Use Status Colors)"을 선택합니다.

그런 다음 그래프 맨 아래에 합계를 표시하고 맨 위 막대 색상을 조정하고 위젯을 저장합니다.

샷과 유사한 그래프를 이번에는 파이 그래프로 표시해 보겠습니다. 파이 그래프에서는 내부 반지름(%)을 조정할 수도 있습니다. 여기서는 40%를 적용하겠습니다.

세 개의 위젯이 첫 번째 행에 균일하게 분포되도록 뷰를 조정합니다.

프로젝트 완료 카운트다운을 추가하는 것도 좋을 것 같습니다. 하나의 큰 마일스톤으로의 견인차 역할을 하는 데 도움이 될 것입니다. 다 함께 축하할 수 있도록 프로젝트의 모든 작업자를 추가하는 것이 좋겠습니다.

이제 영역 스타일 그래프를 추가하여 태스크 진행률을 표시하겠습니다. 또한 파이프라인 단계별로 그래프를 표시한 다음 상태별로 그룹화하겠습니다. 팀에게 파이프라인 흐름을 보기 좋게 표시하고 투명하게 관리할 수 있습니다.

이제 마무리 단계로, 모든 사람이 프로젝트를 방문할 때 이 페이지를 볼 수 있도록 승격해 보겠습니다. 페이지 설정에서 "네비게이션에 추가(Add to Navigation)"를 선택한 다음 프로젝트 상세 정보를 다시 정렬 및 제거하여 첫 번째 페이지를 새 "Dashboard" 페이지로 바꿉니다. 설정이 완료되었습니다. 우리의 글로벌 팀이 이제 프로젝트의 중요한 정보를 알 수 있게 되었습니다.

다음 >>

팔로우