본문 바로가기

Widely Design 바로가기

💚 UIUX 웹퍼블리셔 과정(6개월)175

2021-09-12 (153일차) 웹사이트 리디자인 자료 조사 - 웹사이트 리디자인 막상 만드려고 보니 너무 어렵다고 느껴졌다. 제대로 하려고 하니까 어떻게 만들어야할지 감이 잘 안 온다. 대충 틀이라도 잡아보니까 기존에 있던 식상하고 흔한 틀이 잡혀서 고민이 많아졌다. 유튜브에서 웹사이트 트렌드 현황과 리디자인하는 유튜버 (마디아님) 영상을 많이 보고 보는 눈을 키워야겠다! 2021. 9. 12.

2021-09-11 (152일차) 웹사이트 리디자인 주제 선정 - 웹사이트 리디자인 주제 선정 컨셉 띵킹 피그마 자료 모으기 마디아 영상 보기 컨셉은 귀엽고 색상을 많이 쓰면서 만들고 싶어서 '키자니아'를 선택했다. 기존 로고가 어린이와 안 맞게 약간 올드한 느낌이 들어서 로고도 리디자인을 해야할 것 같다. 2021. 9. 12.

2021-09-10 (151일차)fullpage에 circleProgress 적용하는 방법 유용한 소스코드 모음 29강~30강 (여쭤본 당사자is ME ) ㄴ fullpage에 circleProgress 적용 - circleProgress 라이브러리 사용하는 방법 See the Pen jquery-circle-progress by minicoding (@minicoding) on CodePen. - fullpage에 circleProgress 적용하는 방법 section-3이 열리면 circleProgress가 실행되게 하는 방법 See the Pen by minicoding (@minicoding) on CodePen. 2021. 9. 12.

2021-09-09 (150일차) 2021-09-07 (148일차) 포트폴리오 코딩 작업 중 (디테일 마무리) - 포트폴리오 코딩 작업 중 (디테일 마무리) 오류현상 잡아내고 깃허브 업로드 완료 sns 로고 추가 circle태그 애니메이션 (프로그레스 바) 조사하기 내일 선생님께 여쭤보기! 2021. 9. 12.

2021-09-08 (149일차) fullpage 라이브러리 총정리 fullpage (18강) 라이브러리 총정리 - 라이브러리 총정리 (최종이라고 하심)(아마도!) See the Pen by jhs (@jangka44) on CodePen. 2021. 9. 10.

2021-09-07 (148일차) 포트폴리오 코딩 작업 중 (artwork + ending + contact) 포트폴리오 코딩 작업 중 (artwork + ending + contact) - artwork artwork 스와이퍼 슬라이드 같은 경우 어제 portfolio부분에서 해본 후 완벽극복해버린 바람에! 쉽게 해냈다! - ending credit 이 부분은 디자인할 때 내가 코딩으로 구현을 할 수 있을지 알아보기 위해 사전에 검색을 해봤었다. marquee라는 태그를 이용해 css가 없이 구현이 가능한 걸 보고 바로 넣기로 결정했었다. 그리고 대충 틀을 잡아 만들어서 codepen에 라이브러리를 저장해두었다! 그리고 오늘 만들어놓은 라이브러리를 가져오고 글자크기, 자간조정을 하는 등 디자인을 해주었다. 영화관 느낌을 내려고 어두운 배경에서 흰색 자막이 올라가는 듯한 느낌이 났다. 원하는 느낌이었다! 하지만 .. 2021. 9. 10.

2021-09-06 (147일차) 포트폴리오 작업 중 intro + portfolio, 탭메뉴에 따라 화면이 전체적으로 바뀌는 효과 포트폴리오 작업 중 intro + portfolio 유용한 소스코드 27강 (탭메뉴에 따라 화면이 전체적으로 바뀌는 효과) 포트폴리오 코딩 작업 중 (intro + portfolio) intro에는 영상이 들어간다. codepen으로 임시작업 중이라 아직 영상으론 넣지 못하고 사진으로 대체했다. intro위에 부분에 좋아하는 명언을 띄웠다. 피그마 프레임 안에서 저장해서 프레임 아래에 깔린 백그라운드랑 같이 추출이 돼서 프레임에서 꺼내서 명언 개체만 따로 추출했다. 몰랐던 점을 알아내서 기쁘다! portfolio 부분 코딩을 시작했다. 스와이퍼 슬라이드에 대해 배울 때 잘 못해내고 재미도 못 느껴서 두려움이 많았다. 하지만 내가 하고 싶은 작업을 해내다 보니 하나하나 공책에 계산해가며 만들어보니 금방 뚝.. 2021. 9. 10.

2021-09-05 (146일차) 포트폴리오 작업 중 skill - 포트폴리오 코딩 작업 중 about me완성 skill 부분 시작 ㄴ svg 애니메이션 공부 ㄴ circle 태그에 대해 공부 ㄴ progress bar 애니메이션 알아보기 2021. 9. 10.

2021-09-04 (145일차) 포트폴리오 작업 중 about me 포트폴리오 코딩 작업 중 (about me) about me 부분의 영상부분이 들어간다. codepen으로 임시 작업 중이여서 background-image로 이미지를 일단 넣고 background-attach : fixed로 고정하여 스크롤해도 이미지는 고정되어 있는 효과를 삽입하고 싶었지만 fullpage라서 적용이 되지 않는 문제점이 있다. 친구와 카페에 가서 하나를 잡고 방법을 찾다가 선생님께 여쭤봐서 대답이 되는 링크를 받았는데 내 머리로는 도저히 적용 불가능이당.. 하나 붙잡고 시간 끌지 말고, 그냥 이미지로 넣고 작업을 이어가야겠당. 하하하 2021. 9. 5.

2021-09-03 (144일차) css 버튼을 이미지로 적용하는 방법 자바스크립트와 제이쿼리 기초 106강 (폼 버튼 만들기) 유용한 소스코드 모음 25강 ~ 26강 (텍스트 좌우 라인) - form 커스텀 방법 ※ 버튼은 이미지로 바꿀 수 없다. - 버튼을 이미지로 꾸는 방법 2021. 9. 5.

2021-09-02 (143일차) 순서대로 사진 보이게하기, 프로그레스 바+숫자 애니메이션 자바스크립트와 제이쿼리 기초 104강 ~ 105강 유용한 소스코드 모음 23강 ~ 24강 (팝업 만드는 방법) - 순서대로 사진이 나타나는 엘리먼트 효과 See the Pen by jhs (@jangka44) on CodePen. - 프로그레스 바 및 숫자 카운팅 애니메이션 See the Pen by jhs (@jangka44) on CodePen. 2021. 9. 5.

2021-09-01 (142일차) 일정한 시간간격으로 글씨가 교체되는 효과 유용한 소스코드 21강~22강 (switch effect) (글씨가 교체되는 효과) + (탭박스) - .each 같은 클래스를 각각 실행시켜준다. - node 가르키는 클래스가 여러 개일 때 순서대로 가르켜주는 변수 1단계 원리 (라이브러리 생성) - html, css 역할 li는 평소에 absolute (유령화) + opacity : 0 ㄴ> 전부 겹쳐지지만 li에 active가 들어가면 li가 relative로 변경 + opacity : 1 - script 역할 현재 활성화된 녀석을 함수로 지정한 후, active클래스 제거하기 현재 활성화된 녀석의 다음 태그를 함수로 지정한 후, active클래스 추가하기 setInterval 함수 안에 넣어 일정한 시간간격으로 작동하게 하기 length를 추가하여.. 2021. 9. 5.

이전 1 2 3 4 5 6 ··· 15 다음

티스토리툴바