나아가는 길에 발자국을 찍어보자

[ 1차 미팅 ]1차 기획안 완성 본문

Projects/Font-page(미대생 졸전 도와주기)

[ 1차 미팅 ]1차 기획안 완성

NAWIN 2020. 11. 5. 16:09
반응형

미대생과 만났을 당시 미대생이 준비해온 요구사항 그림들

 

 

1. 조절바가 있는 타이핑 페이지

- 사용자들이 들어와서 타이핑을 해보고 밑의 바를 움직이면 바에서 조절되는 값으로 입력된 글자들의 모습이 바뀌는 것을 볼 수 있는 페이지 

- 베리어블 폰트의 변수는 한개 이상 설정할 수 있는데, 우리 미대생은 2개로 만들어서 2개의 값에 따라 폰트의 모양이 바뀐다.

 

(+) 추가 사항

- 미대생이 만든 폰트는 변수가 2개라서 극점이 4가지이다. 해당 극점의 폰트를 보여줄수있게 4가지 버전의 폰트가 타이핑하는대로 해당 슬라이드기능 밑에 나왔으면 좋겠다고 한다.

 

 

 

 

2. 애니메이션 페이지

- bgm이 깔리고 해당 노래에 맞게 가사들이 나오면서 박자와 포인트에 맞게 글자들이 변하면서 

시각적으로 bgm을 즐길수있는 페이지 

- 노래에 맞춰 가사를 보여주는거랑 박자까지 맞춰야 했기에 생각보다 난이도가 높다고 생각한 기능.

- css 애니메이션이랑 친하지 않았기에 이번 기회로 경험을 쌓고자 했지만 그래도 어려웠다.

 

(+) 추가 사항

- 모든 가사를 맞추기가 어렵다는 판단 하에 여러 노래의 포인트 부분을 따와 가사에 맞춰 움직임을 보여주는 방향으로 전환.

- 해당 페이지는 오프라인 전시에서 온라인 전시로 전환 됨에 따라 동영상을 찍어 제출하는 것으로 바뀌었다. 

- 그래도 기능 구현은 해야 했다

반응형
Comments