찐망고'S 퍼블리싱그리고디자인

안녕하세요 찐망고입니다.  웹디자인개발기능사 출제 유형과 관련하여 문제를 만들어왔는데요각 단원당 10~15문제 정도 준비했습니다.과연 문제가 얼마나 맞을진 모르겠지만 나름 샘플을 많이 주입하고 Ai가 뽑아준 문제니까 혹시 올해 필기시험보신분들 어떤 유형의 문제들이 나왔는지 댓글하나써주시면 또 다같이 공유해 보겠습니다. 1. 프로토타입 기초데이터 수집 및 스케치문제 1: 웹디자인 프로젝트에서 기초 데이터를 수집할 때 고려해야 할 사항으로 옳지 않은 것은?① 사용자 요구사항 조사② 벤치마킹할 대상 사이트 비교③ 경쟁사 분석④ 코드 최적화정답: ④해설: 코드 최적화는 성능 개선에 해당하며 기초 데이터 수집 단계와 직접 관련이 없습니다. 문제 2: 저작권이 있는 이미지를 상업적으로 사용하려면 어떤 라이선스를 반..

안녕하세요 찐망고 입니다.새롭게 개편된 웹디자인개발기능사 필기시험 출제 목차를 총정리해볼게요. 1. 프로토타입 기초데이터 수집 및 스케치 웹디자인 프로젝트를 시작하기 전, 기초 데이터를 수집하고 아이디어를 시각적으로 정리하는 과정입1-1. 기초 데이터 및 레퍼런스 수집 웹디자인 프로젝트를 수행하기 위해 필요한 정보와 레퍼런스를 조사하는 단계1) 기초데이터와 레퍼런스 데이터 수집기초데이터: 프로젝트 주제와 관련된 핵심 정보를 수집합니다.사용자 요구사항 조사시장조사 및 트렌드 분석경쟁사 분석기술적 요구사항(HTML, CSS, JS, 프레임워크 등)사용자 행동 데이터(사이트 방문 기록, 클릭 데이터 등)레퍼런스 데이터: 디자인 및 UI/UX 개선을 위한 자료를 조사합니다. 기존 웹사이트 사례 분석UI/UX 디..

안녕하세요 찐망고 입니다.상세페이지 작업 시, 각 온라인 마켓과 플랫폼별로 권장되는 이미지 크기가 다릅니다.이를 준수하면 상품이 깔끔하게 보이고, 최적의 품질을 유지할 수 있습니다.아래에 네이버 스마트스토어, 쿠팡, 11번가, 인스타그램, G마켓/옥션의 권장 이미지 크기를 정리하겠음 1. 네이버 스마트 스토어썸네일이미지: 640px × 640px , 최대 용량은 4MB, 파일 형식: JPG, PNG, GIF, BMP상세페이지이미지:가로: 860px 권장세로: 제한 없음 (단, 한 이미지의 세로 길이는 5,000px이하 권장)최대 용량: 20MB 2. 쿠팡썸네일이미지: 500px × 500px , 최대 용량은 2MB, 파일 형식: JPG, PNG상세페이지이미지:가로: 780px 권장세로: 한 이미지 최대 ..

안녕하세요, 찐망고입니다! 오늘은 새롭게 개편된 웹디자인 개발기능사 필기 출제기준을 기반으로, 필기시험의 핵심 내용을 한눈에 정리해보겠습니다. 주요 개념과 예상 문제 유형을 함께 살펴보면서, 시험 대비에 효과적으로 활용하길 바랍니다. 1. 프로토타입 기초 데이터 수집 및 스케치1-1. 기초 데이터 및 레퍼런스 수집웹디자인 프로젝트를 기획할 때 필요한 기초 데이터를 조사하고, 레퍼런스를 통해 디자인 방향성을 설정하는 과정입니다. 올바른 기초 데이터 수집 방법1. 사용자 설문조사 (User Research)웹사이트의 주요 타겟 사용자(연령, 성별, 관심사 등)를 분석하기 위한 방법인터뷰, 온라인 설문조사, 사용자 피드백 수집 등을 활용2. 경쟁사 웹사이트 분석 (Benchmarking)경쟁사 및 유사한 웹사..

안녕하세요, 찐망고입니다.올해부터 웹디자인기능사 자격증이 웹디자인 개발기능사로 개편되었습니다. 이에 따라 시험 방식과 과목 구성에도 변화가 생겼습니다. 기존보다 실무 중심의 평가 방식이 적용되었으며, 실기 시험 시간이 단축되었습니다.1. 시험 개요웹디자인 개발기능사 시험은 필기와 실기로 구성되며, 다음과 같은 방식으로 진행됩니다.필기시험: 객관식 60문항, 60분100점 만점 기준 60점 이상 합격CBT(Computer-Based Testing) 방식으로 진행실기시험: 3시간(기존 4시간에서 단축)실무 중심으로 진행되며, HTML, CSS, UX/UI 설계 등이 포함2. 필기시험 과목 변경기존의 디자인일반, 인터넷일반, 웹그래픽디자인에서 다음과 같이 변경되었습니다.웹디자인 구현웹페이지 제작주요 학습 항목..

안녕하세요 찐망고입니다.오늘도 클론 프로젝트를 하던 중 귀찮지만 막상 구현하면 보기 좋은 헤더 애니메이션작업과정을 공유해 드릴 건데요. 디테일은 귀찮아서 못하는 거지 막상 하면 만족도가 높..조만간 이런 공유들을 영상으로 보여드리고 싶은데.. (말만 몇 년째) 해당사이트 학생이 클론작업한 링크입니다 (3개월 유지예정) KRDS대한민국 정부 디자인 시스템 KRDS는 누구나 쉽게 정부 서비스를 경험할 수 있도록 가이드라인과 디자인 리소스 및 디자인 시스템 구축을 위한 모든 자료와 최신 정보를 제공한다.www.krds.go.kr  KRDS 클론 코딩  이 애니메이션의 핵심은 헤더를 줄이거나 헤더를 이동하는 게 아니고전체적인 콘텐츠를 위로 당긴다고 생각하면 되는데요처음 스크롤할 때 배너가 사라지고 헤더가 fix..

안녕하세요 찐망고입니다.CSS에서 min(), max(), clamp() 함수는 반응형 웹 디자인에서 매우 유용하게 사용할 수 있는데요. 이 함수들을 활용하면 보다 유연하고 직관적인 스타일링이 가능합니다. 특히 vw 단위를 많이 사용하는 요즘, CSS 속성 값을 동적으로 계산할 수 있다는 점에서 큰 장점이 있습니다.CSS비교함수관련 포스팅을 작년에 했었는데 해당사이트를 번역하고자 추가 포스팅을 해봅니다. 일단 이전글 링크 CSS min(), max(), clamp() 함수로 반응형 웹 디자인 완성하기안녕하세요 찐망고입니다. CSS에서 min() 함수와 max() 함수는 반응형 웹 디자인에서 매우 유용하게 사용할 수 있는데요.vw단위를 많이 쓰고 있는 이 시점에서 CSS속성 값을 동적으로 계산할 수 있게u..

안녕하세요 찐망고입니다.이번에 인크루트웍스 클론 프로젝트를 진행하는 학생이 만든 사이트를 보다가 발견한 버튼인데요.민산스 폰트를 포스팅하게 만든 그 사이트가 맞구요!마우스오버효과를 주면 버튼 색상이 부드럽게 바뀌는게 너무 예쁘더라구요!그래서 직접 HTML, CSS, JavaScript로 구현해 보았습니다  학생이 클론한 사이트 입니다. (3개월 후 삭제예정) AI로 검증하는 채용솔루션, 인크루트웍스인크루트웍스 채용솔루션으로 더 똑똑하고 빠르게 채용하세요! 기업채용에 최적화된 지원자관리,평가관리,면접관리,인재검증 등 다양한 솔루션을 제공합니다.phj00006.mycafe24.com 버튼 그라데이션 애니메이션은 영상으로 확인해주세요 (클론한 작업물) 마우스를 올리면 위에 그라데이션이 왼쪽에서 오른쪽으로 지나..

안녕하세요 찐망고입니다.더보기진짜 제가 CSS도 그렇구 HTML도 그렇구 피그마도 그렇고꽤 포스팅을 하는데왜 폰트만 검색되는거죠? 😭😭😭😭하지만 수업 내용을 공유하는게 목적인 블로그니까..  sticky 포스팅을 작년에 했는데요또해요.. 또맞아요 먼가 적용방법을 쉽게 설명하지 않은 것 같아 또..이건 이전에 쓴 포스팅입니다. CSS position: sticky 완벽 사용법 & 적용 가능한 사이트예시안녕하세요 찐망고입니다. 오늘은 position속성 중 sticky를 써볼 건데요..position관련 CSS를 포스팅 해놓은 게 없네요? 이런;; html에서 포지션역할은 여러 가지가 있습니다.잘 쓰면 너무 좋은 데 absoluuiweb.tistory.com  sticky는 본인 요소를 고정할때나 (..

기본적으로 사람과 사람 사이의 대화는 정말 중요하지만, 정작 그 대화법을 제대로 사용하는 사람은 많지 않은 것 같다. 나 역시 그중 하나다.강의가 아니라 계속 회사 생활을 했다면, 나도 입을 닫게 만드는 최악의 대화를 하는 팀장이 되지 않았을까? 하는 반성. 유퀴즈에 나온 박소장님은 사람의 뇌를 ‘주먹 쥔 손’에 비유했다.주먹을 쥔 상태에서는 집중력과 논리적 사고가 유지되며, 빠른 판단력과 공감, 문제 해결 능력이 생긴다. 반면, 주먹이 펴지면 감정이 폭발하면서 대화가 감정적으로 흐르고, 실패할 가능성이 높아진다고 했다. 나이가 들면서 외부 사람들과의 관계에서는 주먹진 손을 유지할 수 있는데, 가족에게는 그게 쉽지 않다. 가까운 사람일수록 더 어렵다. 이론적으로, 뇌는 가까운 사람을 ‘자기 자신’처럼 인..