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조차도 "그 프로젝트" 이후로 안 하다 보니 감을 잃은 것 같습니다. ^^
정성태

... 16  17  18  19  20  21  22  23  24  25  26  27  28  29  [30]  ...
NoWriterDateCnt.TitleFile(s)
13187정성태12/8/202215282개발 환경 구성: 654. openssl - CA로부터 인증받은 새로운 인증서를 생성하는 방법 (2)
13186정성태12/6/202213062오류 유형: 831. The framework 'Microsoft.AspNetCore.App', version '...' was not found.
13185정성태12/6/202214031개발 환경 구성: 653. Windows 환경에서의 Hello World x64 어셈블리 예제 (NASM 버전)
13184정성태12/5/202212612개발 환경 구성: 652. ml64.exe와 link.exe x64 실행 환경 구성 [1]
13183정성태12/4/202212454오류 유형: 830. MASM + CRT 함수를 사용하는 경우 발생하는 컴파일 오류 정리 [1]
13182정성태12/4/202214248Windows: 217. Windows 환경에서의 Hello World x64 어셈블리 예제 (MASM 버전)
13181정성태12/3/202212766Linux: 54. 리눅스/WSL - hello world 어셈블리 코드 x86/x64 (nasm)
13180정성태12/2/202213559.NET Framework: 2074. C# - 스택 메모리에 대한 여유 공간 확인하는 방법파일 다운로드1
13179정성태12/2/202212279Windows: 216. Windows 11 - 22H2 업데이트 이후 Terminal 대신 cmd 창이 뜨는 경우
13178정성태12/1/202213381Windows: 215. Win32 API 금지된 함수 - IsBadXxxPtr 유의 함수들이 안전하지 않은 이유파일 다운로드1
13177정성태11/30/202213958오류 유형: 829. uwsgi 설치 시 fatal error: Python.h: No such file or directory
13176정성태11/29/202211501오류 유형: 828. gunicorn - ModuleNotFoundError: No module named 'flask'
13175정성태11/29/202215802오류 유형: 827. Python - ImportError: cannot import name 'html5lib' from 'pip._vendor'
13174정성태11/28/202212524.NET Framework: 2073. C# - VMMap처럼 스택 메모리의 reserve/guard/commit 상태 출력파일 다운로드1
13173정성태11/27/202213448.NET Framework: 2072. 닷넷 응용 프로그램의 스레드 스택 크기 변경
13172정성태11/25/202212942.NET Framework: 2071. 닷넷에서 ESP/RSP 레지스터 값을 구하는 방법파일 다운로드1
13171정성태11/25/202212472Windows: 214. 윈도우 - 스레드 스택의 "red zone"
13170정성태11/24/202213347Windows: 213. 윈도우 - 싱글 스레드는 컨텍스트 스위칭이 없을까요?
13169정성태11/23/202214663Windows: 212. 윈도우의 Protected Process (Light) 보안 [1]파일 다운로드2
13168정성태11/22/202212554제니퍼 .NET: 31. 제니퍼 닷넷 적용 사례 (9) - DB 서비스에 부하가 걸렸다?!
13167정성태11/21/202213030.NET Framework: 2070. .NET 7 - Console.ReadKey와 리눅스의 터미널 타입
13166정성태11/20/202212940개발 환경 구성: 651. Windows 사용자 경험으로 WSL 환경에 dotnet 런타임/SDK 설치 방법
13165정성태11/18/202211985개발 환경 구성: 650. Azure - "scm" 프로세스와 엮인 서비스 모음
13164정성태11/18/202213904개발 환경 구성: 649. Azure - 비주얼 스튜디오를 이용한 AppService 원격 디버그 방법
13163정성태11/17/202214227개발 환경 구성: 648. 비주얼 스튜디오에서 안드로이드 기기 인식하는 방법
13162정성태11/15/202215721.NET Framework: 2069. .NET 7 - AOT(ahead-of-time) 컴파일 [1]
... 16  17  18  19  20  21  22  23  24  25  26  27  28  29  [30]  ...