전체 글 66

블로그를 다시 시작하게 된 이유

사이드 프로젝트를 시작하고, 내 프로젝트를 포트폴리오에 담는 과정에서 내가 했던 많은 고민과 생각들을 모두 담아낼 수 없다는 한계가 있었다.아쉬움에 사플 팀원들과 얘기를 나눴는데,한 팀원이 그걸 표현하기 위해 블로그를 꾸준히 적는다는 말을 들었다.그 말을 듣곤 차일피일 미루던 블로그를 다시 시작하겠다 마음 먹었다. 또 한가지 더 이유는 사이드 프로젝트를 진행할 수록 나의 부족한 점이 더 눈에 띄고, 좀 더 공부를 해가는 과정에서 오는 인사이트나 지식들을 정리하고 공유하고 싶은 마음이 들었다. 완벽하고 깔끔한 정리본을 내놓고 싶어서 블로그를 계속 미뤘었는데, 늦었지만서도 지금이라도 꾸준히 적는걸 취지로 블로그 포스팅을 다시 시작해야겠다.

마지막 과정

4개월간 진행한 캠프 회고 진행 → 자신의 강점과 단점 파악자신의 강점을 살릴 10년 커리어 미리 그려보기희망 기업 20곳 조사 1. 나의 강점과 단점 (지피티를 이용하였다) 🌟 강점꾸준한 자기계발 의지자격증 준비(컴퓨터그래픽기능사, 웹디자인기능사), 영어 공부(토익스피킹 AL 목표), 피그마 학습, 책 읽기까지 다양한 분야를 꾸준히 이어가셨어요.“해야 할 일”을 구체적으로 정리하고 실행하려는 모습에서 자기 주도성이 드러나요.체계적인 사고와 정리 능력사용자 인터뷰 질문지, Affinity Diagram, 리뷰 데이터 정리 요청 등을 보면, 분석을 "요약"이 아닌 "원문 중심·카운팅" 방식으로 정리하려는 뚜렷한 기준이 있더라고요.문제를 구조적으로 바라보고 근거를 남기려는 습관이 강점이에요.디자인/서비..

오즈코딩스쿨 2025.08.27

[디자인부트캠프] DAY51. 웹 구조 및 서비스 데이터 추척_ 예제 분석과 활용

마지막 강의라니 ! 블로그 업로드도 빠짐없이 다 하게 될 줄이야! - css에서 vh, vw vh (viewport height)→ 브라우저의 높이(viewport height) 기준→ 1vh = 브라우저 높이의 1%→ 예: height: 100vh;는 브라우저 창 높이의 100%vw (viewport width)→ 브라우저의 너비(viewport width) 기준→ 1vw = 브라우저 너비의 1%→ 예: width: 50vw;는 브라우저 창 너비의 50% - Box Model 모든 HTML요소는 웹 페이지에서 일정공간을 차지하게 된다. 그리고 이러한 공간을 CSS에서는 박스 모델로 정의 한다. HTML 요소는 사각형 박스로 렌더링됨박스 모델은 다음 네 영역으로 구성됨:Content: 콘텐츠(텍스트..

[디자인부트캠프] DAY50. 웹 구조 및 서비스 데이터 추척_디자이너를 위한 CSS_하

css1. ** _ 전체선택자 ! 보통 초기화목적의 속성값을 많이 넣는다. * { margin: 0; /* 모든 요소의 바깥 여백 제거*/ padding: 0; /*모든 요소의 안쪽 여백 제거*/ box-sizing: border-box; /* 요소의 width,height값에 padding, border 포함 (레이아웃 잡기 유용)*/} 2. css 속성값(day49와 다름)콘텐츠 정렬 & 정돈vertical-align인라인 요소나 테이블 셀의 수직 정렬 (middle, top, bottom)white-space줄바꿈 및 공백 처리 방식 (nowrap, pre, normal)text-overflow텍스트가 넘칠 때 처리 (ellipsis 등)overflow-x / overflow-yX축 / Y..

[디자인부트캠프] DAY47. 웹 구조 및 서비스 데이터 추척_디자이너를 위한 html_상

HTMLHyper Text Markup Language HTML은 디자인이 아닌 구조 담당 웹 페이지의 구조를 만드는 언어 > 텍스트, 이미지, 버튼, 링크 등 다양한 요소를 페이지에 표시하고 구성하는 데 사용된다. 1. HTML 기본 문서 구조 안녕하세요! 이것은 기본 HTML 문서입니다. HTML5 문서임을 선언전체 HTML 문서의 루트 요소문서 정보 (제목, 문자 인코딩, CSS, JS 등)한글 등 문자 인코딩 설정브라우저 탭에 표시될 제목실제 페이지에 보이는 콘텐츠 영역 2. HTML 태그 ~Heading제목이나 부제목 표시. 숫자가 작을수록 글씨가 큼.Paragraph하나의 문단을 표시할 때 사용.Horizontal Rule가로선(구분선)을 긋는 태그. 종료 태그 없음Br..

[디자인부트캠프] DAY49. 웹 구조 및 서비스 데이터 추척_디자이너를 위한 CSS_상

CSS Cascading Style Sheets->스타일을 지정하는 언어 1.h1 { color:blue; } -> h1 선택자 color 속성명blue 속성값 2. css적용방법 1. 인라인 스타일 inline Style Sheet-> html 태그 안에 작성 2. 내부 스타일 Internal Style Sheethtml 안에 작성 3. 외부 스타일 External Style Sheet css 안에 작성 3.css 속성 1) 박스 모델 margin요소 바깥 여백padding요소 안쪽 여백border테두리 스타일width, height너비와 높이 설정box-sizing박스 크기 계산 방식 (content-box, border-box) 2) 텍스트/폰트color글자 색상font-size글..

[디자인부트캠프] DAY48. 웹 구조 및 서비스 데이터 추척_디자이너를 위한 html_하

HTML 1. 목록 태그 (List Tags)순서 없는 목록 (unordered list)동그라미로 표시순서 있는 목록 (ordered list)숫자 또는 알파벳으로 표시리스트 항목 (list item) 또는 안에서 사용정의 목록 (description list)용어 정의용정의 목록 제목 (definition term)용어 부분정의 목록 설명 (definition description)설명 부분 2. 시맨틱 태그 (Semantic Tags)의미를 가지는 구조 태그로, 코드의 가독성 향상 및 접근성 개선에 도움을 줍니다.머리말페이지 또는 섹션의 제목, 로고, 네비게이션내비게이션 영역메뉴, 링크 모음주요 콘텐츠페이지의 핵심 내용구획주제별 콘텐츠 구분독립적인 콘텐츠뉴스, 블로그 글 등부가 콘텐츠광고, 관련..

[디자인부트캠프] DAY46. 웹 구조 및 서비스 데이터 추척_ 디자이너를 위한 개발 지식_1

기능사 준비하던 내용이 나올 줄 몰랐다. 사실 자격증도 필요없고,, 코딩 필요없다 이런 말을 너무 많이 들어서 괜한 공부한 것같고 쫌 시무룩했는데...교육과정에서라도 쫌 써먹겠구나 싶었다. PART1. 오늘의 내용HTML/ CSS/ JS HTML은 웹페이지의 구조, 뼈대CSS는 디자인JS는 기능과 동작 이다. 요즘은 거의 VSCODE로 코딩을 한다. VSCODE 굉장히 많은 확장프로그램을 추천해주셨다. 이 중 내가 써본건 라이브서버뿐이다. 이마저도 실제 시험 환경에서는 쓰지 못한다. HTML 1. html5문서임을 선언 처음에 HTML 파일에 선언하기 위해선 [ !+탭] 을 입력한다. 보통내가 입력후에 한 작업은, eg를 ko로 바꿔주고, 타이틀명을 적어줬다. 2. , , 웹문서의 기본 구..