View Source

이전장에서 웹용을 만든 디자인을 윈도우 네이티브로 이식하는 무모한 실험도 함께 진행해보겠습니다.

Akka > Pencil with WPF > image-2026-3-8_9-50-16.png

Blend WPF

Akka > Pencil with WPF > image-2026-3-8_9-12-48.png

Blend는 VS Insider에 포함되어있으며(인스톨시 선택) 코딩도 가능하지만 디자인에 특화된 툴입니다.
디자인 AI생성기능만 사용하지 않는다고하면 펜슬이 필요 없겠지만.. WPF의 Xaml을 이용해 디자인을 잘하기란 쉽지 않습니다. ( 그래서 보급 실패 )

펜슬 디자인의 메인 화면을 메인윈도우에 적용

펜슬 디자인은 피그마와같이 무한 캔버스이며 , 메인화면이라고 요청해도 메인화면이 무엇인지 찾아냄
- 더 구체적이게 하려면 해당 요소의 캔버스의 OverLay이름명을 직접 요청
WPF 윈도우의 어플리케이션을 시작하면 빈 메인윈도우가 생성되어 , 메인윈도우는

Akka > Pencil with WPF > image-2026-3-8_9-39-29.png

Akka > Pencil with WPF > image-2026-3-8_9-31-59.png

Akka > Pencil with WPF > image-2026-3-8_9-37-2.png

Blend의 특징중하나 컴포넌트 요소를 모두 애니메이션화할수 있습니다. ( 이동,회전,3D회전까지,확대축소)

TitleCaption 을 타임라인 애니메이션 , 페이지 로드시 왼쪽안보이는곳에서 출발해 지금 위치까지... Path와 회전을 적용해 나비가 날라오는 느낌의 애니를 적용

-애니메이션 타임라인을 Belnd툴에 제어하게끔 인라인 StoryBoard로 구현

Akka > Pencil with WPF > image-2026-3-8_9-39-7.png

Akka > Pencil with WPF > image-2026-3-8_9-48-35.png

Akka > Pencil with WPF > image-2026-3-8_9-56-28.png

Akka > Pencil with WPF > image-2026-3-8_10-0-25.png