UX/UI・프로덕트 디자이너를 위한 학습 자료 모음
UX/UI∙프로덕트 디자이너를 위한 학습 방법, 자료 모음을 공유합니다. '비전공자 디자이너로 살아남기_(1) 신입~주니어'(Freese design님)을 읽고, 참고하여 트렌드를 반영한 학습 방법과 자료 모음을 담았습니다.
- 타이포그래피, 그리드, 컴포넌트 단위 디자인, 웹 접근성 등
- e.g: Google Material Design 3, Google Material Design 2, Apple 휴먼 인터페이스 가이드라인(HIG)
- e.g: Wanted Design Library
- e.g: 범정부UI/UX 디자인 시스템 공식 웹 사이트(KRDS: Korea Design System), KRDS (Korea Design System) 라이브러리
- 사용자 리서치 방법론: 인터뷰, 설문조사, 사용성 테스트 등
- 기초 책 읽기(UX/UI, UX심리학, 행동경제학, UX 라이팅, 인포그래픽 가이드, IT 지식, 데이터)
- 와이어프레이밍, 프로토타이핑 툴(Figma) 숙달
- 피그마 등 툴 학습 (인프런 유료 추천 강의 피그마 배리어블 디자인 시스템, 기초부터 실무까지 제대로 배우는 피그마 UI 디자인 클래스)
- 디자인 기초 학습 (필요할 경우): 포토샵, 일러스트레이터 등 툴(유튜브: '디자인 베이스', '마디아' 등)
- UX/UI 기초 용어 및 이론 (리메인 디자인 시스템 오픈 튜토리얼)
- 실제 서비스 UI/UX 모작, 감각, 분석 익히기
- 함께 성장하는 프로덕트 디자인 스터디 (유료, 환급)
- 아이콘 디자인 연습
- e.g: 피그마 활용 아이콘 그리기 연습
- 유아이볼, WWIT, Mobbin, 유저스푼, 핀터레스트 등 활용 UI 레퍼런스 수집
- e.g: 커머스 플랫폼 디자이너라면 다양한 쇼핑 앱 UI 캡처 및 정리
- 비전공자를 위한 이해할 수 있는 IT 지식 (책)
- HTML/CSS (강의)
- e.g: 인프런 유노코딩
- e.g: HTML5 & CSS3 기초 문법 올인원 강의 | 인프런 이룸코딩
- e.g: 참고 아티클 (출처: 우디님)
- 사이드 프로젝트, 해커톤, 인턴, 실무 경험 시작
글로벌 디자인 인턴십 프로그램
한국디자인진흥원
- 관련 서적, 아티클, 커뮤니티 활동 등
- 디자인 베이스 유튜브 채널
- 인프런 피그마 배리어블 디자인 시스템 강의, 오픈패스 UI 컴포넌트, 콜로소 프로덕트 디자인 강의
- 피그마 커뮤니티 리소스, 피그마 피디아 (기술 블로그 모음)
- 디자이너 성장 가이드와 피그마 활용 꿀팁 모음 강의(무료)
- 디자인 프로세스 제로투원 : Figma로 기획부터 디자인, 딜리버리까지 강의(무료)
글로벌 기업 프로덕트 디자이너 포트폴리오 최초 공개 ⭐️ 극비 디자인 과제까지 보여드립니다 �
[포폴톡 EP8]- YouTube
- 믹스패널, 구글 태그 매니저, 생성형 AI 활용 실전 사용자 행동 분석
1. 제품 성장 단계에 따른 지표 찾기 여정 | 인프콘2024 다시보기(Youtube)
변성윤(카일스쿨님)
2. 인프콘2024 강의 자료 다운로드 받기
https://inf.run/F1Q9c
- 현직 UXer가 들려주는 UX 디자인 커리어 가이드, 목표 설정의 중요함
- 생각이 너무 많은 30대를 위해 구글 수석 디자이너가 전하는, 불안 속에서도 스스로 문제를 정의하고 행동으로 삶을 바꾸는 스마트한 일과 성장의 기술
- 업무 노하우
- UX×AI 인사이트
- 인공지능 시대의 UX 디자인 원칙과 UX 리서치 노하우
- XR(확장현실, eXtended Reality): 가상현실(VR), 증강현실(AR), 혼합현실(MR) 등 모든 실감형 기술
- AI 활용 게임 UI 디자인
- 게임 UI의 사용성 평가, 휴리스틱 평가 등 UX 이론 포함
- 배색 기초 핵심 이론, 배색 및 타이포그래피 디자인 노하우
- 레이아웃, 구조 설계, 시각 디자인 기초 및 노하우
- 황금비율 등 6가지 구도를 활용한 레이아웃 노하우
- 실무 감각 및 디자인 영감에 도움이 되는 레이아웃, 그리드 구성 요소와 원리
- iOS System font (San Francisco)
- Android System font (영문: Roboto)
- Android System font (한글, 영문도 가능: Noto Sans Korean)
- 심리학 기반 UX 디자인 원칙 제공
- 디자인 결정 근거 강화, 사용자 행동 이해 증진
- Mixpanel로 데이터 들여다보기
- 데이터 수집 크롬 확장 프로그램 (월 10회 무료)
- 출처: 프로덕트 디자이너 상효님, UX 라이팅 발표 자료
- LottieFiles 공식 무료 강의
- Figma to Lottie: Figma에서 만드는 모션 애니메이션 (수료증 발급)
- LottieFiles AE 플러그인 수료 과정
- 토스 테크니컬 라이팅 가이드
- 개발자를 위한 글쓰기(기술 문서) 기본기, 기술적인 내용을 정확하고 효과적으로 전달하는 글쓰기 가이드
- PM, 디자이너, 스타트업 창업자를 위한 제품 관리·성장 전략 인사이트 제공
- 실리콘밸리 사례, 실무 중심의 팁, 프로덕트를 위한 자료
- UX 디자인 아티클, 트렌드 파악, 문제 해결 능력 향상, UX 인사이트 습득
- 출처: UIUX디자인에 대한 논리적 근거 확보하기
스타트업 성장분석 플랫폼 혁신의숲에서 수천개 기업의 다양한 성장 데이터를 확인해 보세요.
https://www.innoforest.co.kr/
- [혁신의숲] 개인도메인 이메일 회원가입 신청서 (취준생)
화면설계서/화면정의서 샘플
출처: hagiro님
화면정의서
출처: zion lee님
(기획)화면설계서 템플릿 UX/UI Wireframe Template(KOR) UX/UI
출처: Aron님
[2023] 기획자/디자이너를 위한 UXUI 화면설계서/스토리보드 양식 (Quick UXUI Wireframe templates), 출처: Loreen kim님
- 글로벌 무료 멘토링 플랫폼
- 영어로 포트폴리오 피드백과 커리어 상담 받을 수 있음
① 이미지 추출: 피그마에서 PNG 2배율로 추출
② 프레임 배치: 1920px 프레임에 PNG 삽입 (해상도 문제 해결)
③ PDF로 내보내기: 피그마에서 PDF 익스포트
④ PDF 용량 압축: 최종 PDF 크기 줄이기
요약: 피그마 > PNG 2배 이미지로 추출 > 피그마 1920 프레임에 올리기 > PDF로 추출 > PDF 압축