2024. 07. 31 UIUX 웹 11일차

[1교시]

7조 TRVAL

: MITI+여행 접목

기능)


장주연
장주연
장  

(1) 본인 mbti를 선택 > 여행지 선택

(2) 교통 수단 고려하여 이동 동선을 효율적으로 계획해 줌

(3) 날씨 확인 기능

(4) 도전적인 콘텐츠 기능

 

1) 꼭 필요한 기능

2) 개선해야할 기능 

- trget가 너무 미비함

- 너무 기능이 광범위함 / 실제 사람들이 젤 필요한 기능을 조금 더 고민해 봐야할 거 같음 

- 통계자료를 조금 더 찾아보고 근거자료가 있었음 더 좋았을 거 같아요! 

- 설명이 너무 간결하다
- mbti랑 여행이랑 접목시켜서 생각한 게 신선했어요(그치만 현실  적으로 봤을 때 mbti가 너무        
  많아서 조금 힘들지 않을까 싶긴 합니다)
- trget가 너무 광범위함
- 도전적인 콘텐츠 기능도 좋은데 근처 가볼만한 곳도 카테고리로     정리해서 있으면 더 좋을거   
  같아요!
- 가봤던 여행지 공유하는 피드도 있으면 좋을 거 같아요 꼭 여행지    아니더라도 맛집이나 카페 같은 거 서로 공유할 수도 있고 참고해   서 여행갈 수도 있으니까 …!
- 너무 기능이 광범위함 / 실제 사람들이 젤 필요한 기능을 조금 더    고민해 봐야할 거 같아요
- 통계자료를 조금 더 찾아보고 근거자료가 있었음 더 좋았을 거 같  아요
- ppt 글씨 조금만 더 컸으면 좋았을 거 같아요

 

[2교시]

- 팀프로젝트 

.

 

 

 

[3교시]

* flex 개구리

 

* 기본값 low

 

[flex-direction]

row) 한줄에 같이 정렬(기본값)

- justify-content 가로 작동

- align-items 세로 작동

- flex-grow 가로 작동

 

colum) 한 줄에 하나씩 정렬

- justify-content 세로 작동

- align-items 가로 작동

- flex-grow 세로 작동 

 

*reverse를 적용하게되면 start가 오른쪽 정렬으로 바뀌고 end가 왼쪽 정렬으로 바뀐다.

- flex-item 순서가 바뀐다는 특징이 있다.

 

[flex-grow] 너비를 설정하는 속성

- flex-container 너비를 활용한 속성

ㄴ flex-container 안에서만 사용할 수 있다.

ㄴ 다 사용하고 남는 공간만 사용한다.

- 값을 1부터 n값까지 사용 가능하다.

ㄴflex-item에 너비를 각각 설정할 수 있기 때문에 flex-item에 직접 적용한다.

- 안쪽 요소 크기에 따라서 비율이 달라진다.

ㄴflex-basis: 0;이라는 코드와 함께 사용하면 해결할 수 있다.

ㄴ비율을 맞추기 위해서는flex-grow: 1;이 적용된 flex-item에 전부 flex: basis: 0;을 사용해야 된다.

- 1:1 비율을 맞췄을 때 안쪽요소가 너무 크면 그 크기에서 크기가 머무른다.

ㄴ무조건 원하는 고정 px이 있을때는 flex-grow 대신 고정 px을 사용하여 설정한다,

 

 

[4교시]

 

 

 

 

 

[5교시]

[flex-basis]

- 우리가 평소에 사용하는 너비속성과 똑같다.

ㄴ이름만 width -> flex-bassis로 사용

ㄴflex-item너비를 flex-basis를 사용