TIL_앱바만들기(+미니프로젝트 진행)

2024.10.22(화)

 

4주차 강의 빠르게 듣고 5주차때가 실습 강의여서 이게 더 우선인것 같아 5주차 강의 듣고 있는데

네이게이션 바 만드는 과정에서 인강에서 보여주는 Fiuxed 가 아무리 찾아도 새로 리뉴얼된 피그마 UI에는 버튼이 없었다. 

그래서 해매다가 텍스트 클릭 하면 생기는

저 레이아웃 구역에서 가로영역 조정 옆에 하단 화살표아이콘 클릭하면

바로 위이미지처럼 리스트가 나온다... 덕분에 하나 얻었다. 피그마 화면 바뀌었으니 익숙해져야지

그래서 Fill container 클릭 하면 앱바 텍스트(오토레이아웃 안해도 가능) 영역이 좌우로 확장 되면서 좌우 옆에 있던 아이콘들의 위치가 밀려나간다.

진행완료했으면  크리에잇 컴포넌트로 만들어 준다.

 

프로포티 적용하려고 property 위치를 찾는데 강의 화면과 다르게 되어 있어서 없길래 

상단 위치해 있음 기억하기!

 

텍스트 더블 클릭 후 적용시킨다.

 

 

오전에는 강의를 4주차~5주차 초반까지 수강 하였고

점심 먹은 후에

 

미니프로젝트를 진행하였습니다.

 

팀끼리 우선 회의를 하며 기획을 어떻게 더 디벨롭할지 다같이 고민해보고 의견을 제시하였습니다.

기획 담당 팀원분이 시안 여러개를 제작해주셔서 그중에 괜찮은 건으로 선택 후 

 

와이어프레임이 나오는데로 제가 바로 디자인 시안을 제작하였습니다.

그러면서 같이 디자인 제작하기로한 팀원 한분이 캐릭터를 그려주셔서 그분이 캐릭터 담당을 하기로 하였고

 

캐릭터 컬러톤앤매너에 맞춰 UIUX디자인 시안을 제작하였습니다.

 

원래는 레퍼런스를 좀더 찾아서 더 딥하게 제작하려고했으나 마감일이 목요일인 만큼 빠르게 완성하는게 목표라

프로토타입까지 할수 있었으면해서 우선 후다닥 제작해보았습니다.

 

다만 아쉬운건 강의를 들을시간이 저는 조금 부족하다 느껴져서 오토레이아웃과 컴포넌트 등 디자인 시스템을 우선 구축하고 컬러시스템을 만들어서 적용해보고 싶었으나 UIUX앱 디자인 제가 혼자 담당하는거라 아직은 거기까진 시간도 부족해서 버거워 그냥 제스타일대로 빠르게 제작해 보았습니다.

 

별빛 친구들 팀 이름처럼 귀엽지만 깔끔한 UIUX로 초안이 제작 된것 같아 아직 까진 수월한것 같습니다.

물론 제가 담당이니 알아서 제가 잘해야겠지만요 ㅎㅎㅎㅎ허허...

 

담엔 좀더 디자인 시스템 어떻게 할지 연구해서 적용해보고 싶습니다.

 

끝!