본문 바로가기
내일배움캠프/본캠프

[내일배움캠프_UX/UI] 10주차 수요일 TIL

by 츄잉검 2024. 7. 31.
728x90

TIL (Today I learned)


 
🙄 오늘 나는 무엇을 했나요
- [왕초보] 코딩이 처음이어도 쉽게 배우는 웹개발 A to Z - 2,3주차 수강

- UX 프로젝트 디벨롭

 

😰 오늘은 어떤 문제를 겪었고, 앞으로는 어떻게 해결할 것인가요

오늘은 팀원들과 같이 UX 프로젝트 디벨롭을 진행했다.

지난번 피드백에 맞춰서 2가지를 개선하였다.

1. 팝업 워딩 수정하기

2. 플로우가 잘 보이도록 장표 수정하기

 

팀원들과 회의를 통해서

팝업의 버튼을 비회원예매하기/로그인하기로 바꾸고,

비회원 로그인 창에서 로그인 화면으로 바로 가는

플로우가 없어서 문제가 되었던 부분은 버튼을 추가했다.

 

플로우는 줄어들었다는 것을 잘 보여주기 위해서

화면 스크린을 위 아래로 배치하고,

화면도  5개에서 4개로 줄어든 것이 보이도록 수정했다.

 

디벨롭 한 내용은 튜터님께 다시 보여드렸고,

1. 팝업의 카피를 좀 더 친절한 워딩으로 바꾸기

2. 플로우 차트를 추가해서 플로우가 더 잘 보이도록 수정하기 

이렇게 수정할 사항 2가지까지 더해서

아래 장표처럼 최종 마무리를 할 수 있었다.

 

여전히 워딩 쓰는 것이 다들 어려워서

이것도 써보고 저것도 써보면서 고민을 많이 했는데,

앞으로도 계속 많이 써보면서 발전시켜야할 것 같다.

 

🧐 오늘은 어떤 것을 배웠나요

[2주차]

HTML+CSS+Javascript

HTML은 뼈대, CSS는 꾸미기, Javascript는 움직이기


왜 파이썬 아닌지? Javascript가 표준이라고 생각하면 됨
자바스크립트를 통해서 서버도 만들 수 있음
즉 프론트엔드, 백엔드 다 가능
* java와 javascript는 아무 관련이 없음

1. 변수 : 값(문자, 숫자 등)을 담아서 한번에 관리
나중에 내가 알아보기 쉽게 직관적으로 적어야함

let a = 2
let b = 3
console.log(a+b)

 

값 -> 5

2. 자료형
- 리스트 : 순서가 중요, 0부터 시작

let a = ['사과', '배', '수박'];
console.log(a[0])

값 -> 사과

- 딕셔너리 : 사전처럼 정보를 묶어줌

let person = {'name':'bob', 'age':30, 'height':180}
console.log(person['height'])

 

값 -> 180

let person = {'name':'bob', 'age':30, 'height':180}
let name = person['name']
let age = person['age']
console.log(name,age)

값 -> bob 30

3. 함수

function 이름() {
}


4. 조건문

let age = 15;
if(age<20) {
console.log('청소년입니다')
} else {
console.log('성인입니다')
}

값 -> 청소년입니다

5. 반복문
반복할 꾸러미(=리스트)가 필요

foreach를 누르면 아래 같이 자동으로 나옴
array.forEach(element => {
 });

let ages = [15, 30, 28, 7, 40, 13]
ages.forEach(a => {
 });

 

값 -> 15 / 30 / 28 ...

2주차 완성 화면

 


[3주차]

JQuery
자바스크립트를 짧고, 직관적으로 쓸 수 있는 라이브러리
$('#id이름')

API
은행 내 예금/적금... 창구, 서버내 종류/타입
허락된 곳의 접근만 허용
open API는 누구나 접근 가능

GET 방식
데이터를 주고 받는 형식중 하나
홈페이지 주소에서 ?뒤에 데이터를 지정하는 것
https://movie.daum.net/moviedb/main?movieId=68593
서버위치/서버주소(창구이름)?데이터명

 

3주자 완성화면

 

코딩은 따라하는건 다 하겠는데 혼자는 절대 못할듯?

 

반응형