디자인선행작업 1)키워드 도출(만다라트로 이용) 2)컬러 키워드 ->산정 메인/서브 컬러 만들기 3)레퍼런스 찾기(behance pinterest 드리블 노트폴리오 사이트를 활용해서) 핀터레스트가 드리블이랑 비핸스랑 다 연결되어 있음 4)디자인가이드(개발자에게 컨벤션이랑 같다)
개발자의 컨벤션 = 디자인가이드
예시1
저는 미팅때 주요 키워드를 3가지 정도 뽑아와서 로고 디자인도 프로젝트에 포함되어있으면 브랜딩 작업 우선하고요 핀터레스트에서 관련된 키워드 전부다 검색해서 이미지 자료들을 스케치 파일로 불러옵니다 그중에서 이미지 맵처럼 만들어서 브랜드 로고 먼저 만들고 색상은 마지막에 선택하는 편이며, 사이트 디자인은 로고 결정된 후에 작업 시작합니당
예시2 회사BI가 정해진 경우 저는 현재는 회사사이트 리뉴얼디자인하는게 거의 전부라서 말씀하신대로 로고랑 대표이미지색상이 정해져있어서 그거에 맞게 웹사이트 많이 봐요 요즘 웹사이트어떻게 구성되어있나 그래서 그거 짜집기해서 메인만들고 서브페이지 작업합니다
let $btn = document.querySelector(".btn"); let $article = document.querySelector(".article");
$btn.addEventListener("click", function(){
$article.classList.toggle("--act");
});
구글에서
자바스크립트 선택자 자바스크립트 변수 자바스크립트 이벤트 부여 자바스크립트 클래스 제어
라고 검색하면 많이 나옴
함수로 만들어서 재사용할수 있다^^ 토글되는 것들을 여러개 만들데 다음의 함수를 이용한다 fuction setClickEvent(btnName, articleName){ let $btn = document.querySelector(btnName); let $article = document.querySelector(articleName);