일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | ||||
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 |
- 포토샵기초
- 레이어그룹
- 일러스트아이소메트릭
- CSS
- 아이드로퍼툴
- 자바스크립트함수
- 포토샵
- 인포그래픽
- 사진보정
- 자바스크립트
- 자바스크립트매개변수
- 일러스트 기초
- IT
- 일러스트3d
- 아이콘가이드
- css diner
- 디스톨트
- html
- html기초
- 자바스크립트 변수
- 자바스크립트기초
- flexbox froggy
- 웹디자인 기초
- 일러스트기초
- flexbox defense
- 일러스트 브러쉬
- 웹디자인
- 일러스트 블렌드
- 통계사이트
- 스마트오브젝트
- Today
- Total
목록국비지원 UX UI 디자인 (66)
오늘보다 더 나은 내일

※ Gradient mesh : 그라디언트와 메쉬만으로 표현할 수 없는 색상 범위를 연출해줄 수 있는 기능이다. - 먼저 접목된 그라디언트 방향을 따라 메쉬를 추가 형성할 수 있는 기능이다. - 기존의 그라디언트에 메쉬의 색상을 추가하고 싶을 때 - 사선형태의 색상 넣고싶을 때 사용할 수 있다. - 조건 및 작업 순서 1) 작업할 오브젝트의 면에 그라디언트 대입 2) 알맞는 타입의 그라디언트 항목 설정 - 리니어 타입 : 수직, 수평 메쉬 - 라디얼 타입 : 사선 메쉬 3) 작업에 방해되는 스트로크 속성 미리 제거한다. 4) 메쉬 추가하기 위해서 그라디언트 물체 익스팬드 5) 익스팬드 진입 후 그라디언트 메쉬 체크 적용 6) 채색 작업 편리하게 진행하기 위해 걸려있던 그룹과 클리핑마스크를 해제 7) 분리..

1. 로고 (1) 로고란? 제품, 상점, 브랜드의 상징이 잘 드러날 수 있도록 만든 홍보 수단 중 하나이다. (2) 좋은 로고 디자인 1) 제품이나 회사가 지닌 이미지를 쉽게 전달할 수 있어야 한다. 2) 인상깊고 기억에 남아야한다. 3) 모든 매체에 활용될 수 있어야 한다. >이 사항들을 모두 실현하려면 간략하지만 임팩트 있는 디자인 > 회사가 전달하고자 하는 이야기 및 사상이 무엇인지 파악해야만 적절한 스토리텔링이 부여된다. (3) 로고종류 1) 시그니처 로고 : 심볼과 텍스트를 적절히 결합한 로고의 형태를 말한다. - Corporate Identity : 기업이나 단체가 가지고 있는 이미지를 시각화한 디자인을 말한다. 삼성, 엘지, 현대의 로고 등이 있다. - Business intelligence..

※ outline stroke (상단메뉴 - 오브젝트 - 패스) - 선을 면으로 확장시켜주는 기능이다. 1. polygon art - 입체의 가장 작은 단위인 폴리곤이라는 면으로 이미지를 유사 3D 형태 표현해주는 작업 방식 말한다. 1) 3각형 : 섬세한 느낌의 결과물 / 4각형 : 투박한 느낌의 결과물 2) 조각의 양 - 조각의 양이 적을 때 : 비현실적인 분위기 - 조각의 양이 많을 때 : 정교하고 실사와 가까운 표현으로 사용할 수 있다. 3) 통일성 있어야 짜임새 있게 끝난다. 삼각형 조각은 삼각형 조각으로 사각형 조각은 사각형 조각으로 마무리 4) 제작이 끝난 폴리곤 조각은 잠궈가며 관리하는 것이 다음작업에 편리하다. → pen tool은 del, 애드앵커 포인트툴 자동으로 호환하여 다음 조각 ..

1. mesh tool(U) - 포인트 이동 (tool + shift+ 이동) : 이동거리에 맞춰 핸들길이 조절되어야만 자연스러운 연출 나옴 - 선택물체 잠금 (ctrl +2) - 잠금 해제 (ctrl + alt + 2) - 클리핑 마스크 (ctrl + 7) ※ transform panel(shift+F8) - 선택 물체를 세부적인 변형할 수 있도록 만들어주는 패널 ※ offset path (상단메뉴 - object- path) - 가로 세로 폭이 다른 물체에 모두 같은 여백두어 사이즈 늘리거나 줄여줄 수 있는 기능이다. ※블렌딩 모드 표현은 음영값 조절하여 합성 표현의 큰 틀을 조정해나갈 수 있다. 2. 아이콘 (1) 제작 시 유의할 점 1) 아이콘 디자인 스타일 통일 : 면과 면/ 선과 선/ 색상 단..

1. mesh tool (U) - 한 오브젝트에게 두 개 이상의 포인트를 찍어 채색 할 수 있는 툴 - 메쉬 선 모양 바꿔주면 그 모양대로 색상이 흘러 그라디언트보다 자유롭고 정교한 색상 표현 가능함 - 메쉬 포인트 생성 전 표현할 물체와 관련 된 색상 미리 대입해두는 것이 좋다. 2. lasso tool (Q) - 마우스 클릭 드래그하여 포인트를 중복선택할 수 있는 툴이다. 3. create gradient mesh ( 상단메뉴 - object ) - 선택된 오브젝트에 수치 맞춰 균일한 간격으로 메쉬 생성해줄 수 있는 기능 - 이미 메쉬가 입력되었던 오브젝트에게는 기능 활성화 되지 않는다. - 처음부터 복잡한 형태의 물체에 메쉬 생성하면 메쉬 선이 불규칙하기 때문에 색상을 자연스럽게 대입하기 힘들 때가..

※ 3d 이펙트 전 표현할 물체가 전부 담겨있는 구도를 타겟으로 평면도 제작하면 된다. ※ 복수의 개체가 마치 한 장과 같이 작업되었음 할 때에는 패스파인더로 합치거나 그룹으로 묶어주면 된다. ※ effect 적용된 물체 사이즈 수정하는 방법 1) expand appearance(상단메뉴-object) - 도형이 수치로부터 벗어나기 때문에 사이즈 조절에도 비율 변하지 않음. 그러나 이펙트만의 수정은 절대 할 수 없음. 2) scale strokes&effect (ctrl+k 환경설정) - 체크 시 조절되는 사이즈에 맞춰 수치가 알맞게 변환 됨 ※ offset path (상단메뉴 - object - path ) - 선택된 물체에게 모두 같은 여백 두고 줄이거나 늘려줄 수 있는 기능이다.

※ blob brush 셋팅하여 노이즈 질감 표현 가능 1. magic wand tool (Y) - 선택된 속성과 동일한 것들을 모두 선택할 수 있는 툴이다. (1) image trace - 비트맵 형식의 이미지를 설정사항에 맞춰서 벡터 그래픽화 시켜줄 수 있는 기능이다. - 픽셀을 벡터로 전환해주기 때문에 이미지의 품질을 디자인에 깨끗하게 활용할 수 있다. - 블랙 & 화이트, 스케치 아트, 실루엣 : 이미지를 흑백으로 변환하여 도형과 같이 디자인의 일부로 활용할 때 이용 - 이미지 트레이스 후 도형과 같이 분리시켜 사용할 예정이라면 expand - expand 후,그룹 자동으로 걸려있어 풀어준 뒤 사용해야 한다. 2. live paint (1) live paint - 빠른 채색 도구 툴 - 면처럼 인..

1. 3D effect - blend step : 곡면 단계 표현 (수치가 올라갈 수록 그림자 표현이 자연스러움, 플랫 디자인 활용 시 낮은수치 1 권장) - 3d effect와 같은 물체는 expand 후 그룹과 클리핑마스크 걸려있어 이 설정값을 풀어줘야 개별적 도형활용 가능 - 이전 사용 이펙트 추가 (ctrl+shift+E) - 이전 사용 이펙트 창 띄우기 (ctrl+shift+alt+E) 2. clipping mask(ctrl+7) - 가장 상위에 있는 프레임 도형과 교차한 하위 면적만 드러낼 수 있는 기능이다. - 수많은 물체를 원하는 부위만 드러내기에 적합한 작업 기능이다. - 조건 및 주의사항 - 프레임으로 활용할 물체는 모든 물체 중 가장 상단에 있어야 한다. - 프레임 도형은 펜툴 도형,..

1. blend tool (W) : 두 개 이상 오브젝트를 연결지어 중간단계 조절하며 입체 연출 및 오브젝트 분배 작업 가능 - 물체를 원하는 순서대로 클릭하여 연결지어줄 수 있는 역할 - 툴 옵션 진입하여 중간단계 수정할 수 있다. (1) replace spine : 상단메뉴 - 오브젝트 - blend - 블렌드 연결된 물체를 또 다른 패스에게 옮겨줄 수 있는 기능이다. - 복잡한 획에 블렌드 연결 연출하고 싶을 때 가장 크게 사용할 수 있다. - 조건 - 이미 연결된 블렌드 도형 준비 되어있어야 함 - 블렌드를 옮겨줄 패스형태의 오브젝트 즉 경로는 투명이 아니어도 괜찮다. - 준비된 오브젝트 포인트마다 연결되어 달라붙는다. 연결 끊겼을 때에는 애드앵커포인트 툴(+)로 포인트 추가 생성 - 패스 하나 ..

1. brush tool (B) - 스트로크의 성질 가지고 있으며 클릭 드래그하여 선과 같이 길쭉하게 뽑아 사용할 수 있는 브러쉬이다. - 스트로크와 벡터의 성질을 갖고있기 때문에 도형처럼 변형하거나, 인쇄하기 적합한 상태 가지고 있다. - 아주 크게, 캘리그라피 장식 글자, 핸드 드로잉 스타일 아이콘, 이모티콘 제작 시 가장 크게 활용한다. 2. brush panel (F5) - 일러스트가 제공하는 브러쉬의 모양을 꺼내 사용하거나, 작업자의 스타일대로 브러쉬를 만들어 사용할 수도 있다. - 획의 색상, 사이즈, 형태 변경 가능하다. - 브러쉬 패널의 모양은 패스에 무조건 접목시킬 수 있다. (도형, 펜툴 패스 ) - 도형 준비 후 브러쉬 패널에 밀어넣어 등록할 수 있다. 단, 그라디언트 접목된 도형은 ..

개인작업 및 프로그래머스 문제풀기 programmers.co.kr/learn/courses/3 Hello, JavaScript: 자바스크립트 입문 ## Hello, JavaScript! 관련 키워드: JavaScriptHTMLCSS웹프론트엔드입문문법 * 자바스크립트와 처음 만나는 분들을 위한 강의! * 부담가질 것 없이, 하루 최소 20분씩만 짬내도 배울 수 있는 강의!(약 7일 소 programmers.co.kr

1. return console.clear(); function plus(a, b) { var num = a + b; return num; } var minus = function(a, b) { var num = a - b; return num; }; function multiply(a, b) { var num = a * b; return num; } var divide = function(a, b) { var num = a / b; return num; }; var num1 = plus(10, 20); var num2 = minus(10, 20); var num3 = multiply(10, 20); var num4 = divide(10, 20); console.log("num1 : " + num1); ..