0730 화 uiux 83일차

0730 화 uiux 83일차

 

 

웹 국기, 자바스크립트 ( https://codepen.io/hjyee/full/PogMVOP )

2024-07, HTML, CSS, JS(Jquery) 복습 ( https://codepen.io/hjyee/full/JjQGOoa )

시각디자인 리서치 분석  pdf 3장까지만 1. 시각디자인 관련 트렌드 조사, 분석 1개 지난 번 제출했던 것 제외 2장, 조사한 트렌드 바탕으로  - pc, app디자인 후 제출(각각 하나씩 총 2개) - 피그마로 제작 후 pdf로 변환 후 제출, ppt로 변환 후 최종 pdf로 제출 화면 크기로 딱 하나만. 배너로 채우지 않기 1. 주제와 관련된 시각디자인 트렌드를 조사하고 분석하여 보고서를 작성하시오. 내용: 최신 시각디자인 트렌드를 조사하고, 그 중 두 가지 트렌드를 선택하여 상세하게 분석하십시오. 각각의 트렌드가 어떤 디자인 요소를 사용하는지, 그리고 이러한 요소들이 어떻게 활용되는지 설명하십시오. 또한, 선택한 트렌드들이 사용자 경험(UX)에 미치는 영향을 분석하고, 각각의 트렌드가 어떤 사용자층을 타겟으로 하는지 설명하십시오.   2. 선택한 시각디자인 트렌드를 활용하여 디자인 시안을 작성하시오. 내용: 조사한 트렌드를 기반으로 하여, 각 트렌드를 활용한 두 가지 디자인 시안을 만드십시오. 디자인 시안은 웹페이지, 모바일 앱 인터페이스, 또는 광고 배너 등 중 하나를 선택하여 작업하십시오. 시안에는 색상, 레이아웃, 타이포그래피, 이미지 등 다양한 디자인 요소를 포함하여 구체적으로 표현하십시오.

문제 - 반응형 모바일메뉴1 구현, 작업 5, 닫기 버튼, pc 화면에서 사이드바 숨기기 ( https://codepen.io/YoungHeom/pen/VwJPbXe )

 

 

.mobile-side-bar__content {   transform:translateX(100%);   transition: transform 0.3s; } .mobile-side-bar.active .mobile-side-bar__content {   transform:translateX(0); } 반응형 모바일메뉴1 구현, 작업 4, 클릭시 사이드바 노출시 콘텐트가 화면 우측에서 나옴 transform:translateX(0); - 이유는 모르겠지만 오른쪽에서 튀어나오게 해줌

(  )