info 작성 예시 다운로드info 탬플릿 다운로드 두개의 파일들이 권한이 없네요??? 

텍스트 스타일 베리어블 등록이 첨부이미지 처럼 오류?가 나는데, 제가 텍스트 스타일 등록 내용을 볼드님이랑 다르게 하고 베리어블은 강의 내용대로 따라해서 그런걸까요?

안녕하세요, 볼드님 강의 업데이트 해주셔서 정말 감사합니다. 기존 피그마 버전을 사용하고 있는데, 볼드님 강의를 듣는 도 중 AI기능이 쓰는 방식을 배울 수 있었는데요. Ai 기능을 쓰고 싶으면 업데이트를 해야할 것 같아서요 .. 찾아보니 맨 하단에 토글을 켜야 쓸 수 있는 것 같습니다. ㅜㅜ아마 못 쓰는 것이겠죠 ㅜㅜ 방법이 있을지 궁금합니다.

서브도메인 이름은 아무거나 해도되나요? 

수강전 문의 했을때강사님께서 프로그램은 비주얼스튜디오코드 무료 다운받아 쓰라고만 하셔서 다운 받아서 겨우겨우 따라하고 있는데요.1. HTML5 핵심 태그 사용법(문단, 텍스트 서식)강의를 들으려고 하니 Brackets 이라는 프로그램으로 강의를 하십니다.어찌어찌 Brackets 이라는 프로그램을 찾아서 깔긴 했지만시작을 또 어떻게 해야할지를 모르겠네요.비주얼스튜디오코드에서는 했던 새파일 만들기? html, css 그것부터Brackets 이라는 프로그램은 만들려고 하니 이미 만들어져 있다고 하고만들어져 있는것을 지우려하니 에러가 발생했다하네요.프로그램이 맞게 깔렸는지도 모르겠지만어떻게 시작을 해야할까요?분명 초보라 말씀 드렸는데초보를 위한 강의는 아니신듯 해서 난감합니다.

안녕하세요. 강의를 모두 듣고 열심히 연습중인데요,혹시 미드저니를 사용할때 웹브라우저상이 아닌 디스코드를 이용해야 하는건 아닌가 해서요미드저니에서 결재를 하려고 하면 카드가 거부되어서 사입을 할수가 없어서요카드 여러개로 바꿔 해봤는데도 카드거부가 나와서요혹 강의 내용처럼 브라우저상이 아니 디스코드로 해서 뭘 해야 하는건지 해서요 

수업 너무 유익하게 잘 듣고 있습니다! Saas에 들어가는 다양한 컴포넌트 만들어볼 수 있어서 정말 유익해요. Saas에서 대시보드나 차트 같은 데이터 시각화 부분도 많이 필요한데, 혹시 강의 주제로 다뤄주실 수 있을지 궁금해서 질문 남깁니다 ! 늘 좋은 강의 감사합니다!

수업노트를 확인할수 있는 방법이 있을까요?

배리어블 순서를 바꿀 때 드래그 드랍해도 안 바뀌는건 왜 그런건가요..? ㅠㅠ배리어블 복사하면 순서가 뒤엉켜있는 경우가 너무 많은데 그럴때마다 순서를 바꾸려고 드래그 드랍을 하면 몇개는 바뀌다가 안바뀝니다..배리어블이 너무 많아서 그런건가요? 이럴 때는 어떻게 해야할까요?

강사님!SF Symbols 다운로드 받았는데 윈도우라 파일이 호환이 안되는 거 같습니다. 윈도우에서 어떻게 활용하는지 알려주실 수 있으신가요?  

function setCanvasImages() { let imgElem; for(let i = 0; i < sceneInfo.values.videoImageCount; i++) { imgElem = new Image(); imgElem.src = `./images/picdiet 1/${1 + i}.jpg`; sceneInfo[0].objs.videoImages.push(imgElem); } // /home/ibmuser01/src/images/picdiet 1/1.jpg } setCanvasImages(); function setLayout() { // 각 스크롤 섹션의 높이 세팅 for (let i = 0; i < sceneInfo.length; i++) { if (sceneInfo[i].type === 'sticky') { sceneInfo[i].scrollHeight = sceneInfo[i].heightNum * window.innerHeight; } else if (sceneInfo[i].type === 'normal') { sceneInfo[i].scrollHeight = sceneInfo[i].objs.content.offsetHeight + window.innerHeight * 0.5; } sceneInfo[i].objs.container.style.height = `${sceneInfo[i].scrollHeight}px`; } yOffset = window.pageYOffset; let totalScrollHeight = 0; for (let i = 0; i < sceneInfo.length; i++) { totalScrollHeight += sceneInfo[i].scrollHeight; if (totalScrollHeight >= yOffset) { currentScene = i; break; } } document.body.setAttribute('id', `show-scene-${currentScene}`); } function calcValues(values, currentYOffset) { let rv; // 현재 씬(스크롤섹션)에서 스크롤된 범위를 비율로 구하기 const scrollHeight = sceneInfo[currentScene].scrollHeight; const scrollRatio = currentYOffset / scrollHeight; if (values.length === 3) { // start ~ end 사이에 애니메이션 실행 const partScrollStart = values[2].start * scrollHeight; const partScrollEnd = values[2].end * scrollHeight; const partScrollHeight = partScrollEnd - partScrollStart; if (currentYOffset >= partScrollStart && currentYOffset <= partScrollEnd) { rv = (currentYOffset - partScrollStart) / partScrollHeight * (values[1] - values[0]) + values[0]; } else if (currentYOffset < partScrollStart) { rv = values[0]; } else if (currentYOffset > partScrollEnd) { rv = values[1]; } } else { rv = scrollRatio * (values[1] - values[0]) + values[0]; } return rv; } function playAnimation() { const objs = sceneInfo[currentScene].objs; const values = sceneInfo[currentScene].values; const currentYOffset = yOffset - prevScrollHeight; const scrollHeight = sceneInfo[currentScene].scrollHeight; const scrollRatio = currentYOffset / scrollHeight; switch (currentScene) { case 0: let sequence = Math.round(calcValues(values.imageSequence, currentYOffset)); objs.context.drawImage(objs.videoImages[sequence], 0, 0); if (scrollRatio <= 0.22) { // in objs.messageA.style.opacity = calcValues(values.messageA_opacity_in, currentYOffset); objs.messageA.style.transform = `translate3d(0, ${calcValues(values.messageA_translateY_in, currentYOffset)}%, 0)`; } else { // out objs.messageA.style.opacity = calcValues(values.messageA_opacity_out, currentYOffset); objs.messageA.style.transform = `translate3d(0, ${calcValues(values.messageA_translateY_out, currentYOffset)}%, 0)`; } if (scrollRatio <= 0.42) { // in objs.messageB.style.opacity = calcValues(values.messageB_opacity_in, currentYOffset); objs.messageB.style.transform = `translate3d(0, ${calcValues(values.messageB_translateY_in, currentYOffset)}%, 0)`; } else { // out objs.messageB.style.opacity = calcValues(values.messageB_opacity_out, currentYOffset); objs.messageB.style.transform = `translate3d(0, ${calcValues(values.messageB_translateY_out, currentYOffset)}%, 0)`; } if (scrollRatio <= 0.62) { // in objs.messageC.style.opacity = calcValues(values.messageC_opacity_in, currentYOffset); objs.messageC.style.transform = `translate3d(0, ${calcValues(values.messageC_translateY_in, currentYOffset)}%, 0)`; } else { // out objs.messageC.style.opacity = calcValues(values.messageC_opacity_out, currentYOffset); objs.messageC.style.transform = `translate3d(0, ${calcValues(values.messageC_translateY_out, currentYOffset)}%, 0)`; } if (scrollRatio <= 0.82) { // in objs.messageD.style.opacity = calcValues(values.messageD_opacity_in, currentYOffset); objs.messageD.style.transform = `translate3d(0, ${calcValues(values.messageD_translateY_in, currentYOffset)}%, 0)`; } else { // out objs.messageD.style.opacity = calcValues(values.messageD_opacity_out, currentYOffset); objs.messageD.style.transform = `translate3d(0, ${calcValues(values.messageD_translateY_out, currentYOffset)}%, 0)`; } break; case 2: // console.log('2 play'); if (scrollRatio <= 0.25) { // in objs.messageA.style.opacity = calcValues(values.messageA_opacity_in, currentYOffset); objs.messageA.style.transform = `translate3d(0, ${calcValues(values.messageA_translateY_in, currentYOffset)}%, 0)`; } else { // out objs.messageA.style.opacity = calcValues(values.messageA_opacity_out, currentYOffset); objs.messageA.style.transform = `translate3d(0, ${calcValues(values.messageA_translateY_out, currentYOffset)}%, 0)`; } if (scrollRatio <= 0.57) { // in objs.messageB.style.transform = `translate3d(0, ${calcValues(values.messageB_translateY_in, currentYOffset)}%, 0)`; objs.messageB.style.opacity = calcValues(values.messageB_opacity_in, currentYOffset); objs.pinB.style.transform = `scaleY(${calcValues(values.pinB_scaleY, currentYOffset)})`; } else { // out objs.messageB.style.transform = `translate3d(0, ${calcValues(values.messageB_translateY_out, currentYOffset)}%, 0)`; objs.messageB.style.opacity = calcValues(values.messageB_opacity_out, currentYOffset); objs.pinB.style.transform = `scaleY(${calcValues(values.pinB_scaleY, currentYOffset)})`; } if (scrollRatio <= 0.83) { // in objs.messageC.style.transform = `translate3d(0, ${calcValues(values.messageC_translateY_in, currentYOffset)}%, 0)`; objs.messageC.style.opacity = calcValues(values.messageC_opacity_in, currentYOffset); objs.pinC.style.transform = `scaleY(${calcValues(values.pinC_scaleY, currentYOffset)})`; } else { // out objs.messageC.style.transform = `translate3d(0, ${calcValues(values.messageC_translateY_out, currentYOffset)}%, 0)`; objs.messageC.style.opacity = calcValues(values.messageC_opacity_out, currentYOffset); objs.pinC.style.transform = `scaleY(${calcValues(values.pinC_scaleY, currentYOffset)})`; } break; case 3: // console.log('3 play'); break; } } function scrollLoop() { enterNewScene = false; prevScrollHeight = 0; for (let i = 0; i < currentScene; i++) { prevScrollHeight += sceneInfo[i].scrollHeight; } if (yOffset > prevScrollHeight + sceneInfo[currentScene].scrollHeight){ enterNewScene = true; currentScene++; document.body.setAttribute('id', `show-scene-${currentScene}`); } if(yOffset < prevScrollHeight){ enterNewScene = true; if(currentScene === 0) return; currentScene--; document.body.setAttribute('id', `show-scene-${currentScene}`); } if(enterNewScene) return; playAnimation(); } window.addEventListener('scroll', () => { yOffset = window.pageYOffset; scrollLoop(); }); window.addEventListener('load', setLayout); window.addEventListener('resize', setLayout); })(); main.js:181 Uncaught TypeError: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The provided value is not of type '(CSSImageValue or HTMLCanvasElement or HTMLImageElement or HTMLVideoElement or ImageBitmap or OffscreenCanvas or SVGImageElement or VideoFrame)'. at playAnimation (main.js:181:30) at scrollLoop (main.js:292:9) at main.js:297:9이러한 에러가 나요.이미지 파일은 여기에 저장되어있슴돠.

자바강의 신청하려고하는데 이전사례처럼  하나짜리 통으로 풀버전으로 편집되서 출시될지 궁금해요

강의처럼 NavBar 인스턴스 컴포넌트에서 Selected 불린 프로퍼티를 끄고 켬에 따라 컬러의 변경을 주고싶은데 아이콘 인스턴스 스왑한 아이콘들은 컬러가 안바뀝니다ㅠ디자인 패널에서 NavBarItems-1은 셀렉트에 따라 바뀌는데 2번같이 아이콘을 Person 아이콘으로 스왑한 아이콘에 대해선 셀렉트 상태에도 컬러가 변하지 않는데요, 원래 이런건가요?

강의처럼 NavBar 인스턴스 컴포넌트에서 Selected 불린 프로퍼티를 끄고 켬에 따라 컬러의 변경을 주고싶은데 아이콘 인스턴스 스왑한 아이콘들은 컬러가 안바뀝니다ㅠ디자인 패널에서 NavBarItems-1은 셀렉트에 따라 바뀌는데 2번같이 아이콘을 Person 아이콘으로 스왑한 아이콘에 대해선 셀렉트 상태에도 컬러가 변하지 않는데요, 원래 이런건가요? 

안녕하세요 볼드님 강의 너무 잘 듣고 있습니다. 다름이아니라 아이콘을 변경하려고 할 때 색깔이 변경이 안 되는 경우, 아이콘 굵기가 다르게 나올 때가 있는데 어떤 부분이 문제인지 궁금합니다.

강의에서는 체크박스를 Boolean으로 처리하면 껏다가 켜는게 동시에 작동해서 따로 만드는걸 추천한다고 하셨는데, 지금 만들면서 테스트해보니까 복사한 인스턴스 각각에서 켰다가 끄는게 각자 동작하는데 혹시 동시에 동작하는게 어떤 상황에서 발생하는걸까요 ? 감사합니다 !!!

이전 강의 자료에서 설명해주셨던 것 같은데 까먹었습니다.. 왜 검색이 안되고 어디에서 검색이 안되었던거였죠..?

안녕하세요 볼드님!반응형 디자인 만들기 14:00쯤 레이어 눈 아이콘 우클릭을하면 로컬 배리어블이 나와야하는데 나오질 않습니다.... ㅠㅠTimeFrame은 눈모양 우클릭 배리어블 적용이 잘되는데imagePlaceholder 홀더에는 우클릭 적용이 안됩니다... 어디서 부터 잘못된건지 모르겠네요ㅜㅜ 도와주세요..

열심히 강의를 듣고 있습니다.근데 혹시 핵심 컴포넌트가 모두 완성된 파일을 공유받을수 없는지요?디자인시스템 파일은 공유해주셔서 다운받아서 참고하면서 보고 있는데요, 

학습을 하다가 이해가 안되시는 부분이 생겼다면 말씀해주세요! form 태그를 듣다가 생긴 의문인데요. 둘 다 사용자의 정보를 담는 건데form 태그와 input태그는 어떤 차이가 있는 건가요?... form태그가 url 받기 위한 박스(그 밖의 기능 즉, 사용자의 정보는 받지 않음, 송장같이 주소만 적음)이고input 태그는 사용자의 값을 직접 적는 칸(박스 안의 내용물)이라는 말인가요?