본문 바로가기

전체 글228

얼굴 리터칭 - 4일차 얼굴 리터칭 우선 ctrl+k > performance > history states 200으로 변경 1) 다크서클 제거 ㄴ 도장툴 블랜딩모드 lighten, opacity 30% 으로 없애줌 ㄴ opacity 적절히 조정 ㄴ 전체병합복사 2) 주름 제거 ㄴ 스팟힐링브러쉬툴 ㄴ opacity 50으로 조정 3) 튀어나온 털과 눈핏줄 제거 ㄴ 스팟힐링브러쉬툴 ㄴ 힐링브러쉬툴 ㄴ 스펀지툴 (desaturate, vibrance) 4) 모공 제거 ㄴ 힐링브러쉬툴 ㄴ 패치툴 5) 헤어 리터칭 - 이미지 브러쉬 등록 edit > define brush preset - 브러쉬 편집 spacing 간격 0 설정 사이즈 헤어 두께에 맞춰 설정 opacity 20~50% 설정 각도를 조절하며 헤어 그리기 가장자리 자연스.. 2021. 5. 31.
휴가중인 다람쥐 - 3일차 휴가중인 다람쥐 1 호수사진 복제한 레이어를 흑백으로 전환한다. high pass 적당한 값을 준 후, 블랜딩모드 soft light를 준다. 전체병합복사한 레이어 만든 후, filter > noise > reduce noise 적당한 값을 준다. 2 펜툴로 딴 컵을 가져와 알맞은 위치에 놓아준다. 컵의 아랫부분을 펜툴로 영역을 지정하여 path를 만든다. 그 부분만 레이어 복제한다. 물에 빠진 효과를 주기 위하여 블랜딩모드 hard light를 주고, gaussian blur 적당한 값을 준다. 3 다람이들을 마법봉툴로 따서 select&mask 를 이용하여 꼼꼼히 작업해준다. 강가아트보드로 다람이들을 데려온다. 깃발과 모자도 가져와 알맞게 배치해준다. 오른쪽 다람이의 귀를 가린 모자부분을 layer .. 2021. 5. 30.
2021-05-30 (48일차) 복습, 기록 - 영상리뷰 자바스크립트의 역사와 현재 그리고 미래 영상 티스토리 리뷰 - 크몽 피그마 과제 마무리하기 - 포토웍스 3일차 정리 - 포토웍스 4일차 정리 2021. 5. 30.
자바스크립트의 역사와 현재 그리고 미래 자바스크립트 배우기전 꼭 봐야할 영상 | 자바스크립트의 역사와 현재 그리고 미래 (JavaScript, ECMAScript, JQuery, Babel, Node.js) - 드림코딩 by 엘리 유튜브 1993년 MOSIAC의 등장 ㄴ marc andreessen가 주도 1994년 marc andressen이 대학교를 졸업하자 마자 NETSCAPE 회사 설립 NETSCAPE : 정적인 웹사이트만 가능, 시장에서 80% 점유율 ↓ 동적인 웹사이트를 만들기 위하여 scripting 언어 추가 후보 1) java : 개발자들에게 어려워서 패스 후보 2) brendan eich라는 사람을 섭외해 기존 scheme를 변형 → 채택됨 ↓ 1994년 9월 mocha의 등장 (→ livescript로 이름변경) (java.. 2021. 5. 30.
2021-05-29 (47일차) 변수, 값, 변수이름, jquery제이쿼리, let, $().css(); 자바스크립트 5강~9강 JAVASCRIPT - 변수 : 값 저장소, 공간 ※ 변수에는 값이 무조건 1개 - 값 (데이터) : 문장, 숫자 - 변수 이미 존재하는 상태에서 하나를 더 만들기는 불가능 변수 이름은 영문 대소문자, 숫자, 언더바로 지정할 수 있음 한글도 넣을 수 있지만 자주 사용하지 않음 맨 앞에 숫자가 올 수 없음 띄어쓰기는 안됨 변수는 = 기호 좌측에서만 변수로 취급된다. - JQUERY 제이쿼리 기능 자바스크립트의 기본기능이 아닌, 편하게 이용하기 위한 추가 도구 codepen에서 실행하고 싶다면? ㄴ settings > JS > jquery 검색 후 클릭 > 링크 복사 > 붙여넣기 html에다가 : let divWidth = '100px'; let divHe.. 2021. 5. 30.
2021-05-28 (46일차) JAVASCRIPT 시작! - console.clear();, console.log("");, 문자와 숫자 출력 개념 자바스크립트 1강~4강 JAVASCRIPT - console.clear(); : 변수 선언, 생성, 초기화 console에는 출력할 내용이 나올 뿐만 아니라, 작업하는 과정까지 모두 나타내준다. 그래서 그 과정을 기록하지 않도록 하기 위해 처음에 적어주는 것이다. - console.log("출력할 내용"); console창에 내용을 띄우기 위해 사용한다. - 숫자 더하기 숫자 console.log(10 + 10); 결과 : 20 - 문장 더하기 문장 console.log("안" + "녕"); 결과 : 안녕 - 문장 더하기 숫자 console.log("안" + 10); 결과 : 안10 - 문장 더하기 숫자 더하기 숫자 console.log("안" + 10 + 20); 결과 : 안1020 - 문장 더하기 숫.. 2021. 5. 29.
2021-05-27 (45일차) flex-box, flex-shirink, flex-grow, min-height, 반응형 이미지, 배경이미지, 이미지 위에 글씨(텍스트), 미디어쿼리, @media, 반응형 상단바, position : fixed, overflow-x : auto 155강~160강 - 개구리 flex box 게임 - 디펜스 flex box 게임 - flex box playground 익히기 #문제. flex를 이용해서 성배 레이아웃 만들기 - flex-shirink flex-shirink : 0;을 넣어주면 화면이 아무리 작아져도 자신의 너비를 고정시키고 있음 기본값 : 1 - flex-grow flex-grow : 1; 을 주면 최대로 늘어난다 나란히 있는 태그들에 모두 flex-grow : 1;을 주면 일정한 비율로 나뉘어 늘어난다. 예외 ) 나란히 있는 태그들의 내용의 너비가 다르다면 (고유의 너비가 있는 상태) 남는 여백을 똑같이 나누어 갖는 것이기 때문에 일정한 비율로 나누어지지 않음 해결책 ) 태그들에게 width : 0;을 준 후 flex-grow :.. 2021. 5. 29.
2021-05-26 (44일차) CSS Diner 헷갈렸던 개념 정리하기 154강 - DSS Diner - A + B : 인접 형제 선택 ex) div + a => div를 직접 따르는 a (div동생의 a) - a ~ b : 앞의 태그를 따르는 모든 형제들 선택 ex) div ~ a => div의 뒤에 위치한 모든 a형제 ex) a ~ a => a의 뒤에 위치한 모든 a형제 - only-child : 유일한 하위 자식 선택 : 다른 요소의 내부에 있는 유일한 요소를 선택할 수 있음 span:only-child는 다른 요소의 유일한 자식인 span 요소를 선택합니다. ex) ul li:only-child => ul 안에 있는 유일한 li 선택 ex) section > p:only-child => section 안에 있는 유일한 태그 p 선택 ex) div:only-child .. 2021. 5. 28.
2021-05-25 (43일차) #'구현응용'시험. 상단바는 카카오뱅크, 나머지는 BMX로 구성 #'구현응용'시험. 상단바는 카카오뱅크(150강), 나머지는 BMX(148강)으로 구성해주세요. *정답란 본인 느낌 기준으로 완성도 : 100% 만점 *첨부 결과.zip - 소스코드/index.html - 소스코드/index.css - 캡쳐/큰화면상단.jpg - 캡쳐/큰화면하단.jpg - 캡쳐/작은화면상단.jpg - 캡쳐/작은화면하단.jpg 2021. 5. 26.
2021-05-24 (42일차)float grid - clear both, 시험대비문제 152강~153강 - 반응형 float 그리드에서 clear both 하는 이유 #문제. 상단바는 카카오뱅크(150강), 나머지는 BMX(148강)으로 구성해주세요. 2021. 5. 24.
2021-05-23 (41일차) 복습 - 모작과제 flex이용하여 다시 만들기 - flex개념영상 여러가지 찾아보기 - flex개념 외우기 2021. 5. 24.
2021-05-22 (40일차) 복습 151강 - 쌤이 추가로 올려주신 151강 영상 전체 보기 - 포토웍스 2일차 정리 끝내기 - 포토웍스 3일차 복습 2021. 5. 24.