urbanscratcher/project-minecraft-park

A personal static web site for Minecraft Theme Park as practice

마인크래프트 테마 파크 웹사이트

• 웹개발 과제용으로 제작한 3페이지의 정적 웹사이트
• 요구사항 추출, 와이어프레임, 사이트 디자인부터 CSS, HTML 작성까지 구현보다 개발 과정에 초점을 맞춘 프로젝트

개발 문서

Minecraft_WebDev_Report.pdf

링크

https://urbanscratcher.github.io/project-minecraft-park/

피그마 링크

https://www.figma.com/file/57ja6lGIQIJfmunKP6jjrb/%5BProject%5D-Minecraft-Theme-Park?type=design&node-id=0%3A1&mode=design&t=iPYF2Hl1DAtTBa92-1

라이브러리 & 기술

• 구현: HTML, CSS
• 디자인: MS Powerpoint(와이어프레임), Figma
• 소통 도구: Slack

개발 여담

• '테마 파크'를 소재로 자바스크립트를 사용하지 않고 순수 CSS와 HTML을 이용해 작성한 과제
• 설계 단계에서는 먼저 사이트의 주요 목적(온라인 티케팅, 놀이기구 정보 제공, 시각적 브랜딩, 광고, 고객 지원)을 정의하고, 주요 타깃을 설정
• 5가지의 동종 웹사이트를 조사해 공통적으로 들어가는 정보와 장단점을 분석해 디자인에 반영
• 이에 따라 페이지를 어떻게 나눌지, 어떤 정보를 배치시킬지를 결정했고, 와이어프레임을 작성
• 피그마를 통해 와이어프레임을 구체화하면서 어울리는 폰트, 컬러 등을 선택해 간단한 디자인 시스템 구현
  • 본격적으로 피그마를 사용해 본 건 처음이었는데, 스타일을 컴포넌트 별로 일괄 적용하는 데 최적화 돼 있다는 느낌을 받았음
• Fake 콘텐츠 개발에 ChatGPT가 엄청나게 도움이 되었다

개인 기여도

95% 이상

• 4인 프로젝트이지만 사정상 아이디어, 문서화, 피그마 디자인, 구현까지 함.
• 그것도 그런 게 슬랙으로만 소통하다 보니 강제하기가 쉽지 않고 다른 나라 사람들이라 시간도 다르다보니 모이기가 어려웠다.
• 2명 정도는 참여나 감수는 열심히 해줬지만, 본인이 결과물에 욕심이 많다 보니 그냥 혼자한다고 생각했던 프로젝트(오히려 좋아)