DEISO Visly 및 스토리텔링 인터랙티브 데모
DEISO Visly는 다음을 위한 통합 플랫폼입니다 데이터 시각화, 인터랙티브 대시보드 및 스토리텔링. 25가지 이상의 그래프 유형을 지원하며, 명확하고 몰입도 높은 시각화를 통해 복잡한 정보를 쉽게 이해할 수 있도록 설계되었습니다. 기술 보고서, 비즈니스 인사이트 또는 프로젝트 요약 등 어떤 용도로든 활용할 수 있으며, Visly는 모든 산업과 프로젝트 유형에 맞춰 데이터 기반 스토리를 효과적이고 유연하게 전달할 수 있도록 지원합니다.
이 페이지에서는 DEISO Visly 의 기능을 약 20개의 실시간 인터랙티브 데모 차트를 통해 소개합니다. 방문자는 각 시각화를 실시간으로 탐색하며 데이터가 설득력 있는 인사이트로 전환되는 방식을 경험할 수 있습니다.
데모 1
인터랙티브 차트: 시간에 따른 브라우저 시장 점유율
이 인터랙티브 차트는 2007년부터 2019년까지의 서비스 요청 수를 기준으로 Chrome, Safari, Internet Explorer(IE), Edge, Firefox 및 Opera 등 주요 웹 브라우저 사용 추이를 보여줍니다. 이 시각화는 iframe으로 임베드된 반응형 누적 영역 차트로 제공됩니다. 사용자는 시간에 따른 브라우저 동향을 인터랙티브하게 탐색할 수 있습니다.
X축은 2007년 5월부터 2019년 말까지의 타임라인을 나타내며, 가독성을 높이기 위해 날짜는 MM/DD/YY 형식으로 순환 표기됩니다. Y축은 0.00에서 0.70까지의 정규화된 서비스 사용량 값을 표시하며, 다른 브라우저와 비교한 각 브라우저의 상대적 우위를 나타냅니다.
각 브라우저는 구분과 겹침 영역의 명확한 표현을 위해 고유한 색상과 반투명 채우기로 시각화됩니다. Chrome은 2009년경부터 뚜렷한 상승세를 보이며 2012년에는 IE를 추월했고, 정점은 60% 2019년입니다. 2007년 한때 우위를 차지했던 IE는 높은 60% 점유율을 기록했지만 2010년 이후 급격히 하락합니다. Edge는 이후 등장해 작지만 성장하는 점유율을 보이는 반면, Firefox, Safari, Opera는 소폭의 변동 속에서도 비교적 일관된 수준을 유지합니다.
두 가지 주요 주석이 시장 전환을 강조합니다. 2012년 Chrome은 28%에 도달한 반면 IE는 32%로 하락했습니다. 2019년에는 Chrome이 60%까지 확대되었고, IE와 Edge를 합쳐도 7%에 불과했습니다. 이러한 주석은 강조를 위해 콜아웃 선과 텍스트로 표시됩니다.
사용자 인터페이스 기능으로는 언어 선택, 다크/라이트 모드 전환, 확대·축소 도구가 포함됩니다. 차트는 기기 전반에서 반응성을 유지하도록 16:9 화면 비율로 임베드됩니다. 임베드 스타일은 최소화되어 있으며, 웹사이트나 대시보드에 매끄럽게 통합할 수 있도록 전체 화면 및 스크롤 권한을 제거했습니다.
이 데모 차트는 시간에 따른 브라우저 사용 추이와 플랫폼 우위를 제시하는 고급 인터랙티브 시각화 제품군의 일부입니다.
데모 2
인터랙티브 지도: 일본 도도부현별 인구 분포
이 인터랙티브 단계구분도는 일본 47개 도도부현 전체의 인구 분포를 시각화합니다. 차트는 색상 그라데이션으로 각 도도부현의 인구 규모를 나타내어 인구 밀집 지역과 저밀도 지역을 빠르게 식별할 수 있습니다. 빨간색이 진할수록 인구가 많습니다.
배경은 시각적 대비를 위해 짙은 네이비 블루로 표현되며, 오른쪽의 인구 그라데이션 막대는 연한 분홍색(낮은 인구, 약 87만 8,000명)부터 짙은 빨간색(높은 인구, 900만 명 이상)까지 이어집니다. 이 색상 척도를 통해 전국의 인구 패턴을 쉽게 파악할 수 있습니다.
각 지역은 명확하게 구분되며 인터랙티브하게 작동합니다. 사용자가 도도부현에 마우스를 올리거나 클릭하면 다음 정보를 보여주는 툴팁이 표시됩니다.
도도부현명( 일본어) (e.g., 北海道)
영문 명칭 영어 (예: Hokkaido)
이 총인구 단위: 반올림한 백만 명 (예: 5M)
지도에서는 도쿄가 가장 인구 밀도가 높은 지역으로 짙은 빨간색으로 표시되며, 오사카와 가나가와 등의 도도부현이 그 뒤를 잇습니다. 돗토리와 시마네 등 인구가 적은 지역은 더 옅은 색조로 나타납니다.
주요 사용자 인터페이스 기능으로는 오른쪽 상단의 언어 전환 기능(기본값은 영어), 왼쪽의 확대·축소 기능, 접근성을 위한 왼쪽 하단의 라이트/다크 모드 전환 기능이 포함됩니다. 지도는 완전 반응형으로 구현되며 16:9 기기 전반에서 최적의 표시를 위한 화면 비율로 임베드됩니다.
이 인터랙티브 지도는 지리적 인구통계 분석 및 지역 계획 수립에 적합합니다. 사용자가 인구 분포를 직관적으로 탐색할 수 있는 인터페이스를 제공하며, 모든 웹사이트나 데이터 대시보드에 원활하게 임베드할 수 있습니다.
데모 3
인터랙티브 막대 차트: 미국 주별 평균 자동차 보험 비용
이 인터랙티브 막대 차트는 평균 자동차 보험 비용을 색상으로 구분된 세로 막대를 사용해 선택된 미국 주 전반에 걸쳐 시각화합니다. 각 막대는 하나의 주에 해당하며 자동차 보험에 지출된 평균 금액을 나타냅니다.
이 Y축 에는 $0부터 $500까지의 금액 단위가 표시됩니다. 빨간색 기준선 은 평균 기준을 나타내는 $300 수준에 표시됩니다. 이 선보다 높은 막대는 평균보다 높은 보험 비용을, 낮은 막대는 더 낮은 비용을 의미합니다.
주는 X축 에 두 글자 약어로 표시됩니다. 예: AL(Alabama), CA(California), NY(New York) 등.
각 막대는 인터랙티브하게 작동합니다:
사용자가 클릭하거나 마우스를 올리면 막대 위에 다음 정보를 표시하는 툴팁이 나타납니다:
이 주 이름
이 정확한 보험 비용 (예: California의 경우 “$452”)
막대는 각각 색상으로 구분되어 시각적으로 구별되므로 나란히 비교하기 쉽습니다.
차트의 예시 값:
CA(California): $452(차트 내 최고값)
NY(New York): $447
MT(Montana): $45(차트 내 최저값)
GA(Georgia): $405
AZ (애리조나): $220
시각 효과:
차트에는 검은색 배경이 대비를 위해 적용됩니다.
격자선은 가독성을 높입니다.
접근성을 위해 라이트/다크 모드 전환 기능을 사용할 수 있습니다.
마우스를 올리면 선택 상태를 나타내기 위해 막대가 애니메이션 효과를 보이거나 약간 밝아질 수 있습니다.
이 막대 차트는 주별 자동차 보험 비용을 빠르게 비교 분석하는 데 적합하며, 비용 벤치마킹이나 정책 연구의 의사결정을 지원합니다.
데모 4
- 이 매트릭스는 0~100 범위의 예측력 지수(PPI)를 사용하여 데이터 세트 내 서로 다른 열 간의 예측력을 보여줍니다. 점수 0은 예측 능력이 없음을, 100은 완벽하게 예측할 수 있음을 의미합니다. 매트릭스는 한 열이 다른 열을 얼마나 잘 예측하는지 보여주며, 예측력의 강도는 사각형의 어두운 정도로 표시됩니다.
- 예를 들어 Product 열은 점수 100으로 Product의 Topics 분류를 완벽하게 예측할 수 있습니다. 그러나 반대 방향의 예측력은 더 낮으며, Product의 Topics 분류가 Product를 예측하는 점수는 70입니다. 마찬가지로 Quantity Ordered는 점수 16으로 Order Date를 예측할 수 있지만, Order Date는 점수 0으로 Quantity Ordered를 전혀 예측할 수 없습니다.
- 사각형이 어두울수록 예측 관계가 강합니다. 더 어두운 사각형은 유용한 차트를 만드는 데 더욱 의미가 있습니다. 범례는 양의 상관관계와 음의 상관관계를 모두 나타내며, 음영 처리된 사각형은 순서가 없는 범주로 인해 상관관계를 판단할 수 없음을 의미합니다. 이러한 판단 불가능한 상관관계는 일반적으로 Country, Gender 또는 Eye color처럼 논리적 순서가 없는 범주를 가진 열 중 하나에서 발생합니다.
- 사각형 위에 마우스를 올리면 각 특성 쌍에 대한 자세한 정보를 확인할 수 있습니다. 이 매트릭스는 데이터 세트 내 서로 다른 열 간의 예측 관계를 파악하여 더욱 효과적인 데이터 분석과 시각화를 지원합니다.
데모 5
- 이 막대 차트는 제품별 평균 가격을 높은 순서대로 표시합니다. 차트에는 10개 제품이 포함되어 있으며, 각 제품 그룹의 가격을 집계하여 평균 가격을 계산했습니다. 평균 가격이 가장 높은 제품은 Printer로, $134.22입니다. Printer 다음으로 Mouse의 평균 가격은 $114.88이며, Tablet의 평균 가격은 $111.73입니다. 차트에는 Desk, Monitor, Chair, Keyboard, External Hard Drive, Laptop 및 Headphones도 포함되어 있으며, 평균 가격은 $109.60에서 $72.68 범위입니다. 막대는 이러한 평균 가격을 시각적으로 나타내므로 각 제품의 비용을 쉽게 비교할 수 있습니다.
DEMO 6
- 이 막대 차트는 제품 카테고리별 평균 가격을 높은 순서부터 낮은 순서로 보여 줍니다. 카테고리는 사무용 장비, 컴퓨팅 기기, 사무용 가구, 컴퓨터 액세서리, 저장 장치 및 기타를 포함합니다. 사무용 장비의 평균 가격은 $134.22로 가장 높고, 컴퓨팅 기기는 $111.73, 사무용 가구는 $106.64로 그 뒤를 잇습니다. 컴퓨터 액세서리와 저장 장치의 평균 가격은 각각 $95.77 및 $95.06입니다. 기타 카테고리의 평균 가격은 $81.60으로 가장 낮습니다. 이 차트는 제품 카테고리별 평균 가격의 차이를 효과적으로 보여 줍니다.
DEMO 7
- 이 막대 차트는 각 그룹 분류별로 집계한 6개 제품 카테고리의 평균 주문 수량을 보여 줍니다. 카테고리는 평균 주문 수량이 높은 순서부터 낮은 순서로 정렬되어 있습니다.
- 컴퓨터 액세서리의 평균 주문 수량은 204로 가장 높고, 사무용 가구가 평균 109로 뒤를 잇습니다. 컴퓨팅 기기의 평균은 74이며, 저장 장치는 평균 59입니다. ‘기타’ 카테고리의 평균 주문 수량은 45이고, 사무용 장비는 평균 32로 가장 낮습니다.
- 이 차트는 해당 제품 카테고리 전반의 평균 주문 수량을 명확하게 시각화하여 각 그룹의 상대적 수요를 보여 줍니다.
DEMO 8
- 누적 막대 차트는 한 범주형 변수의 여러 카테고리에 걸친 다른 범주형 변수의 구성을 시각화합니다. 이 차트의 범주형 변수는 “주문 수량”과 “제품”입니다. “제품”은 모니터, 태블릿, 책상, 키보드, 헤드폰, 외장 하드 드라이브, 노트북, 의자, 마우스 및 프린터의 10개 카테고리로 구성됩니다. “주문 수량” 역시 1부터 10까지 10개 카테고리로 구성됩니다.
- 차트의 각 열은 서로 다른 주문 수량을 나타내며, 각 열 안에서는 10개 제품 카테고리의 비율이 누적되어 합계가 100%이 됩니다. 예를 들어 “주문 수량 1” 열에서 모니터를 나타내는 구간의 비율은 57.14%이며, 이는 수량 1의 전체 주문 중 57.14%가 모니터 주문임을 의미합니다. 마찬가지로 다른 제품 카테고리도 각 열 내의 서로 다른 구간으로 표시되어 주문 수량별 비율을 보여 줍니다.
- 이 차트는 다양한 주문 수량에 따른 제품 분포를 효과적으로 보여 주며, 수량 측면에서 제품 주문이 어떻게 구성되는지 명확하게 시각화합니다.
DEMO 9
- 이 막대 차트는 제품 유형별로 집계한 10개 제품의 평균 주문 수량을 보여 줍니다. 제품은 평균 주문 수량이 높은 순서부터 낮은 순서로 정렬되어 있습니다. 키보드의 평균 주문 수량은 75로 가장 높고, 태블릿이 평균 74로 근소한 차이로 뒤를 잇습니다. 모니터와 책상의 평균은 각각 65와 62입니다. 외장 하드 드라이브의 평균 주문 수량은 59이며, 의자와 노트북의 평균은 각각 47과 45입니다. 헤드폰, 프린터 및 마우스의 평균은 각각 38, 32 및 26으로 가장 낮습니다. 제품별 표본 수는 각 제품의 평균 산정에 포함된 주문 건수를 나타내며 서로 다릅니다. 예를 들어 키보드의 평균은 13개 표본을 기준으로 산정되었고, 마우스의 평균은 5개 표본을 기준으로 산정되었습니다. 이 차트는 제품별 평균 주문 수량을 명확하게 비교하여 각 품목의 상대적 인기도 또는 수요를 보여 줍니다.
DEMO 10
- 누적 막대 차트는 한 범주형 변수의 서로 다른 카테고리에 걸친 다른 범주형 변수의 구성을 시각화합니다. 이 차트에서 “주문 수량”과 “제품 주제 분류”가 범주형 변수입니다. “주문 수량”은 1부터 10까지 10개 카테고리로 구성되며, “제품 주제 분류”는 컴퓨터 액세서리, 사무용 가구, 컴퓨팅 기기, 저장 장치, 기타 및 사무용 장비의 6개 카테고리로 구성됩니다.
- 차트의 각 막대는 서로 다른 주문 수량을 나타내며, 각 막대 안에서는 6개 제품 카테고리의 비율이 누적되어 합계가 100%이 됩니다. 예를 들어 컴퓨터 액세서리를 나타내는 구간은 각 주문 수량별 해당 카테고리의 비율을 보여 줍니다. 주문 수량 1에서 컴퓨터 액세서리는 전체의 71.43%를 차지하며, 이는 수량 1의 전체 주문 중 71.43%가 컴퓨터 액세서리 주문임을 의미합니다.
- 마찬가지로 각 막대 내의 다른 구간은 주문 수량별 사무용 가구, 컴퓨팅 기기, 저장 장치, 기타 및 사무용 장비의 비율을 나타냅니다. 예를 들어 주문 수량 2에서 사무용 가구는 18.75%, 컴퓨팅 기기는 18.75%, 저장 장치는 12.50%, 기타는 18.75%, 사무용 장비는 6.25%를 차지합니다.
- 이 차트는 주문 수량에 따라 제품 카테고리 분포가 어떻게 달라지는지 효과적으로 보여주며, 데이터를 명확하게 시각화합니다.
DEMO 11
- 시계열 그래프는 시간에 따른 변수 값의 변화를 보여주는 그래프 유형입니다. 이 경우 그래프는 2022년 12월 30일부터 2023년 12월 24일까지 제품의 평균 가격(“개당 가격”)을 보여줍니다. 그래프의 선은 이 기간 내 각 날짜의 평균 가격을 나타냅니다.
- 기록된 최고 가격은 195.82이며, 2023년 10월 31일에 발생했습니다. 이 그래프는 지정된 기간 동안 제품 가격의 변동을 시각적으로 보여주어 데이터의 추세와 패턴을 쉽게 파악할 수 있도록 합니다.
DEMO 12
- 시계열 그래프는 2022년 12월 30일부터 2023년 12월 24일까지 시간에 따른 제품 주문 수량의 변화를 보여줍니다. 그래프는 이 기간 내 각 그룹의 평균 주문 수량을 강조합니다. 그래프의 데이터 포인트는 특정 날짜의 주문 수량을 나타내며, 연간 변동과 추세를 보여줍니다.
- 최대 주문 수량은 15개로, 2023년 7월 24일에 발생했습니다. 이 정점은 해당 날짜의 높은 수요를 나타내는 데이터셋의 중요한 지점입니다. 그래프는 시간에 따른 주문 수량 변화를 명확하게 시각화하여 주문 행태의 패턴, 추세 및 이상치를 쉽게 식별할 수 있도록 합니다.
- 전반적으로 시계열 그래프는 제품 주문의 시간적 변화를 이해하는 데 유용한 도구로서, 주어진 기간 내 평균 수량과 구체적인 최고점 및 최저점을 함께 보여줍니다.
DEMO 13
- 차트에 따르면 태블릿 카테고리가 전체의 16%를 차지하며 가장 큰 비중을 보입니다. 그다음은 13%를 차지하는 키보드 카테고리입니다. 모니터 카테고리는 12%를 차지하며, 노트북, 헤드폰, 외장 하드 드라이브 및 책상 카테고리는 각각 10%를 차지합니다. 의자 카테고리는 8%, 프린터 카테고리는 6%, 마우스 카테고리는 5%를 차지합니다.
- 이 시각화 도구는 각 제품 카테고리의 상대적 비중을 효과적으로 강조하여 데이터셋에서 가장 많고 적은 제품을 쉽게 식별할 수 있도록 합니다. 예를 들어 태블릿이 가장 일반적인 제품인 반면, 마우스가 가장 적은 제품임을 명확히 알 수 있습니다.
DEMO 14
- 누적 막대 차트는 한 범주형 변수의 전체 구성을 다른 범주형 변수의 여러 카테고리에 걸쳐 시각화합니다. 이 경우 차트는 “제품 주제 분류”의 6개 카테고리에서 다양한 제품의 분포를 보여줍니다. “제품”과 “제품 주제 분류”는 모두 그룹화하거나 분류할 수 있는 텍스트 레이블로 구성된 범주형 변수입니다.
- “제품” 변수에는 외장 하드 드라이브, 노트북, 프린터, 태블릿, 책상, 의자, 키보드, 모니터, 헤드폰 및 마우스의 10개 카테고리가 포함됩니다. “제품 주제 분류” 변수에는 기타, 사무용 가구, 사무용 장비, 컴퓨팅 기기, 컴퓨터 액세서리 및 저장 장치의 6개 카테고리가 포함됩니다.
- 차트의 각 막대는 하나의 제품을 나타내며, 각 막대 내 구간은 “제품 주제 분류”의 6개 카테고리에 걸친 해당 제품의 백분율 분포를 보여줍니다. 각 제품 카테고리의 백분율은 막대 내에 누적되어 합계가 100%가 됩니다. 예를 들어 외장 하드 드라이브를 나타내는 구간은 전체가 저장 장치 카테고리에 속하며, 이는 외장 하드 드라이브의 100%가 이 분류에 해당함을 의미합니다. 마찬가지로 노트북 카테고리도 전체가 컴퓨팅 기기 분류에 속합니다.
- 이 차트는 각 제품이 여러 카테고리에 걸쳐 어떻게 분류되는지 명확하게 시각화하여 제품의 분포와 분류를 한눈에 이해할 수 있도록 합니다.
데모 15
- 카운트 플롯은 어떤 범주가 더 자주 발생하는지 확인하고 범주 간 비교를 쉽게 할 수 있도록 하는 막대 차트입니다. 이 카운트 플롯은 발생 비율을 기준으로 10개 제품 범주의 분포를 보여 줍니다.
- 이 차트에서 태블릿 범주는 전체의 16%를 차지하며 가장 높은 비율을 보입니다. 태블릿 다음으로 키보드는 13%, 모니터는 12%를 차지합니다. 헤드폰, 외장 하드 드라이브, 노트북 및 책상은 각각 전체의 10%를 차지합니다. 의자는 8%, 프린터는 6%, 마우스는 5%를 차지합니다.
- 이 시각화는 각 제품 범주의 상대적 발생 빈도를 효과적으로 보여 주어 어떤 제품이 더 자주 주문되는지 명확히 파악할 수 있게 합니다.
데모 16
- 이 도넛 차트는 제품 주제 분류 내 6개 범주의 분포를 보여 줍니다. 차트는 각 범주가 전체에서 차지하는 비율을 시각적으로 나타냅니다. 컴퓨터 액세서리가 전체의 40%를 차지하며 가장 큰 비중을 보입니다. 그다음으로 사무용 가구는 18%, 컴퓨팅 기기는 16%를 차지합니다. 저장 장치와 기타로 분류된 범주는 각각 전체의 10%를 차지합니다. 사무용 장비는 6%로 가장 낮은 비중을 차지합니다. 이 시각화를 통해 각 범주의 상대적 비중을 즉시 파악할 수 있습니다.
데모 17
- 커널 밀도 플롯은 단일 수치 변수의 분포를 나타내며, 특정 구간에 데이터가 얼마나 집중되어 있는지 효과적으로 보여 줍니다. x축은 “Price Each’와 같이 해당 변수가 가질 수 있는 모든 값의 범위를 나타냅니다. 그래프가 높을수록 해당 값이 발생할 확률이 높습니다. 예를 들어 ”Price Each“ 값은 35.65 부근에 가장 집중되어 있습니다.
- 두 값 사이 그래프 아래의 면적은 해당 구간에 존재하는 “Price Each” 값의 비율에 해당합니다. 예를 들어 40.97과 161.23 사이의 그래프 아래 영역을 음영 처리하면 전체 “Price Each” 값 중 약 52%가 이 범위에 속함을 확인할 수 있습니다.
- 그래프의 정확한 높이를 알 필요는 없습니다. 대신 그래프 형태의 이상치나 변화를 식별하는 것이 더 유용합니다. 예를 들어 x축이 고객 지출을 나타낸다면, 오른쪽으로 길게 이어지는 꼬리는 일부 고객이 다른 고객보다 훨씬 많은 금액을 지출하고 있음을 의미합니다.
데모 18
- 이 차트는 2022년 12월 30일부터 2023년 12월 24일까지 시간에 따른 변수의 평균 건수를 보여 주는 시계열 플롯입니다. 그래프의 각 데이터 포인트는 특정 날짜의 평균 건수를 나타냅니다. 값은 1.0에서 2.0 사이에서 변동하며, 최대 건수인 2.0은 2023년 1월 3일을 비롯한 여러 날짜에 나타납니다. 이 플롯은 지정된 기간 동안 평균 건수가 어떻게 변화하는지 명확하게 보여 주므로 데이터의 추세와 패턴을 쉽게 파악할 수 있습니다.
