개발 공부를 시작한 지 한 달째, 개인 프로젝트를 시작해보려 한다!
필자는 현재 파이썬 기본 문법을 한 달여밖에 공부하지 않은 쌩 입문자! 과연 내가 웹 사이트를 만들 수 있을 것인가.
가장 먼저 내 머릿속에 돌아다니는 "페퍼톤스 팬 사이트"에 어떤 내용을 담을지 생각해보자
팬 사이트니까 페퍼톤스에 대한 정보, 앨범, 수록곡, 콘서트 영상,
이왕 만드는 김에 방명록(?)과 로그인 기능까지 넣어볼까?
이곳저곳 흩어져있는 아이디어를 손가락으로 구현해보았다.
1. 메인 페이지
가독성이 좋았으면 좋겠다. 상단에 대문짝만 한 PPTNZ를 넣어 웹 사이트의 정체성을 보여주고 싶다.
아래에는 카테고리를 통해 이 웹사이트가 어떤 정보를 주로 다루는지 한눈에 알아보기 쉽게 한다.
Info, Album, Concer, Noticem Board
이름은 카테고리의 내용을 직관적으로 알 수 있게 정하겠다.
중앙에는 페퍼톤스의 느낌을 강조하는 사진을 추가하겠다.
오른쪽 상단에는 아이디와 패스워드를 기입할 수 있는 칸을 만들겠다.
2. 인포 페이지
웹 사이트에 들어온 사람들은 궁금할 것이다. PPTNZ가 뭐지!?
PPTNZ에 대한 간략한 정보를 적는다. 그룹의 정체성, 멤버 구성 등등 가독성 있는 내용을 추가한다.
대략 두장의 사진을 넣어 지나가다 페퍼톤스를 마주쳐도 알아볼 수 있도록 하자
3. 앨범 페이지 첫 번째
페퍼톤스는 어떤 음악을 하는가?
왼쪽에 앨범을 분류하여 카테고리를 나누어주고, 사용자가 클릭하면 중앙에 해당 정보를 표시하도록 한다.
카테고리 구조는 나무 위키 페퍼톤스-디스코그래피를 참고하였다.
앨범을 클릭하면 다음 페이지로 넘어간다.
다음 페이지가 존재할 경우, 설명 문구를 추가해야겠다.
4. 앨범 페이지 두 번째
마찬가지로 왼쪽에 해당 앨범의 수록곡을 넣는다. 지금부터 이 웹사이트를 구현한 가장 큰 이유가 나옴!
노래를 들으면서 떠오르는 느낌을 그림으로 표현할 때가 종종 있는데, 이것들을 모아 웹 사이트에 배치하면 무척 귀엽고 재미있을 것 같았다.
아이콘을 누르면 어떤 일이 벌어질까?
5. 앨범 페이지 세 번째
왼쪽 상단에는 내가 누른 아이콘 이미지가, 아래에는 해당 아이콘과 노래, 현 페이지의 간단한 정보를 적는다.
가운데에는 미니 게임과 해당 음원을 유튜브로 삽입한다. 유튜브의 아래에는 노래의 가사를 표시한다.
미니게임은 노래의 분위기와 느낌에 어울리는 것을 창작할 것이다. python 게임으로 구현할 계획이다. 정 어려우면 다른 방법을 생각할 수도 있다. 소싯적에 주전자 닷컴 좀 했다만 도움이 될까?
유튜브는 게임을 진행할 동안 BGM 역할을 해줄 것이다.
6. 콘서트 페이지
상단에는 연도 카테고리를 넣는다. 해당 연도를 클릭하면 콘서트가 있었던 달을 왼쪽에 표시한다. 중앙에는 콘서트 영상을 첨부하고, 오른편에 콘서트에 대한 정보를 간략히 넣는다. 콘서트 일정, 장소 등등을 넣으면 어떨까?
7. 노티스, 보드 페이지
왼편에는 웹 사이트 관리자가 올려놓은 공지글을 확인할 수 있도록 한다. 오른편에는 방명록 기능을 할 게시판을 구현한다. 오래된 글일수록 아래로 내려가도록 한다.
여기까지가 내 머릿속의 아이디어들이다. 가장 걱정되는 부분은(물론 모두 걱정됨. 전부 미지의 세계임) 일단 로그인, 패스워드 기능...? 그리고 데이터베이스!? 서버?!! 그게 뭔데!! 그리고 대망의 미니 게임!!!!! 무슨 언어를 사용할지, 막막하고 막막하지만 한번 해보겠다!
아직 파이썬 기본 문법만 공부한 내가 어떻게 이 많은 것들을 구현할 건지, 대체 며칠이 걸릴 것인지, 나조차 나 자신에게 확답할 수 없지만, 일단 해보기로 했다! 배우면서 하자! 시작은 가볍게!
'Web (~2022.06) > WEB' 카테고리의 다른 글
[개인 프로젝트_01] 페퍼톤스 팬 사이트 :: 메인 페이지 내용, 링크걸기, 목차, 다크버전 (0) | 2022.03.07 |
---|---|
[HTML]많이 쓰이는 HTML 태그 (추가 중) (0) | 2022.03.01 |