[Project] 화면 구성

팀 빌딩을 마치고 우리팀이 할 주제를 정했다. 우리팀이 이번 프로젝트로 만들 주제는 사용자 자신의 자산, 투자현황, 수입 / 지출 현황을 조회하고 관리할 수 있는 서비스를 기획했다. 팀 회의를 마치고 FE팀들은 각자 화면구성시 필요한 부분들을 생각해 오기로 했다.

화면구성

색감

페이지에서 통일된 느낌을 줘야하기 때문에 대표할 로고, 혹은 대표 색상을 정해야 한다. 초록, 파랑 색감은 안전하고 차분한 느낌을 주기 때문에 금융관련 페이지에 잘 어울릴듯 하다.

디자인 참고 페이지

우리의 페이지가 로그인 되기전 화면에서는 이런식의 스크롤 이벤트가 있으면서 간단한 페이지 소개가 나오면은 직관적으로 페이지 기능을 이해하기 좋을듯 하고 보기에도 예뻐 보여서 스크롤 이벤트가 있는 페이지 하나정도는 만들면 좋을듯 하다.

https://hectodata.co.kr/

스크롤 이벤트

스크롤이벤트로 섹션이 넘어가는 이벤트와 오브젝트가 화면에 나왔을때 간단한 애니메이션을 보여주기 위해 스크롤 트리거를 사용하면 좋을것 같다.

스크롤 트리거 튜토리얼 참고 : https://www.youtube.com/watch?v=jLCKWRSqC30&list=PLmAWMAo-opQwJylggqNko8D4kebkpDrPH&index=2&ab_channel=%EB%B0%A9%EA%B5%AC%EC%84%9D%EC%BD%94%EB%94%A9

스크롤 섹션 이벤트 참고

• https://codepen.io/jaenny/pen/jOmBqgx
• https://codingbroker.tistory.com/128