콘텐츠기획자의 IT입문서

과제. 내가 관심갖고 사용하는 제품의 when, where, why, how, what은 무엇일까요, 그리고 해당 제품으로 달성하고자 하는 것이 무엇일까요? 나는 길치가 아님에도 지도 어플을 2개를 번갈아 사용하고 있다. 네이버 지도는 과거부터 몇 년간 쭉 사용해 오던 어플인데, 불편함을 느끼는 부분이 있어 최근 카카오맵을 추가로 깔았다. 같은 지도 어플이라도 어떤 것에 중점을 두느냐에 따라 제품의 디테일이 달라진다는 것을 느낄 수 있었다. 이번 과제에서는 아직까지 지우지 않고 사용하고 있는 '네이버 지도'를 분석해보려 한다! 네이버 지도는 어떤 지도 앱일까? WHEN 이 제품은 언제, 얼마나 사용하는가? 나는 크게 2가지 상황에서 네이버 지도 어플을 사용한다. 약속을 정하는 시점, 장소를 검색하기 위..

과제를 수행하기 앞서, 제품 개발 생애 주기란? 제품 개발 생애 주기란 제품이 만들어지기까지 거치는 단계를 하나의 주기로 나타낸 것이다. [제품 개발 생애 주기 5단계] 기회 포착 및 계획 ‣ 솔루션 디자인 ‣ 솔루션 구축 ‣ 솔루션 공유 ‣ 솔루션 평가 과제. PD Life Cycle에 맞춰서 내가 가장 좋아하는 프로덕트를 선정한 후, 각 단계별로 어떻게 일하고 있는지 분석해보세요. 패스오더 선정이유 과제를 수행하기 위해 어떤 제품을 선정할지부터 고민이 되었다. 블로그에 게시하는 글도 나의 포트폴리오의 일부인데 내가 관심있는 도메인의 제품을 고를까?하다가 작년부터 거의 매일 사용하고 있는 제품을 분석하는 것이 더 재밌을 것 같아 커피 주문 앱 서비스 '패스오더'를 선택했다. 1. 올바른 기회 찾기 및 ..

프로덕트 매니저란? 프로덕트 매니저를 한 줄로 정의하자면 고객의 문제를 파악하고 해결하기 위해 더 좋은 제품을 만드는 사람이다. 그렇다면 좀 더 현실적으로 프로덕트 매니저가 되려면 무엇을 알아야하고, 준비해야 할까? 채용 공고를 기반으로 프로덕트 매니저의 업무 범위와 자격요건을 알아보자. 나는 콘텐츠와 반려동물 도메인에 관심이 있으므로 관련된 3개의 기업을 선정했다 :) 세 곳 모두 PM 대신 Product Owner로 명시되어 있다. 프로덕트 매니저, 프로젝트 오너... JD를 읽어보면 매우 유사한 업무를 한다. 사실 미묘한 차이점이 있다고 하지만 실제로 현업에서도 혼용되어 사용되고 있는 편. PM : 제품의 방향성을 주도하는 역할 PO : 제품의 비전을 실현하기 위해 개발 순서를 구체화 시키는 역..

버튼을 클릭하면 input에 담긴 value가 바로 복사되는 버튼을 만들어 봤다. 우선 value가 가상의 공간에 담기고, 그것을 복사하게 되는 copyToClipboard 함수를 만든다. /* 클립보드로 복사 */ function copyToClipboard(val){ let text = document.createElement("textarea"); document.body.appendChild(text); text.value = val; text.select(); document.execCommand('copy'); document.body.removeChild(text); } 참고 한 것은 여기! https://manition.tistory.com/8 위의 함수를 활용해서 '복사하기' 버튼을 클릭..

현재 구축 중인 쇼핑몰은 회원등급에 따라 환급금이 달라지는데 이를 영수증으로 출력해서 서비스 이용자들에게 공유하기 위해 만들어 보았다. (매번 계산기 두들기고, 그걸 psd 열어서 숫자 수정하고.. 인간의 영역이 아니다) 추후 디자인은 조금 수정될 예정이지만 구조는 대략 이렇다.. simple is the best 1. 환급금 계산 input에 입력한 값을 기반으로 환급금이 자동 계산되도록 script를 짜보았다! function selectLevel(e){ const value = e.value; document.getElementById('level_result').innerText = value; let level = document.getElementById('level_result').inner..

자바스크립트에서의 연산 왼쪽에서 오른쪽으로 순차적으로 진행된다는 점을 명심하자!! 단항 연산자 Unary = 피연산자를 하나만 받는 연산자. (양수와 음수를 나타내는 +, -) let x = 1; x = -x; alert( x ); 이항 연산자 Binary = 두 개의 피연산자를 받는 연산자. let x = 1, y = 3; alert( y - x ); 삼항 연산자 연산자 종류 1) 덧셈 연산자 + : 대체로 숫자를 더한 결과값을 반환하지만, 이항 연산자 +의 피연산자로 문자열이 전달되면 문자열을 병합한다. : 두 개의 숫자 뒤에 문자열이 오는 경우, 숫자가 먼저 더해지고, 그 후 더해진 숫자와 문자열과의 병합이 일어난다. : 단항 연산자로 +를 사용할때, 피연산자가 숫자가 아니라면 숫자형으로의 변환을 ..

형 변환 Type Conversion 함수와 연산자에 전달되는 값은 대부분 적절한 자료형으로 자동 변환된다. Alert 창에서 전달받은 값은 문자열로 자동 변환됨. 수학 관련 연산자가 전달받은 값은 숫자로 변환함. 전달받은 값을 의도를 갖고 원하는 타입으로 명시적 변환해 주는 것도 가능하다. 1. 문자형으로 변환 무언가를 출력할 때 주로 발생하는 형 변환. Alert 메서드는 매개변수로 문자형을 받기 때문에, alert(value)에서 value는 문자형이어야 한다. 만약, 다른 형의 값을 전달받으면 이 값은 문자형으로 자동 변환된다! String(value) 함수를 호출해 전달받은 값을 문자열로 변환하는 것도 가능하다. 2. 숫자형으로 변환 숫자형으로의 변환은 수학과 관련된 함수와 표현식에서 자동으로 ..

브라우저는 사용자와 상호작용할 수 있는 세 가지 함수를 제공한다. 함수들은 모두 모달 창을 띄워준다는 공통점이 있다. 모달 창의 특징 - 모달 창이 떠 있는 동안은 스크립트의 실행이 일시 중단됨. - 사용자가 창을 닫기 전까진 나머지 페이지와 상호 작용이 불가능하다. - 모달 창의 위치는 브라우저가 결정하므로 개발자가 창의 모양을 수정할 수 없다. (브라우저마다 모달 창의 모양이 다름) 1. 경고창 Alert = 메시지를 보여주는 함수. (개인적으로 자바스크립트 공부하면서 제대로 작동하는지 체크하는 방법으로 많이 사용하는 듯ㅋㅋ) 2. 입력창 Prompt = 사용자에게 텍스트를 입력하는 필드를 제공. '확인' 버튼을 누르면 사양자가 입력한 문자열을 반환하고, '취소' 또는 Esc를 누르면 null을 반환..