Microsoft MVP성태의 닷넷 이야기
글쓴 사람
정성태 (techsharer at outlook.com)
홈페이지
첨부 파일
 

응용 프로그램 디자인 스케치 도구 - SketchFlow

그동안 말로만 들어왔던 SketchFlow를 검토하게 되었습니다.

SketchFlow 개요
; https://docs.microsoft.com/ko-kr/previous-versions/visualstudio/design-tools/expression-studio-4/ee341449(v=expression.40)

오호~~~ 짧은 검토 결과 일단 마음에 듭니다. ^^ 형상 관리 서버와의 연동도 자연스럽고 '응용 프로그램'에서 자주 쓰이는 '컨트롤' 요소들도 기본 제공하고 애니메이션 효과 및 실제 스케치한 그림을 넣어서 표현하기에도 무리가 없습니다.

혹시나, 아직도 모르고 계시는 분들은 이번 기회에 한번 눈여겨 봐두시는 것도 좋을 듯 싶습니다.

먼저, 이것이 어떤 것인가에 대한 데모는 다음의 영상을 통해 알 수 있습니다.

Expression and SketchFlow Demo Mix09 
(제 판단으로는, 여기 나오는 데모 수준은 전문적인 디자이너와 수준 있는 개발자가 협업해야 가능한 정도 같습니다.)
; http://vimeo.com/5533794

그리고, 교육용으로 제작된 것인데 아래의 5분짜리 비디오도 전체적인 기능 이해를 도와줍니다.

Introducing SketchFlow with Expression Blend 3 
(여기 나오는 데모 수준은… 누구나 가능할 수 있습니다.)
; http://www.youtube.com/watch?v=DOGxOQO8qA8&feature=mfu_in_order&list=UL




실제로 뚝딱거리고 싶은 분들은 다음의 비디오들을 한 번씩 쭉 보는 것도 좋겠습니다. (위에서 소개한 ‘Introducing SketchFlow with Expression Blend 3’에 대한 How-to 시리즈라고 보면 됩니다.) 한 편당 9분 정도 내외의 내용이라서 골라서 보시면 빠른 시간 내에 이해가 되실 것입니다.

Building Basic Layout in SketchFlow with Expression Blend 3 (기초 도구 사용법)
; http://www.youtube.com/watch?v=NUuUtXll16E&feature=mfu_in_order&list=UL

Using SketchStyle Controls to Enhance a SketchFlow Layout with Expression Blend 3 (부가 컨트롤 추가하기)
; http://www.youtube.com/watch?v=hYKvR3c2aBw&feature=mfu_in_order&list=UL

Working with Components in a SketchFlow Project with Expression Blend 3 (별개의 컨트롤로 분리하는 방법)
; http://www.youtube.com/watch?v=Ca955dOBwIY&feature=mfu_in_order&list=UL

Adding Navigation to Buttons in SketchFlow with Expression Blend 3 (화면 내의 컨트롤에 다른 화면으로 전환하는 기능 부여)
; http://www.youtube.com/watch?v=xWiNkaljeCI&feature=mfu_in_order&list=UL

Working with States in SketchFlow with Expression Blend 3 (레이어 윈도우 효과)
; http://www.youtube.com/watch?v=jxu210ol4aE&feature=autoplay&list=ULf5ieT23i78U&index=18&playnext=1

Working with the SketchFlow Animation Panel with Expression Blend 3 (애니메이션 효과)
; http://www.youtube.com/watch?v=UdZSM7b74aM&feature=autoplay&list=ULf5ieT23i78U&index=19&playnext=1

Working with Behaviors in SketchFlow with Expression Blend 3 (Behavior에 대한 이해)
; http://www.youtube.com/watch?v=faEcmh_ESmI&feature=BF&list=ULf5ieT23i78U&index=20

Using Sample Data in SketchFlow with Expression Blend 3 (데이터 바인딩)
; http://www.youtube.com/watch?v=WHYyfTHzuVY&feature=mfu_in_order&list=UL

Adding Feedback and Annotations in the SketchFlow Player with Expression Blend 3 (피드백 첨언하기)
; http://www.youtube.com/watch?v=uoXvf_E2UZg&feature=BF&list=ULf5ieT23i78U&index=22 

Exporting your SketchFlow project with Expression Blend 3 (html/XAP 파일로 내보내기, 오피스 워드로 내보내기
; http://www.youtube.com/watch?v=3R7r02niqEw&feature=BF&list=ULf5ieT23i78U&index=23

**** 위에서 SketchFlow에 대한 프로젝트 생성 방법이 빠져 있는데요. 이에 대해서는 다음의 비디오를 보시면 됩니다.

SketchFlow (Sketch Flow 프로젝트 생성 방법부터, 간략한 방법)
; http://www.youtube.com/watch?v=kJtu5mjOYrU&feature=related




실습하기 위해서는 Expression Blend라는 제품이 필요한데 다음의 URL에서 60일 평가판을 다운로드 할 수 있습니다.

Microsoft Expression Studio 4 Ultimate 60일 평가판 
; http://www.microsoft.com/downloads/ko-kr/details.aspx?FamilyID=04438F30-CC6D-4E10-80A3-3B3DCE129E88

설치 후, 서비스 팩 1을 다시 설치하시는 것이 권장되고.

Microsoft Expression Blend 4 SP1(서비스 팩 1) 
; http://www.microsoft.com/downloads/ko-kr/details.aspx?FamilyID=17872A3A-4620-4B87-9D62-F29173D12625



[이 글에 대해서 여러분들과 의견을 공유하고 싶습니다. 틀리거나 미흡한 부분 또는 의문 사항이 있으시면 언제든 댓글 남겨주십시오.]







[최초 등록일: ]
[최종 수정일: 7/17/2021]

Creative Commons License
이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-변경금지 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.
by SeongTae Jeong, mailto:techsharer at outlook.com

비밀번호

댓글 작성자
 



2011-03-30 10시32분
[spike] 현재는 4 버전이 나와있습니다. 이왕이면 최신버전으로 보시는 것도 좋겠네요~
[guest]
2011-03-30 10시47분
아... ^^ 동영상 링크 걸어놓은 것은 3 버전밖에 없어서 그렇게 된 것이고, 아래에 보시면 Expression Blend 4 버전의 평가판 경로를 걸어놨습니다. 그리고, 실제로 동영상 강의 내용 수준 정도는 3과 4의 동작 차이가 없기 때문에 무방할 것 같습니다. ^^
정성태
2011-03-31 10시28분
[짜두] 드뎌 디자인에 입문하시는건가효?ㅎ 레알 Expression MVP 가 되어 주세요!ㅎㅎㅎ
[guest]
2011-03-31 02시05분
필요한 만큼만 합니다. ^^; Expression MVP가 되기에는 쩜. ^^ WPF조차도 "그 프로젝트" 이후로 안 하다 보니 감을 잃은 것 같습니다. ^^
정성태

1  2  3  4  5  6  7  8  9  10  11  [12]  13  14  15  ...
NoWriterDateCnt.TitleFile(s)
13641정성태6/11/20248659Linux: 71. Ubuntu 20.04를 22.04로 업데이트
13640정성태6/10/20248833Phone: 21. C# MAUI - Android 환경에서의 파일 다운로드(DownloadManager)
13639정성태6/8/20248443오류 유형: 906. C# MAUI - Android Emulator에서 "Waiting For Debugger"로 무한 대기
13638정성태6/8/20248524오류 유형: 905. C# MAUI - 추가한 layout XML 파일이 Resource.Layout 멤버로 나오지 않는 문제
13637정성태6/6/20248446Phone: 20. C# MAUI - 유튜브 동영상을 MediaElement로 재생하는 방법
13636정성태5/30/20248087닷넷: 2264. C# - 형식 인자로 인터페이스를 갖는 제네릭 타입으로의 형변환파일 다운로드1
13635정성태5/29/20248936Phone: 19. C# MAUI - 안드로이드 "Share" 대상으로 등록하는 방법
13634정성태5/24/20249416Phone: 18. C# MAUI - 안드로이드 플랫폼에서의 Activity 제어 [1]
13633정성태5/22/20248943스크립트: 64. 파이썬 - ASGI를 만족하는 최소한의 구현 코드
13632정성태5/20/20248560Phone: 17. C# MAUI - Android 내에 Web 서비스 호스팅
13631정성태5/19/20249320Phone: 16. C# MAUI - /Download 등의 공용 디렉터리에 접근하는 방법 [1]
13630정성태5/19/20248863닷넷: 2263. C# - Thread가 Task보다 더 빠르다는 어떤 예제(?)
13629정성태5/18/20249163개발 환경 구성: 710. Android - adb.exe를 이용한 파일 전송
13628정성태5/17/20248540개발 환경 구성: 709. Windows - WHPX(Windows Hypervisor Platform)를 이용한 Android Emulator 가속
13627정성태5/17/20248603오류 유형: 904. 파이썬 - UnicodeEncodeError: 'ascii' codec can't encode character '...' in position ...: ordinal not in range(128)
13626정성태5/15/20248872Phone: 15. C# MAUI - MediaElement Source 경로 지정 방법파일 다운로드1
13625정성태5/14/20248929닷넷: 2262. C# - Exception Filter 조건(when)을 갖는 catch 절의 IL 구조
13624정성태5/12/20248720Phone: 14. C# - MAUI에서 MediaElement 사용파일 다운로드1
13623정성태5/11/20248418닷넷: 2261. C# - 구글 OAuth의 JWT (JSON Web Tokens) 해석파일 다운로드1
13622정성태5/10/20249205닷넷: 2260. C# - Google 로그인 연동 (ASP.NET 예제)파일 다운로드1
13621정성태5/10/20248637오류 유형: 903. IISExpress - Failed to register URL "..." for site "..." application "/". Error description: Cannot create a file when that file already exists. (0x800700b7)
13620정성태5/9/20248542VS.NET IDE: 190. Visual Studio가 node.exe를 경유해 Edge.exe를 띄우는 경우
13619정성태5/7/20248860닷넷: 2259. C# - decimal 저장소의 비트 구조파일 다운로드1
13618정성태5/6/20248653닷넷: 2258. C# - double (배정도 실수) 저장소의 비트 구조파일 다운로드1
13617정성태5/5/20249471닷넷: 2257. C# - float (단정도 실수) 저장소의 비트 구조파일 다운로드1
13616정성태5/3/20248617닷넷: 2256. ASP.NET Core 웹 사이트의 HTTP/HTTPS + Dual mode Socket (IPv4/IPv6) 지원 방법파일 다운로드1
1  2  3  4  5  6  7  8  9  10  11  [12]  13  14  15  ...