UI/UX 디자인 독학 로드맵 2026 — 기초부터 포트폴리오까지
UI/UX 디자인이란?
- UI (User Interface): 사용자가 보는 화면 디자인 (버튼, 메뉴, 색상)
- UX (User Experience): 사용자 경험 설계 (흐름, 편의성, 심리)
> 핵심 요약: 이 글에서 가장 중요한 내용을 먼저 확인하세요.
취업 시장의 가치
- 연봉: 신입 2,800-3,500만원 → 경력 4,500-6,000만원
- 성장성: 높음 (스타트업, IT 기업 대수요)
- 원격근무: 70% 이상 기업 가능
UI/UX 디자이너 필수 스킬
| 스킬 | 중요도 | 난이도 |
| 디자인 이론 (색상, 타이포그래피) | ⭐⭐⭐⭐⭐ | ⭐⭐ |
| Figma 또는 Adobe XD | ⭐⭐⭐⭐⭐ | ⭐⭐⭐ |
| 사용자 리서치 | ⭐⭐⭐⭐ | ⭐⭐⭐ |
| 프로토타이핑 | ⭐⭐⭐⭐⭐ | ⭐⭐⭐ |
| 개발 지식 (HTML/CSS 기초) | �⭐⭐⭐ | ⭐⭐ |
8주 UI/UX 디자인 독학 로드맵
1-2주: 디자인 기초 이론
색상 이론:
- 색상환 (Red, Yellow, Blue 삼원색)
- 대조도 (명도, 채도)
- 색상 심리 (빨강: 긴급, 파랑: 신뢰)
- 폰트 선택 기준 (Serif vs Sans-serif)
- 글자 크기 계층 (H1, H2, Body)
- 행 간격, 자간 최적화
- 근접성 (관련 요소를 가깝게)
- 정렬 (일관된 정렬)
- 대비 (강조할 요소 돋보이기)
- 반복 (일관된 패턴)
3주: Figma 기초 및 와이어프레임
Figma 설치 및 기초:
Frame: 웹/모바일 화면 크기 설정
Component: 재사용 가능한 디자인 요소
Prototype: 상호작용 정의와이어프레임 그리기:
목표: SNS 앱 와이어프레임
1. 메인 페이지
- 상단 네비게이션
- 피드 목록
- 하단 탭
2. 상세 페이지
- 포스트 전체 보기
- 댓글 목록
- 공유 버튼4주: 비주얼 디자인 (Mockup)
고충실도 디자인 (High Fidelity):
- 실제 색상 적용
- 타이포그래피 정의
- 이미지, 아이콘 추가
- 간격(Padding, Margin) 정의
색상:
- Primary: #007AFF (버튼, 링크)
- Secondary: #F2F2F7 (배경)
- Success: #34C759 (확인)
타이포그래피:
- Heading 1: 24px, Bold
- Body: 16px, Regular5주: 프로토타이핑 및 인터랙션
프로토타입 정의:
상호작용 설정:
- 버튼 클릭 → 다음 화면 전환
- 스크롤 → 네비게이션 숨김
- 입력 필드 포커스 → 색상 변경6주: 사용자 리서치 및 피드백
사용자 인터뷰:
- 5-7명 사용자와 인터뷰
- 문제점, 개선점 수집
- 페르소나 작성 (목표, 행동, 니즈)
- 두 가지 디자인 비교
- 사용자 피드백 수집
- 데이터 기반 개선
7-8주: 포트폴리오 프로젝트
포트폴리오 프로젝트 사례:
Project 1: 음식 배달 앱
- 와이어프레임 (메인, 상세, 결제)
- 비주얼 디자인 (색상, 타이포)
- 프로토타입 (버튼, 전환 효과)
- 사용자 리서치 결과
- 홈페이지
- 상품 검색 페이지
- 장바구니, 결제 플로우
UI/UX 필수 도구 비교
| 도구 | 가격 | 난이도 | 협업 | 추천 |
| Figma | 무료/유료 | ⭐⭐⭐ | ⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ |
| Adobe XD | 무료 (한정)/유료 | ⭐⭐⭐ | ⭐⭐⭐⭐ | ⭐⭐⭐⭐ |
| Sketch | 유료만 | ⭐⭐⭐ | ⭐⭐⭐ | ⭐⭐⭐ |
| Penpot | 무료 | ⭐⭐⭐⭐ | ⭐⭐⭐⭐ | ⭐⭐⭐ |
---
UI/UX 자주 묻는 질문 (FAQ)
1. 미술 경험이 없어도 UI/UX 디자이너가 될 수 있나요?
네, 충분히 가능합니다. 이유:- UI/UX는 미술보다 논리와 사용성 중심
- 색상, 타이포 이론은 학습 가능
- 많은 성공한 디자이너가 미술 비전공
2. 개발 지식이 필수인가요?
아닙니다. 다만:- HTML/CSS 기초는 알면 좋음 (디자이너-개발자 소통)
- 필수는 아니지만 장점 (약 15% 경쟁력 상승)
3. 포트폴리오는 몇 개가 필요한가요?
- 신입: 3-5개 프로젝트 (case study 포함)
- 이직: 10개 이상 (다양한 프로젝트 유형)
- 프리랜서: 20개 이상 (실적 입증)
4. 취업이 잘 되나요?
네, 매우 잘 됩니다. 2026년 기준:- 스타트업: 대수요
- 대기업: IT 부서, 자체 서비스 회사
- 취업률: 약 85-90% (6개월 내)
5. 보수 교육은 필요한가요?
트렌드 따라잡기는 필수:- 신 디자인 트렌드: 6개월마다
- 툴 업데이트: 3개월마다
- 사용자 행동 변화: 지속적
UI/UX 고급 개념
디자인 패턴
네비게이션 패턴:
- Tab Navigation (하단 탭)
- Hamburger Menu (좌상단 메뉴)
- Search Bar (상단 검색)
- Input Field (텍스트 입력)
- Dropdown (선택)
- Checkboxes (다중 선택)
- Radio buttons (단일 선택)
웹 표준 준수
접근성 (Accessibility):
- 색상만으로 정보 구분 금지 (시각장애인 배려)
- 폰트 크기 최소 14px
- 충분한 대비도 (명도 차이)
- ARIA 라벨 추가
최종 포트폴리오 체크리스트
각 프로젝트에 포함할 내용
- [ ] 프로젝트 배경 및 문제 정의
- [ ] 사용자 리서치 요약
- [ ] 와이어프레임
- [ ] 최종 디자인 (3-5 스크린)
- [ ] 프로토타입 (인터랙션 시연)
- [ ] 사용자 피드백 및 개선사항
- [ ] 개인적 학습 포인트
결론
UI/UX 디자인은 배우기 쉽고 취업 전망 밝은 분야입니다.
- 1-2주: 이론 학습
- 3-4주: 도구 숙련
- 5-6주: 첫 프로젝트 완성
- 7-8주: 2-3개 포트폴리오 추가
---
관련 콘텐츠: 교육 가이드