[React] 꿈 일기 기록 사이트 제작 일지-1. 기획 및 디자인 구상, url 설계

🎡 소개

꿈 속에서 겪었던 즐겁거나 흥미로운 일들을 기록할 수 있는 꿈일기 어플리케이션

 

🎨 화면 구상

<메인>

url: /

색상 팔레트

월 이동 버튼: #563A3D

필터: #b18c79

일기 작성 버튼: #764845

배경: #FAF8F2

카드: #E7E1D8

이모티콘(이미지): #FFFDF5

 

<일기 작성 페이지>

url: /new

색상 팔레트

뒤로 가기, 취소하기 버튼: #b18c79

추가 버튼: #975AB7

작성 완료 버튼: #764845

 

<일기 조회 페이지>

url: /diary/:id

 

<일기 수정 페이지>

url: /edit/:id

 

🌌 기능 구상

[메인]

• 일기 조회, 작성, 수정, 삭제
• 하나의 페이지에 여러 개의 일기 추가 가능
• 제목에 드롭다운으로 장르 설정 가능
  • 사용자 미지정시 '일상'
  • 사용자가 장르 추가 가능
• 일기 검색
  • 본문 검색
  • 제목 검색
• 날짜 최신순/오래된 순 정렬 필터
• 장르별 필터 (가장 첫번째 일기 기준)
• 이미지 선택
  • 이미지 업로드 기능
• LocalStorage 이용한 데이터 저장

----------------------------

[추가]

• 데이터 pdf 변환 저장
• 백업 파일 생성

 

---

디자인 도구 - 캔바(Canva)

https://www.canva.com

 

색상 팔레트 참고

Color Set