Expression Blend 정보

Microsoft Expression Blend는 데스크톱 및 웹 응용 프로그램을 디자인하고 프로토타입을 생성하기 위한 시각적 도구입니다. 단추(Button) 및 목록 상자(ListBox) 같은 컨트롤과 도형을 그리고, 각 응용 프로그램 요소가 마우스 클릭 및 기타 사용자 입력에 응답하도록 설정하며, 모든 요소의 스타일을 고유하게 지정하여 응용 프로그램을 빌드합니다.

중요:
SketchFlow는 Expression Studio Ultimate에서만 사용할 수 있습니다.

다른 개체와의 충돌에 응답하는 개체 그리기를 보여 주는 BeeHive 예제

SDK 라이브러리 또는 타사에서 제공하는 이미지, 오디오/비디오 클립 및 사용자 지정 컨트롤을 삽입할 수도 있습니다. 사용자가 응용 프로그램을 실행하면 Expression Blend의 디자인 화면의 내용이 표시됩니다.

3D 투사 변형에서 회전한 이미지 및 개체를 보여 주는 Zune3D 예제

Expression Studio Ultimate에서만 사용 가능한 기능 집합인 SketchFlow를 사용하면 여러 번 클릭해야 최종 응용 프로그램을 작성할 수 있는 일련의 정적 이미지가 아닌 프로토타입, 즉 제대로 작동하는 응용 프로그램을 만들 수 있습니다.

문서의 진행 상태를 보여 주는 PCGaming 예제 개발

Windows Phone Developer Tools 를 다운로드한 경우 사용할 수 있는 Windows Phone용 Expression Blend에서 Windows Phone용 Silverlight 응용 프로그램을 빠르고 쉽게 빌드할 수 있습니다. Expression Blend의 디자인 도구를 사용하여 Windows Phone 템플릿, 그래픽 및 애니메이션 도구, 기본 제공 동작, 예제 데이터 등을 포함하여 Windows Phone 응용 프로그램을 만들 수 있습니다. Windows Phone 응용 프로그램을 만든 후에는 기본 제공 Windows Phone 에뮬레이터 또는 컴퓨터에 연결된 Windows Phone 장치에서 응용 프로그램을 빌드한 다음 미리 볼 수 있습니다.

Expression Blend에서는 실제 작동하는 응용 프로그램에 대해 작업을 수행하지만 다른 일러스트레이션 소프트웨어에서와 같이 쉽게 모든 요소를 그리고 스타일을 지정할 수 있습니다. 대화형 컨트롤을 나타내는 요소를 그릴 때는 단추(Button)나 목록 상자(ListBox) 같이 실제로 작동하는 컨트롤을 선택해 그리고 스타일을 지정합니다.

두 사용자 지정 스타일(ItemContainerStyle -> ItemsPanel)을 ListBox 컨트롤에 적용하여 원에 부채 모양으로 펼쳐진 항목을 표시하는 ColorSwatchSL 예제

내부적으로 응용 프로그램 기능은 두 가지 강력한 기술인 Microsoft Silverlight 및 Windows Presentation Foundation (WPF)을 통해 제공됩니다. Expression Blend에서는 Silverlight 기반 웹 사이트 및 응용 프로그램과 WPF 기반 데스크톱 응용 프로그램을 만들 수 있습니다.

팁:
Expression Blend에서 제공되는 예제는 도움말 메뉴에서 시작 화면과 예제 탭을 차례로 클릭한 후에 목록에서 예제 이름을 클릭하면 열 수 있습니다. 예제를 빌드 및 실행하려면 F5 키를 누르십시오.

Expression Blend의 작동 방식

Expression Blend에서는 응용 프로그램을 시각적으로 디자인하고 아트보드에 도형, 패스 및 컨트롤을 그린 다음 모양과 동작을 수정합니다. 그 과정에서 이미지, 비디오 및 사운드를 가져올 수도 있습니다. Windows 기반 응용 프로그램의 경우 3D 개체를 가져오고 변경할 수도 있습니다.

디자인의 시각 요소 또는 오디오 요소에 애니메이션 효과를 적용하는 스토리보드를 만들고 필요에 따라 사용자가 응용 프로그램과 상호 작용할 때 해당 스토리보드를 트리거할 수 있습니다. Windows 기반 또는 Silverlight 기반 응용 프로그램 작업을 수행하는 경우 기본 컨트롤에 적용된 템플릿을 다시 디자인하여 응용 프로그램의 모양과 동작이 고유하도록 할 수 있습니다.

응용 프로그램에서 작업하는 동안 필요하면 언제든지 프로그래머가 작업하고 있는 코드 숨김 파일이나 사용자 지정 컨트롤 파일을 사용하여 프로젝트를 업데이트할 수 있습니다. Expression Blend 사용 시에는 디자이너와 프로그래머가 아무런 문제 없이 동일한 프로젝트에서 동시에 작업할 수 있습니다.

Expression Blend와 함께 사용할 수 있는 다른 응용 프로그램

Microsoft Expression Design에서 생성된 그래픽 및 XAML(eXtensible Application Markup Language) 리소스를 Expression Blend 프로젝트로 가져올 수 있습니다. 또한 Microsoft Expression Encoder에서 만든 Silverlight 미디어 프로젝트를 가져와서 프로젝트에 새 기능 또는 시각적 요소를 추가하거나 Expression Encoder에서 다시 사용할 수 있는 미디어 플레이어 템플릿을 수정할 수도 있습니다.

Microsoft Expression Web에서는 Silverlight 웹 사이트와 컴파일된 Silverlight 응용 프로그램 파일을 기존 프로젝트나 새 프로젝트로 가져온 다음 직접 만든 작업을 게시할 수 있습니다.

Microsoft Visual Studio 2010 은 Expression Blend와 원활히 연동하므로 Visual Studio 2010 및 Expression Blend에서 파일을 동시에 수정해도 동기화 상태가 유지됩니다. Expression Blend에서는 개별 코드 숨김 파일 또는 전체 프로젝트를 Visual Studio 2010에서 열 수 있습니다. 또한 Visual Studio 2010의 배포 도구를 사용하여 응용 프로그램을 배포할 수도 있습니다.

Expression Blend의 결과물

Expression Blend는 Windows Presentation Foundation (WPF) 응용 프로그램, Silverlight 웹 사이트(.xap 및 지원 파일) 및 Silverlight 사용자 정의 컨트롤을 생성합니다. 시각적 디자인은 XAML로 표현됩니다. HTML이 웹 응용 프로그램에 사용되는 태그 언어라면 XAML은 WPF에 사용되는 태그 언어입니다.

XAML과 WPF에 대한 자세한 내용은 XAML 사용 및 학습 및 커뮤니티 리소스를 참조하십시오.

Expression Blend의 기능 소개

Expression Blend에는 다음과 같은 기능이 포함되어 있습니다.

• 실제 WPF 또는 Silverlight 응용 프로그램인 프로토타입을 만드는 기능 집합이며 Expression Studio Ultimate에 포함된 SketchFlow

• Windows Phone Developer Tools 를 다운로드한 경우 사용할 수 있는 Windows Phone용 Expression Blend

• 텍스트 및 3D 도구를 포함한 완전한 벡터 그리기 도구 제품군

• 개체와 함께 제공되는 바로 가기 메뉴, 고정/해제가 가능한 패널과 함께 제공되는 사용하기 쉬운 첨단 그래픽 인터페이스

• 실시간 애니메이션

• 향상된 사용자 작업 환경을 위한 3D 및 미디어 지원

• 향상된 사용자 작업 환경을 위한 효과 및 전환 지원

• Views 및 ViewModels 용 프로젝트 템플릿

• 다양하게 제공되는 공용 컨트롤에 대한, 유연하면서도 다시 사용 가능한 고급 사용자 지정/스키닝 옵션

• 데이터 원본과 외부 리소스의 강력한 통합 지점

• 실시간 디자인 및 마크업 보기

• Expression Design에서 아트워크를 가져오는 기능

• Expression Encoder에서 사이트를 가져오는 기능

• 디자이너와 개발자가 보다 긴밀하고 원활하게 팀 작업을 진행할 수 있게 해 주는 Visual Studio 2010과의 연동 기능(상호 운용성)

Expression Blend에서 사용 가능한 기능에 대한 자세한 내용은 Expression Blend의 새로운 기능을 참조하십시오.

대상 응용 프로그램 형식

Expression Blend는 다음 형식의 응용 프로그램을 제작할 수 있도록 최적화된 제품입니다.

• 생산성 응용 프로그램 Microsoft Office와 같은 기간 업무(LOB) 응용 프로그램뿐만 아니라 폭넓은 고객 기반의 생산성 및 효율성을 향상시킬 수 있는 응용 프로그램입니다.

• Windows Phone 응용 프로그램  Windows Phone에서 실행하도록 디자인된 응용 프로그램입니다.

• 고객 응용 프로그램 미디어 플레이어, 보안 도구, 데스크톱 가젯과 같은 응용 프로그램입니다.

• 게임 엔터테인먼트 용도의 간단한 데스크톱 게임 또는 온라인 게임입니다.

• 키오스크 키오스크에서 실행하기 위한 응용 프로그램으로, 사용자가 상호 작용을 통해 정보를 얻거나 제품 디렉터리를 검토하거나 공항에서 체크 인하는 등의 작업을 수행할 수 있습니다.

• IT 전문 유틸리티 버그 추적 등의 소규모 작업을 위한 도구로, 특정 회사나 고객 요구에 맞춰 고유하게 제공될 수 있습니다.

모범 사례

기능성을 향상시키는 것만으로 훌륭한 역할을 하는 디자인이 있습니다. Expression Blend와 Microsoft .NET Framework를 사용하여 기능성을 향상시킬 수 있는 몇 가지 일반적인 특성은 다음과 같습니다.

• 실제 세계 모델링 사용자 지정 그래픽과 상호 작용을 사용하여 특정 컨트롤의 모양과 동작을 실제 세계와 유사하게 만들 수 있습니다. 이 기술은 사용자가 실제 개체에 익숙할 때 최적의 효과를 냅니다. 실제 세계를 기반으로 하는 작업은 가장 효율적인 동시에 이상적인 방법입니다. 예를 들어 계산기와 같은 간단한 유틸리티는 실제로 사용되는 계산기를 모델링하면 더 효율적으로 작동합니다.

• 설명하는 대신 직접 보여 주기 애니메이션과 전환 기법을 사용하여 관계, 원인과 결과를 보여 줄 수 있습니다. 이 기술을 사용하면 사용자가 놓칠 수 있어 별도로 설명하는 텍스트가 필요한 정보를 효과적으로 전달할 수 있습니다. 예를 들어 어린이용 책의 페이지 전환을 애니메이션으로 만들어 컨트롤 작동 방법을 보여 줄 수 있습니다.

• 행동 유도성 향상행동 유도성 은 개체의 사용 방법을 일일이 레이블로 표시해서 설명하는 대신, 작업자가 눈으로 쉽게 짐작할 수 있도록 디자인된 개체의 속성을 말합니다. 사용자 지정 컨트롤 그래픽과 애니메이션을 사용하여 일반적이지 않은 컨트롤을 알아보기 쉽게 만들 수 있습니다.

• 자연스러운 매핑 사용 자연스러운 매핑은 사용자가 원하는 작업과 해당 작업 방법을 명확하게 연결해 주는 것을 말합니다. 표준 공용 컨트롤을 사용할 수 없는 경우 사용자 지정 모양과 상호 작용을 사용하여 자연스러운 매핑을 만들 수 있습니다.

• 필수 정보 축소 사용자 지정 상호 작용을 사용하여 작업을 수행하는 방법의 수와 작업 수행에 필요한 정보의 양을 제한할 수 있습니다.

• 피드백 향상 사용자 지정 컨트롤 그래픽과 애니메이션으로 피드백을 제공하여 작업이 제대로 진행되고 있는지 여부 또는 작업 진행률을 보여 줄 수 있습니다. 예를 들어 Windows Vista 및 Windows 7에서 Internet Explorer의 주소 표시줄에는 백그라운드에서 페이지가 로드되는 진행률이 표시됩니다.

• 개체의 상호 작용 개선 Fitts의 법칙으로 알려진 인간 행동 모델에 따르면 대상을 클릭하는 데 드는 노력은 대상의 거리에 비례하고 크기에 반비례한다고 합니다. 예를 들어 애니메이션을 사용하여 포인터가 가까이 있으면 개체가 확대되고 포인터가 멀리 있으면 개체가 축소되도록 설정하는 경우, 개체를 좀 더 쉽게 클릭할 수 있습니다. 또한 개체를 정상적으로 축소하여 화면 공간을 좀 더 효율적으로 사용할 수도 있습니다.

• 강조 풍부한 레이아웃과 사용자 지정 그래픽을 사용하여 작업에 필요한 화면 요소는 강조하고 보조 요소는 강조하지 않도록 설정합니다.

[!참고]

Windows용으로 디자인하는 경우 Windows User Experience Interaction Guidelines (Windows 사용자 환경 상호 작용 지침) 에 따라 구현 방식에 관계없이 모든 Windows 기반 응용 프로그램에 일관되게 적용되는 유용한 지침을 수립하시기 바랍니다.

참조 항목

개념

Expression Blend의 새로운 기능
학습 및 커뮤니티 리소스

Copyright ⓒ 2011 by Microsoft Corporation. All rights reserved.