Mega zone R&D WPF Presentation Window Vista 새로운 개발 트렌드를 비추는 거울
차세대 개발 플랫폼 들어가며…… Apollo .NF3.0 JAVA FX 2006년 화두는 Web2.0 이라고 한다면 2007년은 차세대 라는 용어를 들을 수 있습니다. 차세대 게임기, 차세대 통신 … - 즉 기존의 방식에 변화를 준비 중이며 노력하고 있습니다. 차세대 개발 플랫폼이라는 단어로 마이크로소프트(.NF 3.0), 썬(Java FX), 어도비(Flex, 아폴로) 3개의 업체가 치열한 경쟁을 하고 있습니다. 각각의 업체마다 추구하는 이상은 다르지만 크로스 플랫폼, 크로스 브라우져, RIA(Rich Internet Application)라는 공통 분모를 가지고 있습니다. 오늘의 세미나는 그 중 마이크로소프트의 .NETFramework3.0를 소개해 드리겠습니다. 차세대 개발 플랫폼
- 목 차 - Ⅰ . Window Vista Ⅱ . NET Framework 3.0 Ⅲ . WPF Ⅳ . WPF VS Flex Ⅴ . 공개 예제시연 Ⅵ . 업무 플로우 & 구현 예제시연 Ⅶ . 적용방안 및 결론 Ⅷ . Q&A
“Window Vista” Vista 핵심 기획주제 UX (User Experience) Ⅰ
1. Vista 핵심 기획 주제
SO? “S/W사용자 편의를 생각해야 된다.” 2. UX (User Experience) 1. 사용자가 해당 제품을 통해 느끼는 모든 것 2. 사용자가 제품이나 서비스를 어떻게 사용하고, 어떻게 느끼는지에 대한 총체적인 사항 3. S/W: 기능을 얼마나 직관적이고 편리하게 사용할 수 있는가 SO? “S/W사용자 편의를 생각해야 된다.” 결국 UX는 누구나 쉽게 사용할 수 있도록 직관적이고, 동일한 일을 가장 빠르고 간편하게 처리할 수 있으며, 보기에도 좋아야 한다는 결론이 나옵니다. 또한 진정한 사용자 중심의 UX는 정말 사용하는 사용자의 입장이 되어봐야 하고, 발상의 전환이 필요하다는 셈이 됩니다.
Ⅱ “.Net Framework 3.0” MS S/W 개발 Trend .Net Framework 구성 S/W Trend And .NF 3.0 Ⅱ
“S/W개발에 효율적인 작업 프로세스 도입” 1. MS S/W 개발 Trend 1. Differentiated User Experience (차등화된 사용자 개발) 2. Service-Oriented Development (서비스 기반 개발) 3. Business Process Modeling (비즈니스 프로세스 모델링) 4. Digital Identity Management (디지털 정체성 관리) Why! “S/W개발에 효율적인 작업 프로세스 도입”
2. .Net Framework 구성 1. .NF 2.0 + (WPF, WCF, WF, Card Space)
Window Presentation Foundation 3. S/W Trend And .NF 3.0 Window Presentation Foundation 차세대 사용자 경험 Window Workflow Foundation 비즈니스프로세스 모델링 Window Communication Foundation 서비스기반 개발 Card Space 개인 정체성 관리
Ⅲ “Framework 3.0과 WPF” WPF 기본 목표 차세대 사용자 경험을 위한 WPF .NF 3.0의 WPF 도입 효과 WPF Architecture WPF (Window Presentation Foundation) XAML 활용방안 독립 Exe UI & Web Browser UI Ⅲ
“디자이너/기획자의 생각을 자유롭게 표현” 1. WPF 기본목표 1. 기본적인 UI 및 모션 기능은 디자이너와 기획자가 입맛에 맞게 구성 할 수 있어 업무 분쟁에 있어서 새로운 해결책으로 대두 2. 기능 효과 부분에서 업무상의 마찰을 디자이너, 기획자가 참여 하여 UI 및 모션 부분을 주도 하여 업무 마찰을 미연에 방지 WPF? “디자이너/기획자의 생각을 자유롭게 표현” Web2.0의 화두가 되었던 작년 참여, 공유, 개방 등 이상과 AJAX라는 기술에 많은 개발자와 유저들이 관심을 보였습니다. .NF3.0에서도 가장 먼저 눈으로 느낄 수 있는 변화인 WPF를 통해 마케팅을 하고 있습니다.
We! “차세대 개발 플랫폼 도입, 작업 생산성 향상” 2. 차세대 사용자 경험을 위한 WPF 1. 요구사항 가이드라인 2. 최상위 요구사항으로 승인 받지 못하는 UX 3. 개발 복잡성이 핵심과제 We! “차세대 개발 플랫폼 도입, 작업 생산성 향상” 1.요구사항 가이드라인 디자인을 통해 ROI(투자수익률)을 측정하게 되면서 UX에 대한 요구 사항도 추가되기 시작 2.최상위 요구사항으로 승인 받지 못하는 UX 지금까지 App에서 UX적인 요소에는 그다지 차이가 나지 않기 때문에, 대부분 개발사나 고객들이 UX보다는 시가/비용/기능에 더 신경 써왔다. 3. 개발 복잡성이 핵심과제 현란한 UX는 비용을 증가시킬 뿐 아니라, 이를 구현하는데 필요한 플랫폼 성능과 개발 도구는 UX 개발 프로세스를 위한 생성/퍼포먼스에 적합하지 않다.
“WPF 개발 플랫폼 도입으로 작업 생산성 증가” 3. .NF 3.0의 WPF 도입 효과 1. 혁신적인 사용자 인터페이스 2. 개발자-디자이너 생산성 증가 3. 기존 코드 기발의 기술묶음 강화 We! “WPF 개발 플랫폼 도입으로 작업 생산성 증가” 1.혁신적인 사용자 인터페이스 UI, 미디어, 문서에 대한 통합된 접근을 제공. 그래픽적인 기술에서는 벡터 기발 구도 엔지, 하드웨어 가속화 기술을 통해 그래픽 엔지에 의존하지 않고도 고생상도를 지원 2.개발-디자이너 생산성 증가 개발자와 디자이너의 긴밀한 협력이 중요하다. 개발자에게는 비주얼 스튜디오, 디자이너에게는 MS 익스프레션을 제공 3. 기존 코드 기반과 기술묶음 강화 윈도우 품, Win32, 다이렉스X, MFC, 엑디브X와 상호운용이 가능하다.
4. WPF Architecture XPS Viewer Managed Unmanaged Application Services Deployment Services Databinding USER INTERFACE SERVICES XAML Accessibility Property System Input & Eventing BASE SERVICES DOCUMENT SERVICES Packaging Services XPS Documents Animation 2D 3D Audio Imaging Text Video Effects Composition Engine MEDIA INTEGRATION LAYER Controls Layout Windows Presentation Foundation XPS Viewer Property Engine Input / Eventing System .NET Framework 2.0 Desktop Windows Manager Media Integration Layer DirectX Windows Vista Display Driver (LDDM) Windows Media Foundation Composition Engine Print Spooler Managed Unmanaged
5. WPF (Window Presentation Foundation) 1. 실제 사용자에게는 사용자 인터페이스가 매우 중요 2. Interface는 S/W에 대한 전체적인 사용자 환경에서 중요한 부분을 차지 사용자에게는 S/W의 ‘그 자체’를 의미 3. 더 나은 UI는 향상된 사용자 환경을 제공하며 생산성을 높이고 높은 우수 고객을 더 많이 확보 핸드폰의 경우 카메라가 몇만 화소냐, MP3가 되느냐 등의 기능 위주였지만 현재는 얼마나 슬림한가?
“작업자간의 커뮤니케이션 부재를 사전에 차단” 5. WPF (Window Presentation Foundation) Developer & Designer 개발자와 디자이너는 업무진행 방식이 다르기 때문에 1. 그래픽 도구를 이용 정적인 이미지 구현(디자이너) 2. 이미지를 개발자에게 전달 3. 해당 이미지를 구현하는 코드 작성(개발자) WPF? “작업자간의 커뮤니케이션 부재를 사전에 차단”
6. XAML 활용방안 1 참조 예제 1. eXtensible Application Markup Language 2. UI의 모양을 정확히 표현하기 위해 Button, TextBox, Label등 여러 XML 요소의 집합을 정의 참조 예제 <Button Background="Red"> 아니요 </Button> --------------------------------------- XAML Button btn = new Button(); btn.Background = Brushes.Red; btn.Content = "아니요"; ------------------------ C#
6. XAML 활용방안 2 1. 디자이너가 만든 UI(XAML)를 개발자는 Visual Studio를 통해 불러와 코딩 2. 개발자는 핵심 기능 구현에 모든 역량을 집중 3. XAML 및 XAML를 지원하는 도구의 기본 목표는 디자이너 및 기획자의 표현 자유를 위한 도구
8. 독립 Exe UI & Web Browser UI 동일한 기술을 통해 Window Interface 와 Web Browser Interface를 모든 만들 수 있다. XBAP(XAML Browser Application) Window Application Web Browser 개발자는 WPF를 사용하여 Internet Explorer에서 실행되는 XBAP(XAML Browser Application)를 만들 수 있습니다 기존의 작업 방식에서 벗어난 Application과 Web완벽환 호환을 지원
“MS WPF VS Adobe Flex” Tool 지원 언어 장/단점 Ⅳ
1. Tool VS Web Dreamweaver Bliend VS Flash VS Design Photoshoop
2. 지원 언어 Microsoft WPF Adobe Flex XAML MXML .NET CLR Flash Player C#, VB.NET Action Script Interactive designer Visual Studio 2005 Flex Builder CLR(Common Language Runtime)
3. 장/단점 Microsoft WPF Adobe Flex 장점 단점 특징 가장 강력한 C#과의 완벽한 호환 으로 새로운 기술적용 과 표현의 자유로움이 강점 플래시 기반으로 만들어져 많은 사용자층 확보 OS국한되지 않는 확장 성 단점 윈도우에 국한되어 있다 (폐쇄성) 새로운 기술 습득에 대한 부담 한정된 스크립트 언어만을 지원 하기에 새로운 기술적용 과 표현의 어려움 특징 DirectX 기반으로 하드웨어 가속의 혜택을 누릴 수 있음 화면 처리는 GPU가 응용프로그램 본연의 처리는 CPU가 분담함 Flash Player의 특징상 하드웨어 독립적으로 동작 하드웨어 가속의 혜택과 거리가 멈 큰 해상도 및 복잡한 환경에서 성능상의 이슈 발생
“공개 시연예제” Ⅴ
“업무 Flow & 구현 예제” 현재 업무 Process .NET Framework 적용 Process 구현 예제 Ⅵ
? 1. 현재 업무 Process “왜 개발자는 같은 작업을 계속 요청하는 거야” 도대체 언제까지 작업결과물로 개발자와 대립을 해야 되나? 기획자 Designer Programmer UI 작업 및 기능구현 Story Board 이미지 가공 구현되는 기능의 이해 관계로 커뮤니케이션 부재가 많은 작업 영역 27 27
2. .NET Framework 적용 Process ! “App개발의 새로운 전문 영역 출현” 이제 더 이상 작업결과물로 개발자와 대립을 하지 말자 기획자 Designer ? Programmer Story Board 이미지 가공 UI 및 스토리 기능구현 UI 및 구현 스토리의 완벽한 업무 분업으로 생산성 높은 프로젝트 진행 28 28
3. 구현 예제 XAML로 구현한 List Control MFC로 구현한 List Control 29 29
“적용 방안” 무주 리조트 두산 OTTO Ⅶ
1. 무주 리조트 (http://www.mujuresort.com) WPF MUJU RESORT
2. 두산 OTTO (www.otto.co.kr) WPF OTTO
Q&A Thank You 기술문의 : R&D 사업부 박준영 대리 MSN : whim77@hotmail.com NATEON : Whim77@nate.com Mail : jypark@magacorp.co.kr 33