[Illustrator - UI디자인 아이콘 제작]
- 직관적인 아이콘 아이디어 시각화 디자인구성요소 제작하기 -
프로토타입 웹페이지 제작에 필요한 기초데이터 수집 아이콘 편집과 창의적인 아이디어 구상 전개로 스케치 작업을 통해서 함축적이고, 직관적인 완성도 있는 아이콘을 제작해보기...
+++++++
개별실습과제: 이수자(내부)평가 실기 대체
- UI디자인 디지털디자인 구성요소 제작 -
출처: https://edyoon.tistory.com/1042?category=671868 [▷ 윤샘 컴교실 (^(oo)^) YoonSemComClassroom ◁]
+++++++
-이수자(내부) 평가 실기 대체: 아이콘 제작-
Canvas Size(px)
상세페이지 권장 규격
- w960 x 2500h -
출처: https://edyoon.tistory.com/1042?category=671868 [▷ 윤샘 컴교실 (^(oo)^) YoonSemComClassroom ◁]
Canvas Size(px)
상세페이지 권장 규격
- w960 x 2500h -
출처: https://edyoon.tistory.com/1042?category=671868 [▷ 윤샘 컴교실 (^(oo)^) YoonSemComClassroom ◁]
Canvas Size(px)
상세페이지 권장 규격
- w960 x 2500h -
출처: https://edyoon.tistory.com/1042?category=671868 [▷ 윤샘 컴교실 (^(oo)^) YoonSemComClassroom ◁]
Canvas Size(px)
상세페이지 권장 규격
- w960 x 2500h -
출처: https://edyoon.tistory.com/1042?category=671868 [▷ 윤샘 컴교실 (^(oo)^) YoonSemComClassroom ◁]
Artboard_Canvas Size(px)
최종 산출 결과물(PNG 이미지) 권장규격
- width500 x 600height -
+++ 아이콘 제작 (40개 이상) 세부 작업내용 +++
1. 본인이 직접 제작한 아이콘 최소 10개 이상 (얼굴 표정 5개 포함)
2. 포토샵 제공 아이콘이나 일러스트 심벌 10개 내외 삽입하기
3. 기타 웹에서 찾은 무료 아이콘 응용 편집 (SNS 아이콘 포함)
+++++++
디자인 구성요소 프로토타입 아이콘 제작
가벼운 오프닝... 작업!!
(펜툴을 사용하지 않고, 도형 툴 사용!! 오브젝트 조합으로 제작해 보기)
++ 아이디어 시각화 아이콘 제작해 보기 ++
세탁기? 침대?
Align Panel(+Pathfindr): Shift + F7
[개별 실습과제!! 일러스트 드로잉 포트폴리오 컬렉션]
[개별 실습과제!! 포트폴리오 아이콘 제작해 보기]
아트보드(캔버스) 크기: Width 500 * Height 600(700)
[ icon drawing template ]
w500 x 600h
문제해결능력 키우기!! 창의적으로 날씨와 얼굴 표정, SNS 포함한
포트폴리오로 사용 가능한 아이콘 제작해 보기
??? 완성도 보통 및 미흡 아이콘 제작 결과물 샘플 ???
+++ 그리드 가이드선 레이아웃 작업 +++
??? 완성도 잘함 또는 매우잘함 아이콘 제작 결과물 샘플 ???
+ + + 아이콘 산출 결과물 컬렉션 + + +
이_지
김_미
김_솔
김_혜 1
김_혜 2
최_현 1
최_현 2
이_아
장_은
+ + + + + + +
[Illustrator 수업자료 다운로드!!]
압축해제 암호: 91????
01.
(오브젝트 다루기, 드로잉 작업 기본)
02.
(오브젝트 다루기, 드로잉 작업 응용)
03.
(아이디어 시각화, 펜툴다루기 응용)
1. 산봉우리 드로잉: Pen Tool & Smooth Tool 활용 작업
2. 알파벳 B 문자를 오브젝트(패스)로 변환하여 응용 작업
- 대문자 B(HY견고딕) / 글자크기 300px- Type / Create Outlines (Ctrl + Shift + O)- Direct Selection Tool & Smooth Tool 활용
3. 문자를 오브젝트(패스)로 변환 후...- 그룹 해제하고, 그라디언트 적용 가능- 개별 글자를 오브젝트 변형 가능 - Direct Selection Tool
Create Outlines
입력한 글자를 패스(Path) 오브젝트로 변환하여 이미지 처럼 변형할 수 있고, 버전에 상관 없고 다른 컴퓨터에서 공동 작업할때 글꼴 유실이 없는 장점이 있다. (문자 속성, 텍스트 성질은 없어짐)
일러스트 작업의 마무리는 모든 문자를 오브젝트로 변환해서 저장하는 것이 권장이다.
인쇄소에서 출력할 때 글꼴 호환성 문제 위험요소를 사전에 예방할 수 있다.
Ctrl + A & Ctrl + Shift + O
+++ 타이포그래피 - 문자디자인 추가 실습 +++
https://edyoon.tistory.com/1010
+++++++
Window / Pathfinder
Pathfinder == Ctrl + Shift + F9
패스파인더의 디바이드 기능은 분할된 오브젝트들을 자동 그룹화 한다.
오브젝트 더블 클릭 / 격리 모드나 그룹해제를 하고 추가 작업을 진행한다.
+++++++
- 디자인 구성요소 프로토타입 제작 샘플 -
아이디어 시각화 연습 - 카메라 캐릭터1
아이디어 시각화 연습 - 카메라 캐릭터2
아이디어 시각화 결과물 - 카메라 캐릭터 샘플 더보기
https://edyoon.tistory.com/1056
+++ 기존의 아트보드 크기 바꾸기: shift + O +++
상단 옵션바에 W & H 값 입력, 또는 마우스로 바운딩 박스 드래그
+++++++
[개별실습과제 곰돌이 캐릭터 아이디어 시각화 해보기]
+ 일러스트 결과물 / 포트폴리오 컬렉션 +
04. 기초데이터 수집&디자인구성요소 제작 - 약도
(종합 응용실습 과제)
가상의(본인이 자주가는) 매장이나 맛집/카페 등... 약도 제작하기
- 아트보드(명함) 크기: w90 x 50h (단위 mm) -
완성도 높게 제작해서 제출하기: 본인이름_약도.png(gif)
+++ 일러스트 브러시 라이브러리 활용 +++
Window / Brush Libraries / Artistic / Artistic_Paintbrush
F5 - Brushes Panel
[프로토타입 제작 기초데이터 수집 - 명함 약도 샘플]
++ 강변북로 일산 가는길 중간에... 자유로 행주산성 맛집들 ++
+++++++
-이수자(내부) 평가 실기 대체: 약도 기획제작-
Canvas Size(px)
상세페이지 권장 규격
- w960 x 2500h -
출처: https://edyoon.tistory.com/1042?category=671868 [▷ 윤샘 컴교실 (^(oo)^) YoonSemComClassroom ◁]
Canvas Size(px)
상세페이지 권장 규격
- w960 x 2500h -
출처: https://edyoon.tistory.com/1042?category=671868 [▷ 윤샘 컴교실 (^(oo)^) YoonSemComClassroom ◁]
Canvas Size(px)
상세페이지 권장 규격
- w960 x 2500h -
출처: https://edyoon.tistory.com/1042?category=671868 [▷ 윤샘 컴교실 (^(oo)^) YoonSemComClassroom ◁]
Canvas Size(px)
상세페이지 권장 규격
- w960 x 2500h -
출처: https://edyoon.tistory.com/1042?category=671868 [▷ 윤샘 컴교실 (^(oo)^) YoonSemComClassroom ◁]
Artboard_Canvas Size(px)
최종 산출 결과물(PNG 이미지) 권장규격
- w500 x 600h -
본인이 자주가는 카페나 맛집, 편의점 등 잘 아는 장소와 관련해
기초데이터 수집을 하고, 아이디어 시각화 기획 약도 제작해 보기
...찾아오시는 길(약도) 기획 제작 추가 참고자료...
https://edyoon.tistory.com/1002?category=671869
+ + + 약도 산출 결과물 컬렉션 + + +
+++ 이젠 당산(영등포) 캠퍼스 약도 제작 +++
프로토타입제작 기초데이터 수집 자료
+ + + + + + +
개인용(비상업용) 무료 PNG 투명 이미지 제공 사이트
+ + + + + + +
[ ...icon sns... ]
+++++++
++ 결시자(-10점) 재평가 실기 템플릿 ++
- 필기 평가는 문제 변경해 결시자 재평가 실시 -
- 빈 영역에 아이콘 10개 이상 추가해 보기 -
+++++++
[ txt_icon / css_coding ]
+++++++
[ 자동차 내부 UI/UX - 사용자 (메뉴)버튼 ]
'■■▶ILLUSTRATOR ①◀' 카테고리의 다른 글
00(Illustrator) 오브젝트 드로잉 응용 ★할인 쿠폰★ 제작 기초데이터 수집 샘플 (0) | 2021.01.28 |
---|---|
00(Illustrator) 무료 아이콘 다운로드 - 심플한 플랫 아이콘(FLAT ICON) (0) | 2018.02.27 |
00(Illustrator) 비트맵 이미지(스케치)를 벡터 이미지(Path)로 변환(+블랜딩 모드) (0) | 2017.10.25 |
00(Illustrator) 포트폴리오 컬렉션 제작 종합실습!! / 일러스트 드로잉 결과물 취합 (0) | 2017.10.24 |
00(Illustrator) 컬러링 - 색칠활동(ColoringBook) 뽀로로 일러스트 드로잉 예제 (0) | 2017.10.24 |