[펌] flash와 SVG

SVG

 

SVG(Scalable Vector Graphics)는 웹 개발자, 디자이너 및 사용자가 간단한 선언 방식의 프로그래밍 모델을 통해 HTML의 한계를 뛰어넘어 견고한 비주얼 컨텐츠와 대화형 기능을 작성할 수 있는 W3C 표준 XML 기반 이미징 모델입니다.

 

XML 개발자는 이 강력한 기술을 통해 전자 상거래 시스템, 기업 데이터베이스 등의 실시간 데이터 소스에서 가져온 데이터 구동 방식의 대화형 및 맞춤형 그래픽에 기초한 웹 응용 프로그램을 만들 수 있습니다. 또한 개발자는 사용자가 데이터에 대한 대화형 작업을 수행하는 방법에 관계 없이 다양한 이용자층, 문화 및 통계 자료에 맞게 SVG를 사용자 정의할 수 있습니다. W3C에 의해 개발된 이 기술을 사용하면 다음과 같은 이점이 있습니다.

• 개발자가 SVG의 XML 구문을 통해 기존 기술을 사용하고 기존 XML 기반 인프라 및 개발 도구를 활용할 수 있습니다.
• SVG는 HTML, GIF, JPEG, PNG, SMIL, ASP, JSP, JavaScript 같은 현재의 웹 기술과 통합하여 기존의 브라우저 기반 응용 프로그램에 삽입되어 더욱 견고한 시각화 및 데스크탑과 비슷한 GUI를 제공할 수 있습니다.
• SVG에서 만든 그래픽은 다양한 플랫폼 및 장치를 통해 품질을 유지하면서 크기를 조정할 수 있습니다.
• SVG 응용 프로그램은 유지 관리 시간을 급격하게 단축할 수 있습니다.
• 개발자와 디자이너는 공동으로 그래픽을 만들어 개발 시간을 줄이고 작업 배포 효율을 높일 수 있습니다.
• SVG는 디자인을 컨텐츠와 분리하므로 업데이트하기 쉽습니다.
• SVG 기술을 통해 클라이언트와 서버 간에 증분 데이터만 전송하고 클라이언트 플랫폼의 처리 능력을 사용하여 그래픽 렌더링을 수행하여 서버의 부하 및 대역폭 사용을 줄일 수 있습니다.
• Adobe® Reader® 소프트웨어와 함께 수백만 대의 데스크탑에 배포된 Adobe SVG Viewer를 통해 Windows®, Mac 및 Linux® PC의 브라우저에서 단일 SVG 렌더링 및 JavaScript 대화형 기능을 체험할 수 있습니다.
• SVG에 대한 산업 분야의 지원을 통해 PDA, 휴대폰, 신형 핸드헬드 장치 등 PC가 아닌 장치에도 컨텐츠를 배포할 수 있습니다.

출처 - 어도브

 

인터넷 익스플로러 6 이상에서 SVG 를 볼려면 Adobe 의 SVG Viewer를 설치해야된다. 현재 SVG Viewer은 3.02까지 나와 있다.

 

 

Macromedia Flash Lite 1.1 및 모바일 SVG-T

소개

이 글은 Macromedia가 모바일 SVG-T를 추가 구성 요소로서 지원하는 이유와 이러한 지원이 휴대폰 제조업체, ODM(Original Design Manufacturers) 및 모바일 통신 사업자에게 어떤 의미를 갖는지에 대해 개괄적으로 설명합니다. 또한 두 포맷의 고급 원리의 이해 및 각 기술을 사용하는 이유에 대해서도 설명합니다.

SVG-T를 지원하는 Flash Lite

상호 작용 방식의 Macromedia Flash Lite 1.1 멀티미디어 프리젠테이션 엔진은 내장된 Flash 컨텐츠 이외에도 모바일 SVG-T(Tiny) 재생을 지원합니다. 모바일 SVG-T는 W3C(World Wide Web Consortium)에서 정의한 SVG(Scalable Vector Graphic) 포맷 기반의 개방형 표준 모바일 프로필로서 유럽 내의 3GPP 업체에서 지원합니다.

휴대폰 핸드셋용 SVG-T 엔진을 장착한 핵심 Flash Lite 1.1은 이미 전세계의 수많은 통신 사업자, 핸드셋 제조업체 및 ODM의 라이센스를 받은 솔루션입니다. 이는 바로 Flash Lite 1.1 프로필과 이와 관련된 Macromedia 저작 도구가 그들이 필요로 하는 보다 포괄적인 고급 기능 세트와 상호 작용 방식의 리치 멀티미디어 가용성을 비롯한 개방형 표준의 기본 성능에 대한 요구 조건을 충족시켰음을 의미하는 것입니다.

Macromedia는 파트너인 휴대폰 제조업체 및 통신 사업자의 의견을 적극 수렴해 왔습니다. Macromedia와 파트너는 강력한 메시지를 주고 받았습니다. 그 내용은 바로 휴대폰 그 자체에 핵심 엔진의 수를 줄이고 공급망 내에 있는 판매업체의 수를 줄이자는 것이었습니다. Flash Lite 1.1에서 모바일 SVG-T를 지원하여 다음과 같은 이점을 제공함으로써 Macromedia는 휴대폰 제조업체가 기술 구현 과정을 간소화할 수 있도록 돕고 있습니다.

• 전반적인 코드 크기를 줄이고 자재 명세서(BOM) 비용을 절감함으로써 리소스의 경제 라는 이점을 제공합니다. 따라서 동일한 단말기에서 두 개의 벡터 그래픽 엔진을 사용할 필요가 없습니다.
• 두 개의 코드 베이스를 갖춤으로써 포트 작업에 드는 노력을 줄였습니다.
• 다른 단말기 어플리케이션에 플레이어를 통합하기 위해 노력을 쏟지 않아도 됩니다.
• 공급망 관계를 능률화하여 여러 판매업체와의 관계로 인해 발생하는 비용을 절감했습니다.

하드웨어 관점에서 보면 SVG-T를 장착한 Flash Lite는 휴대폰에 장착된 핵심 프리젠테이션 레이어로 볼 수 있으며 단말기에서 다양하고 수많은 보조 어플리케이션을 실행할 수 있습니다. 제조업체는 MMS(Multimedia Messaging Service) 클라이언트 내의 풍부한 컨텐츠 검색, 사용자 인터페이스, 배경 무늬, 화면 보호기, 신호음 또는 모든 어플리케이션에 사용할 수 있는 프리젠테이션에 대해 하나의 엔진을 사용할 수 있습니다. Flash Lite는 잘 정의된 표준 API 하나를 통해 이 모든 것을 통합함으로써 단말기 제조업체는 Flash Lite 엔진을 모든 종류의 단말기 어플리케이션으로 통합할 수 있게 되었습니다.

Macromedia가 표준 Flash Lite 1.1 포맷 이외에도 SVG-T 포맷을 지원하는 주된 이유는 단말기에서 두 개의 독립된 렌더링 엔진에 대한 필요성을 줄이기 위한 것입니다. 휴대폰 제조업체에게 제공되는 SVG-T SDK를 장착한 Flash Lite 1.1를 사용함으로써 여러 벡터 그래픽 엔진을 하나 또는 그 이상의 휴대폰에 통합하기 위해 필요한 개발 시간 및 기술 뿐 아니라 BOM 비용도 줄일 수 있습니다. 그렇게 함으로써 휴대폰은 Flash Lite 1.1가 제공하는 상호 작용 방식의 풍부한 멀티미디어 기능 세트 뿐만 아니라 SVG-T 프로필에 정의된 것과 같이 기본적으로 필요한 벡터 그래픽을 지원할 수 있습니다.

다음은 SVG-T와 Flash Lite의 차이점에 대한 간략한 설명입니다.

• SVG-T는 프로필 벡터 그래픽, 이미지 및 텍스트 내에서 지원하지만 JavaScript와 같은 추가 보조 기술 없이는 상호 작용 기능이나 오디오를 추가할 수 없습니다. 단, 문제는 이러한 보조 기술을 통합 및 저작하기 위한 표준화된 방법이 없다는 것입니다.
• Flash Lite 1.1은 스크립트, 풍부한 상호 작용 및 오디오를 지원하고 Flash 개발자만이 Macromedia Flash MX Professional 2004 저작 도구를 사용하여 여러 대의 휴대폰 플랫폼과 통신 사업자 환경에 걸쳐 사용성이 보장되는 차세대 모바일 데이터 서비스를 제작할 수 있습니다.

진정한 플랫폼

Flash Lite SDK는 Flash Lite 엔진 내의 모든 기능을 다루는 포괄적인 테스트 세트를 포함합니다. 천 개 이상의 매뉴얼과 자동 테스트로 구성된 이 테스트 세트는 휴대폰이 Flash Lite 1.1 사양을 준수 및 100% 호환하는지를 확인하며 개발자는 그들의 Flash Lite 컨텐츠가 여러 휴대폰에서 매끄럽게 재생될 수 있게 개발하도록 지원합니다.

사실, Java 같이 현재 사용되고 있는 실행 환경이 데이터를 해석하는 방법에서 몇 가지 문제가 발견되었기 때문에 Macromedia는 이 테스트 세트를 개발하였습니다. Macromedia는 이로 인해 개발자가 작업하는 데 문제가 있다는 것을 인식하였고 Flash Lite를 사용한 휴대폰은 표준을 준수하고 성능 검증을 위해 요구되는 일련의 테스트를 통과해야만 Macromedia의 최종 인증을 받은 후에 선적될 수 있도록 전략을 세웠습니다. 이러한 요건들을 통해 Macromedia는 개발자가 여러 가지의 휴대폰과 플랫폼에 호환되는 컨텐츠를 제작할 수 있도록 표준화된 플랫폼을 제공하게 되었습니다. 이로써 Macromedia는 개발 및 테스트 비용을 대폭 줄이면서 출시까지의 시간을 늘릴 수 있게 되었습니다.

Macromedia 엔지니어링은 또한 SVG-T를 장착한 Flash Lite 사용권자를 대상으로 한 SVG-T 상호 운용성을 위한 상당한 크기의 추가 테스트 세트를 개발하였고 W3C에서 제공하는 추가 테스트 시나리오 및 파일을 적합성 공식 테스트 세트*에 추가하였습니다. 따라서 우리의 플레이어가 SVG-T 표준을 준수하는 반면 다른 판매업체가 제공하는 구현 제품은 이와 다를 수 있고 따라서 휴대폰과 판매업체 구현 간에 지원 기능의 차이가 있을 수 있습니다. SVG-T 포맷에서 사용할 수 없는 추가 기능(예: 그래디언트)이 사양 그 이상 또는 그 이하일 경우 제조업체 및 통신 사업자 뿐만 아니라 컨텐츠 개발자에게 추가 분열 및 상호 운용성에 관한 문제를 일으키게 되면서 더 많은 문제가 발생하게 됩니다.

예를 들면 다양한 브라우저가 HTML을 렌더링하는 방식과 브라우저 구현 및 렌더링 기술이 현저하게 차이가 날 경우 여러 가지 골칫거리가 발생하게 됩니다. 반대로 컨텐츠 개발자는 Internet Explorer, Opera 및 Safari(Apple Macintosh의 경우), Microsoft Windows 및 Linux 운영 체제에서 Flash 무비가 제대로 재생될 것이라고 믿을 수 있습니다. 이로써 Flash가 데스크탑에서는 사실상의 표준이 되는 것입니다. 모바일 환경에서 Flash Lite는 배경이 되는 어플리케이션 환경 또는 모바일 운영 체제와는 상관없고 브라우저와는 무관하게 독립적으로 실행되는 동일한 플랫폼을 제공합니다.

SVG-T 및 Flash Lite의 선별적 사용

Flash Lite 및 SVG-T를 사용할 수 있는 경우에 대해 설명하겠습니다. 어떤 것을 사용해야 하는지는 전적으로, 필요한 성능과 사용할 수 있는 컨텐츠에 따라 달라집니다. 예를 들어, SVG-T 포맷은 텍스트 입력, 서버 연결 호출, 사운드 임베드와 같은 기능을 지원하지 않습니다. Flash Lite는 반면 공통의 ActionScript 명령어 세트를 지원하기 때문에 텍스트 입력 및 서버 연결이 가능합니다. 다시 말해, LoadVariables 또는 LoadMovie ActionScript 명령어를 사용하여 뉴스, 주식 시세표 또는 날씨 채널을 실시간으로 업데이트할 수 있습니다.

Flash Lite 1.1은 또한 배터리 잔량, GPRS 연결 상태, 신호 강도, 시간, 날짜 및 진동 기능과 같이 SVG-T에서는 사용할 수 없는 휴대폰의 주요 표시기를 지원합니다.

결론

Flash Lite 1.1 SVG-T 지원은 휴대폰 제조업체가 3GPP(3rd Generation Partnership Projects)에서 규정한 개방형 표준을 준수함으로써 통신 사업자의 모든 요구사항을 지원할 수 있다는 것을 뜻합니다. 또한 고객의 Churn(가입 이전)을 줄이면서 모바일 경험에 대한 고객의 만족도를 높이는 것 뿐만 아니라 차세대의 상호 작용 방식의 풍부한 멀티미디어 경험을 자신의 휴대폰 서비스로 제공하여 사용자당 평균 매출액과 사용자당 평균 수익률을 높이고자 하는 통신 사업자의 특정 요구사항 및 필요성을 만족시켜 줄 수 있다는 뜻이기도 합니다.

 

출처 - 매크로미디어

 

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg viewBox="-1 -1 302 322"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<desc>Created by Action Script Viewer - http://www.buraks.com/asv
<g id="background">
<path fill="none" stroke="#660066" stroke-width="2" stroke-opacity="1" stroke-linecap="round" d="M0,127 L0,0 L300,0 L300,127  "/>
<path fill="#ff33cc" stroke="#660066" stroke-width="2" stroke-opacity="1" stroke-linecap="round" d="M300, 127 L300,320 L0,320 L0,127 L300,127z" />
</g>
<g id="greenshape">
<path fill="#00ff00" stroke="#006666" stroke-width="2" stroke-opacity="1" stroke-linecap="round" d="M227.5,192.75 L146.25,174.8 Q218.45,164.9,171.7,119.35 Q124.95,73.75,12.45,193.1 Q52.65,96.55,90.4,7 Q63.95,87.15,204.9,73.25 L227.5,192.75z"/>
</g>
<g id="blobs">
<path fill="#ffff00" stroke="#0033CC" stroke-width="2" stroke-opacity="1" stroke-linecap="round" d="M260.1,55.35 Q271.85,40.85,281.3,56.2 Q285.55,63.05,280,67.85 Q265.15,80.7,259.45,65.4 Q257.35,59.95,260.1,55.35" />
<path fill="#ffff00" stroke="#0033CC" stroke-width="2" stroke-opacity="1" stroke-linecap="round" d="M237.25,46.65 Q236.05,55.45,226.65,57.2 Q218.3,58.75,210.85,56.95 Q191.2,52.05,199.25,40.05 Q205.25,27.3,222.55,27.85 Q239.9,28.4,237.25,46.65" />
<path fill="#ffff00" stroke="#0033CC" stroke-width="2" stroke-opacity="1" stroke-linecap="round" d="M163.15,49.25 Q147.25,55.85,155.9,74.15 Q161.6,80.65,172.6,74.35 Q187.45,71.05,183.85,54.2 Q182.35,47.05,174.3,48.1 L163.15,49.25" />
<path fill="#ffff00" stroke="#0033CC" stroke-width="2" stroke-opacity="1" stroke-linecap="round" d="M111,63.85 Q124.6,53.6,134.55,66.35 Q140.1,73.5,134.75,80.55 Q122.25,88.5,112.95,75.7 Q102.05,69.7,111,63.85" />
<path fill="#ffff00" stroke="#0033CC" stroke-width="2" stroke-opacity="1" stroke-linecap="round" d="M81.95,76.7 Q68.3,84.5,77.6,99.2 Q86.65,113.7,99.5,100.7 Q110.2,89.8,99.6,79.45 Q90.45,70.5,81.95,76.7 "/>
</g>
</svg>

시간이 나면 flash와 svg에 대해 좀 자세히 알아봐야겠다. 

아뭏튼 활용도는 높을 것 같다.