코드그라데이션

1. 웹 vs 앱 사례: Youtube Youtube 웹Youtube 앱접근 방법웹 브라우저를 통해 URL로 접근앱 스토어에서 다운로드 후 설치설치불필요필요업데이트서버 측에서 자동으로 업데이트앱 스토어에서 수동 또는 자동으로 업데이트성능인터넷 연결 품질에 따라 좌우디바이스 자원 활용디바이스 기능 활용제한적비교적 광범위업로드웹사이트에서 직접 업로드앱을 통해 촬영 / 또는 업로드 가능오프라인 기능제한적오프라인 재생을 위한 동영상 다운로드 기능 제공멀티태스킹 지원탭 여러 개로 가능앱 내의 PiP(Picture-in-Picture) 모드 지원광고 차단브라우저 확장 프로그램 사용Youtube Primium 계정 사용하여 광고 차단사용자 경험브라우저에 따라 좌우플랫폼에 최적화된 UI와 UX 제공 2. iOS vs ..

페르소나(Persona)- 소위 제품이나 서비스를 사용하는 고객군을 대표하기 위해 가상으로 만든 인물.- 실무에서는 특정 대상을 이해하고 그에 맞게 서비스를 개발 및 전략을 수행할 때 사용함.- 앨런 쿠퍼의 저서 “The Inmates Are Running The Asylum”에서 소개된 방법론.- 서비스 기획, 제품 개발, 디자인 등 많은 분야에서 사용자 연구 및 마케팅 전략을 위해 주로 사용함. 어떤 사용자가(특히 돈이 될 것 같은 사용자)우리 앱을 꼭 쓸 것 같은지!소설 등장인물 쓰듯 정리한다. 프로토 페르소나1) 각자 작성한 프로토 페르소나를 소개2) 가장 적합한 1개를 추림 타겟 페르소나1) 프로토 페르소나에 근접한 대상자 섭외2) 실제 사용자 인터뷰 진행 후 업데이트 지속적 페르소나 개선- 매..

UX 기획 전략 프로세스   기획자란?목적 달성을 위해 앱을 활용하여 설계를 하는 사람 목적 달성? 목적 = 돈 ==> “돈을 벌기 위함” 임!!!앱을 활용? 수단 = 앱 ==> 앱은 그냥 수단일 뿐(둘 사이의 혼동 방지할 것) 즉,,, 앱 개발을 위해 앱에 넣을 기능과 UI 화면을 설계하는 사람? NONO. 특히 UX 기획자의 기본 마인드는 돈이 목적, 앱은 수단.  가설 검증: 앱(웹) 사업의 생존 수단은 끊임없는 “가설 검증”이다.처음 사업을 시작하는 모바일앱의 시장 고객, 제품 등에 대한 생각들은 모두 가설이다.가설 : 어떤 문제에 대해 우리가 가진 추측앱(웹) 기획자는 가설을 사실로 받아들이기 위해서는 가설을 입증하는 근거가 모여야 한다. 결국 중요한 것은 “가설검증 능력” UX = 돈- 수익이..

UX기획에 대한 기초 개념[기획자 포트폴리오 샘플 구성안] 앱(웹) 개발의 절차앱 기획앱 디자인앱 개발앱 검수앱 런칭 그래서 UX 기획은 어떻게 해야 하는데??UX 전략 수립 프로세스  그렇다면, PM과 PO의 차이를 아시나요?1) PM : 프로젝트 위주- 일정 준수, 요청부서, 개발자와의 소통- 완료를 위한 기능의 선택과 집중- 프로젝트가 끝나면 종료! 2) PO : 프로덕트 위주- 지표 달성, 사업부서, 개발자와의 소통- Retention(유지)을 위한 기능 업데이트 중요.- 프로젝트 종료기간 없음.

자바스크립트를 실행하는 와중에 Node.js의 모듈을 이용하여 js 파일을 다른 곳에서 실행할 수 있는 기능이 있었다. index.js const calc = require("./calc"); // 내장함수, 경로 console.log(calc); // 모듈을 출력 console.log(calc.add(1, 2)); console.log(calc.add(4, 5)); console.log(calc.sub(10, 2)); calc.js const add = (a, b) => a+b; const sub = (a, b) => a+b; module.exports = { moduleName : "calc module", add : add, sub : sub, }; 실행 결과

API란? 예시 let response = fetch("https://jsonplaceholder.typicode.com/posts").then((res) => { console.log(res); }) 조금 더 세련되게 json 형식으로 가져와보겠다. async function getData() { let rawResponse = await fetch("https://jsonplaceholder.typicode.com/posts"); let jsonResponse = await rawResponse.json(); // json 형태로 반환 console.log(jsonResponse); } getData();

async // async function hello () { return "hello"; } async function helloAsync() { return "hello Async"; } console.log(hello()); console.log(helloAsync()); // async를 붙여주면 자동적으로 비동기 함수가 된다. 이말은 then을 쓸 수 있다는 것인데, async 붙은 함수의 리턴값은, 비동기 작업 객체 Promise의 resolve의 결과값이 된다. 그러니까 async를 붙이고 그냥 리턴만 해도, promise를 리턴하면서 resolve를 이 return 값으로 수행한 것과 똑같은 결과를 얻는다고 생각하면 된다. await 기다렸다가 끝나는 함수를 만들자 일단 async 응용 f..

비동기 작업이 가질 수 있는 3가지 상태 2초 뒤에 전달받은 값이 양수인지 음수인지를 판별하는 작업 만들기 function isPositive(number, resolve, reject) { setTimeout(() => { if(typeof number === "number") { // 성공 -> resolve resolve(number>=0 ? "양수" : "음수"); } else { // 실패 -> reject reject("숫자형 값이 아닙니다.") } }, 2000) //2초 대기 } isPositive(10, // 10은 숫자형이고 양수이기 때문에 성공 (res) => { console.log("성공적 수행 : ", res);// }, (err) => { console.log("실패함 : ",..