ദ്ദി✧ MoSCoW:: 포트폴리오 제작 계획표

1. MoSCoW 계획표

Must Have

기술 스택	기술 스택을 명확하게 나타내는 UI	로고나 아이콘 포함해 시각성 ↑
프로젝트 및 수료증	프로젝트에 대한 설명, 기술 스택, 주요 기능 포함	수료증과 인증서는 한 눈에 들어오는 UI로
회고록	각 프로젝트에서 배운 점, 어려웠던 점, 개선할 점	별도 페이지 혹은 모달
반응형 디자인	다양한 디바이스(데스크탑, 태블릿, 모바일)에서 올바르게 표시될 수 있도록

 

Should Have

개발 서적	표지 이미지로 한눈에 들어오게 구성	표지 클릭시 간단 리뷰나 배운 점 모달 구현
메인 페이지	간단한 자기 소개 및 역량을 드러내는 인트로 섹션
프로젝트별 데모 링크 및 GitHub 링크	실시간 데모를 볼 수 있는 링크와 GitHub 리포지토리

 

Could Have

다크 모드 / 라이트 모드	사용자 경험을 높이기 위한 UI 개선 요소
애니메이션 및 인터랙티브	페이지를 더 생동감 있게 만들기 위한 애니메이션 및 인터랙티브 요소 추가
블로그 섹션	기술 블로그나 개발 관련 글을 포트폴리오에 포함	지식 공유에 초점

 

Won't Have

백엔드 연동 요소	포트폴리오 웹페이지라 필요해보이지 않지만 멋있을 것 같기두
사용자 관리 기능	사용자 등록, 로그인 등과 같은 기능 (팀이 만들어진다면···.)

 

우선순위 정하기

  1. 초기 설계 및 기본 레이아웃
      - 기술 스택, 프로젝트 및 수료증, 회고록, 서적 섹션
      - 반응형 디자인
  2. 기술 스택 및 프로젝트 섹션
  3. 회고록 섹션 및 서적 섹션
  4. 메인 페이지 및 인터랙티브 요소 추가
      - 직관적인 메인 페이지
      - 추가 기능 구현
  5. 모든 디바이스에서 반응형 테스트

 

2. 작업 계획표

	단계	내용	우선순위
1	소개 및 기술스택 페이지 구성	개인 프로필과 기술스택을 작성하고, 관련 아이콘이나 이미지를 추가.	Must Have
2	프로젝트 목록 및 요약 페이지 제작	프로젝트의 제목, 간단한 설명, 주요 기능 등을 나열.	Must Have
3	수료증 및 교육 이력 페이지 제작	수료증 이미지와 교육 이력을 한 눈에 볼 수 있도록 구성.	Must Have
4	프로젝트별 상세 회고록 작성	각 프로젝트에 대한 구체적인 회고록을 작성하여 추가.	Must Have
5	반응형 디자인 적용	다양한 디바이스에서 최적화된 UI 적용.	Must Have
6	개발서적 리스트 페이지 제작	읽은 책들의 표지를 보여주는 UI를 구현.	Should Have
7	메인 페이지 제작	간단한 자기 소개 및 역량을 드러내는 페이지 구현.	Should Have
8	프로젝트별 데모 링크	실시간 데모를 볼 수 있는 링크와 GitHub 링크.	Should Have
9	다크 모드 / 라이트 모드	사용자 경험을 높이기 위한 UI.	Could Have
10	애니메이션 및 인터랙티브	페이지를 더 생동감 있게 만들기 위함.	Could Have
11	블로그 섹션 추가	기술 관련 블로그 글을 포트폴리오에 포함.	Could Have

 

---

 

참고 사이트 분석

• Yoosion 포트폴리오: 깔끔한 디자인과 명확한 섹션 구성이 특징. 특히 기술 스택을 시각적으로 쉽게 표현한 점이 인상적임.
• Jieun 포트폴리오: 프로젝트별 상세 페이지와 회고가 잘 정리되어 있고, 직관적인 UI로 사용자 경험이 좋음.