내가 만든 프로젝트의 이름은 custom todos이다.
말그대로 사용자가 본인만의 todo app을 쉽게 예쁘게 만들 수 있게 하는 것이 목표였다.
여기다가 덤으로 사용자로 하여금 앱을 만드는 즐거움을 더할 수 있도록 몇가지 interaction을 추가하였다.
아 물론.....아직 다 완성되지 않았다.
우선 동영상을 보자
첫번째 page에는 프로젝트의 이름과 todo app의 배경화면에 쓸 사진을 넣고
그 사진들이 스크롤에 따라 각자 다르게 움직이게 해서 입체감을 느껴지게 하였다.
스크롤 interaction보다는 carousel을 넣어서 custom앱의 실제 사용예시를 넣는게 더 좋지 않을까?
두번째 page에는 배경화면을 선택할 수 있는 page인데 여기다가 평소에 관심있었던 3D효과를 넣어서
박물관의 전시품 같은 느낌을 주었다.
또한 사용자가 마우스로 화면 전체를 움직이고 회전시켜서 그림을 다른 각도에서 볼수있게 하였다.
세번째 page에는 선택된 배경화면이 표시되며 todoapp 각각의 소품들의 위치를 배치할 수 있게하였다.
아직 소품의 종류가 딱 두가지 뿐이다. ㅠㅠ(input창과 input에 의해 생성될 할일이 나타나는 box)
이곳에 소품 각각의 크기와 색깔 또한 바꾸게할 기능은 없는 것일까? 또한 추가해야할 수 있는 소품은 뭐가 있을까?
네번째 page는 아직 구현하지 못하였는데 option 기능을 추가할 수 있도록 할 예정이다.
날씨나 뉴스의 헤드라인 등 api로 가지고 정보를 가져온다면 가능할 것이다.
모든 page의 공통적인 부분으로 오른쪽과 오른쪽 하단에
navigation bar와 각 page에서 사용자가 해야하는 것을 안내하는 message 칸이 있다.
message가 page마다 달라지려면 어떻게 할 수 있을까?
결국에는 사용자가 custom을 완료하면 해당 결과물을 어떠한 형태로든 뽑아내야할텐데... 그 과정은 어떻게 해낼것인가?
'코드스테이츠' 카테고리의 다른 글
2021년 7월 2일 코드스테이츠 DAY-89 mysql(CRUD), DB 테이블 관계 (0) | 2021.07.02 |
---|---|
2021년 6월 30일 코드스테이츠 DAY-87 인증/보안 기초 sprint review (0) | 2021.06.30 |
2021년 6월 15일 코드스테이츠 DAY-72 Dynamic Programming (0) | 2021.06.15 |
2021년 6월 3일 코드스테이츠 DAY-60 TMI(버블링, 캡처링, 웹접근성, null과 undefined) (0) | 2021.06.03 |
2021년 5월 31일 코드스테이츠 DAY-57 첫 아고라 스테이츠(코드 스테이츠의 stackoverflow) (0) | 2021.05.31 |