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

... 76  77  78  79  80  81  82  83  84  85  86  87  [88]  89  90  ...
NoWriterDateCnt.TitleFile(s)
11736정성태10/12/201818478오류 유형: 492. Visual Studio 로딩 시 오류 - The 'Scc Display Information' package did not load correctly.
11735정성태10/12/201824231VS.NET IDE: 129. Visual Studio - 특정 문자(열)를 개행 문자로 바꾸는 방법
11734정성태10/10/201818594Linux: 4. Synology NAS(DS216+II)에 FTDI 장치 연결 후 C#(.NET Core)으로 DTR 제어파일 다운로드1
11733정성태10/10/201821334Linux: 3. Synology NAS(DS216+II)에서 FTDI 장치를 C/C++로 제어
11732정성태10/10/201821059디버깅 기술: 119. windbg 분석 사례 - 종료자(Finalizer)에서 예외가 발생한 경우 비정상 종료(Crash) 발생파일 다운로드1
11731정성태10/9/201820545개발 환경 구성: 409. C# - REST API를 이용해 Azure Kudu 서비스 이용 - 웹 앱 확장 처리파일 다운로드1
11730정성태10/9/201819819개발 환경 구성: 408. C# - REST API를 이용해 Azure Kudu 서비스 이용 - 파일 처리파일 다운로드1
11729정성태10/9/201822296Windows: 150. 윈도우에서 ARP Cache 목록 확인 및 삭제하는 방법
11728정성태10/9/201820103사물인터넷: 50. Audio Jack 커넥터의 IR 적외선 송신기 [1]
11727정성태10/8/201821336오류 유형: 491. Visual Studio의 리눅스 SSH 원격 연결 - "Connectivity Failure. Please make sure host name and port number are correct."
11726정성태10/7/201824037사물인터넷: 49. 라즈베리 파이를 이용해 원격 컴퓨터의 전원 스위치 제어파일 다운로드1
11724정성태10/5/201823768개발 환경 구성: 407. 유니코드와 한글 - "Hangul Compatibility Jamo"파일 다운로드1
11723정성태10/4/201817533개발 환경 구성: 406. "Docker for Windows" 컨테이너 내의 .NET Core 응용 프로그램에서 직렬 포트(Serial Port, COM Port) 사용 방법
11722정성태10/4/201821239.NET Framework: 798. C# - Hyper-V 가상 머신의 직렬 포트와 연결된 Named Pipe 간의 통신파일 다운로드1
11721정성태10/4/201821544.NET Framework: 797. Linux 환경의 .NET Core 응용 프로그램에서 직렬 포트(Serial Port, COM Port) 사용 방법파일 다운로드1
11720정성태10/4/201823097개발 환경 구성: 405. Hyper-V 가상 머신에서 직렬 포트(Serial Port, COM Port) 사용
11719정성태10/4/201823695.NET Framework: 796. C# - 인증서를 윈도우에 설치하는 방법
11718정성태10/4/201818877개발 환경 구성: 404. (opkg가 설치된) Synology NAS(DS216+II)에 cmake 설치
11717정성태10/3/201821482사물인터넷: 48. 넷두이노의 C# 네트워크 프로그램 [1]
11716정성태10/3/201822082사물인터넷: 47. Raspberry PI Zero (W)에 FTDI 장치 연결 후 C/C++로 DTR 제어파일 다운로드1
11715정성태10/3/201820830사물인터넷: 46. Raspberry PI Zero (W)에 docker 설치
11714정성태10/2/201820093사물인터넷: 45. Raspberry PI에 ping을 hostname으로 하는 방법
11713정성태10/2/201822480개발 환경 구성: 403. Synology NAS(DS216+II)에 docker 설치 후 .NET Core 2.1 응용 프로그램 실행하는 방법
11712정성태10/2/201827662.NET Framework: 795. C# - 폰트 목록을 한글이 아닌 영문으로 구하는 방법 [3]
11711정성태10/2/201823100오류 유형: 490. 윈도우 라이선스 키 입력 오류 0xc004f050, 0xc004e028
11710정성태10/2/201822048.NET Framework: 794. C# - 같은 모양, 다른 값의 한글 자음을 비교하는 호환 분해 [5]
... 76  77  78  79  80  81  82  83  84  85  86  87  [88]  89  90  ...