영어로 읽기

다음을 통해 공유


Windows 앱용 디자인 도구 키트 및 샘플

이 항목에서는 시각적으로 매력적이고 사용자에게 친숙한 Windows 애플리케이션을 만들기 위한 다양한 디자인 및 UI 관련 리소스를 제공합니다. Visual Studio와 같은 개발 도구를 비롯한 추가 다운로드는 Windows 개발대한 다운로드 및 도구를 참조하세요.

도구 키트 및 라이브러리

Figma 도구 키트 아이콘

WinUI 아이콘

Windows 커뮤니티 미리 보기

템플릿 스튜디오 썸네일

Figma 도구 키트
Windows 디자인 키트, 2024년 11월
도구 키트 열기

WinUI
Windows 앱에 대한 컨트롤 및 기타 UI 요소.
설치 지침

Windows 커뮤니티 도구 키트
도우미 함수, 사용자 지정 컨트롤 및 앱 서비스.
설치 지침

Template Studio
마법사 기반 환경을 사용하여 새 WinUI, WPF 및 UWP 앱 만들기를 가속화합니다.
설치 지침

Microsoft Store에서 WinUI 갤러리 앱을 다운로드하여 XAML 컨트롤과 Fluent 디자인 시스템의 실행 모습을 확인하세요. WinUI 3 갤러리WinUI 2 갤러리 앱에는 대부분의 WinUI 3 및 WinUI 2 컨트롤, 특징, 기능의 대화형 예제가 포함되어 있습니다. 이 앱은 이 웹사이트의 대화형 컴패니언입니다. 이 앱이 설치되면 개별 컨트롤 페이지의 링크를 사용하여 앱을 시작하고 실제로 작동하는 컨트롤을 확인할 수 있습니다.

글꼴

Windows 형식 시스템을 사용하면 UI에서 가독성과 가독성을 최대화하기 위해 콘텐츠의 구조 및 계층 구조를 만들 수 있습니다(자세한 내용은 Segoe UI 글꼴 패밀리참조).

다음 글꼴을 사용하는 것이 좋습니다.

도구

타일 및 아이콘 생성기 작업이 진행 중인 Adobe Photoshop의 스크린샷

Adobe Photoshop 작업에 대한 타일 및 아이콘 생성기를 사용하여 7개 파일에서 68개의 권장 타일 및 아이콘 자산을 생성할 수 있습니다(타일 및 아이콘 생성기 데모참조).

타일 및 아이콘 생성기 작업 다운로드

샘플

다음 샘플에는 시각적으로 매력적이고 사용자에게 친숙한 다양한 인터페이스가 포함되어 있습니다.

Fluent XAML 테마 편집기

Fluent XAML 테마 편집기 이미지의 스크린샷

Fluent XAML 테마 편집기는 Fluent 디자인 시스템 유연성을 보여 주는 도구이며 Windows 애플리케이션에서 사용되는 ResourceDictionary 프레임워크에 대한 XAML 태그를 생성하여 앱 개발 프로세스를 지원합니다.

도구 샘플 다운로드

GitHub에서 도구 확인

바나르스델

VanArsdel sanple 앱의 스크린샷입니다.

Van Arsdel, Ltd. 엔드 투 엔드 Windows 샘플 앱은 Fluent 디자인 시스템다음 물결을 보여주기 위해 빌드되었습니다. 이 샘플 앱은 WinUI의 향상된 밀도와 새 컨트롤뿐 아니라 UX 프레임워크 및 컴퍼지션의 강력한 기본 기능을 광범위하게 사용합니다. 이 샘플은 IoT 디바이스(이 예제에서는 램프)를 관리하고 구매하는 풍부하고 생산적인 환경을 구축하는 방법을 보여줍니다.

VanArsdel 샘플 다운로드

GitHub에서 VanArsdel 샘플 확인

BuildCast

BuildCast 샘플의 스크린샷

BuildCast는 Fluent 디자인 시스템 및 Windows를 소개하기 위해 빌드된 엔드 투 엔드 샘플입니다. 일부 Windows 기술 매니아 피드를 비롯한 비디오 팟캐스트를 검색하고 다운로드하고 재생할 수 있습니다. 또한 잉크 메모, 책갈피 및 원격 재생을 제공합니다. 이 샘플은 Fluent 디자인으로 멋진 앱 만들기 간담회의 2017 빌드 회의에서 처음 소개되었습니다.

BuildCast 샘플 다운로드

GitHub에서 BuildCast 샘플 확인

점심 스케줄러

점심 스케줄러 샘플의 스크린샷

친구 및 직장 동료와 점심 식사를 예약하기 위한 Windows 앱 샘플입니다. 점심 예약을 만들고, 관심 있는 식당에 친구를 초대하고, 앱은 모두를 위한 점심 관리를 관리합니다. 이 앱은 아크릴, 리빌 및 연결된 애니메이션을 포함하여 플루언트 디자인 시스템요소를 통합합니다.

점심 식사 스케줄러 샘플 다운로드

GitHub에서 점심 식사 스케줄러 샘플 확인

더 많은 코드가 필요하세요?

모든 Windows 앱 샘플의 전체 목록은 Windows 샘플 페이지 확인하세요.