[본캠프 2주차] 목요일 TIL

10/31 일일 목표📝

디자인 카타 - 홈페이지

피그마 5~7주차 다시듣기

배운거 복습하기

 

---

 

 

📖 오늘 배운 내용

 

웹페이지란?

특정 기업, 개인, 또는 조직이 인터넷을 통해 제공하는 정보의 모음으로, 사용자가 웹 브라우저를 통해 접근할 수 있는 여러 웹페이지로 구성된 플랫폼을 의미

• 웹사이트의 기본 목적은 사용자에게 정보를 제공하거나, 특정 제품과 서비스를 알리는 것
• 웹사이트 내에는 다양한 하위 페이지가 포함될 수 있음

내가 찾은 웹페이지

 

 

 

내가 마음에 드는 웹페이지를 찾는게 쉽지 않았다.. 평소에 많이 찾아본 적도 없어서 그런지 찾기가 어려웠다.

마음에 드는 부분이 어떤 건지 대체..... 한시간안에 찾아서 이유까지 쓰는거라 그렇게 어렵게 생각안해도 됐던거 같기는 한데... 아직 카타를 시작한지 얼마 되지않아서 내가 이해를 잘 못했던 것 같다. 다음에는 한시간내에 딱 하고 끝낼 수 있도록 노력해야겠다.!

 

 

정보구조도(Information Architechture)?

• 화면과 정보들이 어떤 구조로 연결되어 있는지 나타내는 일종의설계도
• 영어의 앞글자를 따서 IA라고 부르기도 함
• 전체적인 제품의 구성과 각 화면들의 관계를 파악할 수 있음

 

화면흐름도(flow chart)?

• 특정 위치 또는 행동을 위해 사용자가 거쳐야 하는 경로
• 사용자가 어떤 과정으로 제품을 사용하는지 시각적으로 확인 가능
• 화면흐름도는 플로우차트라고 많이부름
•  

정보구조도와 플로우차트

 

 

 

 

굿즈 판매 페이지 와이어프레임

 

 

어제 ott서비스 와이어프레임만 만들었어서 강의 다시 들은 김에 굿즈판매 페이지 와이어 프레임과 다이얼로그도 새로 만들어봤다. 한번 해보고 다시 하니 확실히 조금은 적응이 된 것 같다

 

강의 들은 기념으로 오늘의집 어플 클론에 도전해봤다

오늘의집 원본사진과 컴포넌트

 

 

홈 - 검색창 - 상세페이지 이 정도를 만들어보려고 열심히 컴포넌트를 만들었는데 역시 아직도 헷갈리는 부분이 많았다. 다시 강의와 예전에 만들어 놓은 것들을 열심히 뒤져서 해보았는데, 그래도 처음에 사전캠프 듣고나서 만든 지그재그 클론 보다는 쉽게 만들어진 것 같다.

 

 

두시간정도걸린 오늘의 집 클론 홈화면과 검색창

왼쪽) 원본 / 오른쪽) 클론

 

아직은 어떤걸 컴포넌트로 만들고 안만들지, 글자가 가운데로 정렬하려면 어떤걸 만져야하는지 자꾸 오토레이아웃을 하다보니 레이어가 너무 쌓여서 헷갈렸다 😂

 

인기검색어부분도 자세히 보면 new가 가운데가 아니고 아래로 조금 쳐져있는데 어떻게 만져보려고했는데 실패. .. .

도형과 글자는 같이 인스턴트스왑으로 넣으면 안되는건가 내일 조금 더 수정해보면서 공부해야겠다.....

 

 

 

---

 

 

👩‍🏫 오늘 진행하며 어려웠던 부분

 

피그마 강의를 두번, 세번 들으니까 이제 좀 알 것 같다고 생각했던게 오산이었다. 다시 클론디자인을 도전해보니 확실히 시간은 많이 줄고, 단축키도 많이 사용하게 되긴했지만 여전히! 안되는 부분이 많다.........

내일까지 강의를 열심히 들어야겠다!

 

 

---

 

👀 어려웠던 부분을 어떻게 해결했을까?

 

그래도 혼자서 다시 클론을 만들면서 복습해보니 내가 알고있었나 모르고 있었나 실력검증(?)을 할 수 있는 시간이었던 것 같아서 좋다. 시간날때 좋은 앱들의 UI구성을 따라해보면서 공부하면 좋을 것 같다😋