티스토리 뷰
웹사이트 실험실 lab.brosu.com 오픈!!
안녕하세요~. 브로스유의 웹팀입니다.
브로스유에서는 재미있고, 즐겁고, 실험적이고 크리에이티브한 작업들을 좋아합니다.
그중 온라인에서 재미있고, 실험적인 결과물들을 볼 수 있는 lab.brosu.com 을 소개하겠습니다.
이곳은 다양한 웹기술들의 영감을 받아..
그러한 기술들을 좀 더 재미있게 활용한 웹사이트를 보여드리고 있습니다.
정보가 잘만 보여도 좋지만, 재미있게보는것도 의미가 있다고 생각합니다.
다양한 기술을 사용한 만큼, lab.brosu.com에서는 최신브라우져들에서만 올바르게 보여집니다.
맥환경에서 최신브라우져들에서는 모두 올바르게 보이고, 윈도우에서는 크롬에서 올바르게 보여집니다.
모바일은 아이폰만 가능합니다. 안타깝게도 안드로이드는..ㅠ 볼 수 없습니다.
lab.brosu.com 은 다양한 기술들을 활용해
넥스트 포트폴리오 사이트 느낌으로..신선한 포트폴리오 웹사이트를 만들어 봤습니다.
일단 데스크탑으로 접속하면 아래와 같은 화면이 나타납니다.
로딩화면 후
정적인 화면을 동적인 느낌으로 주었으며, 아래로 페이지 내용이 더 있다는 암시를 주었습니다.
스크롤을 하게되면, 백그라운드에서 재생되는 동영상이 보여집니다.
오른쪽 상단에는 언제든지 쉽게 다른곳으로 이동 할 수 있는 메뉴버튼이 있습니다.
메뉴버튼을 눌러보니 메뉴들이 보입니다.
works로 이동해볼까요~!
Works는 아래와 같이 포트폴리오들이 나열됩니다.
포트폴리오를 클릭하면
독립적으로 집중해서 볼 수 있습니다.
그리고 가장 하단부에는
동영상 백그라운드에 인포정보를 확인 할 수 있습니다.
좀 더 동적으로 보이죠~
여기까지는 크게 특별할게 없는 웹사이트입니다.
하지만, 로고를 클릭하게되면, 다크모드로 변하게 되고,
음악이 재생되면서 로고가 글리치효과로 애니메이션 됩니다.
재생되는 음악역시 브로스유의 음악입니다.
다시한번 로고를 클릭하게되면, 언제 그랬냐는 듯이 처음으로 돌아옵니다.
반전매력이 느껴지나요?ㅎ
음악이 재생되는 상태에서, 모든 페이지가 이동을 할 수 있고, 음악은 끊기지 않습니다!!
평상시 상태에서도 로고에 마우스를 올리면,
로고애니메이션이 됩니다.
이 모든게 모바일에서도 가능합니다.
로고를 클릭하면 음악이 나옵니다.
아이폰에서도 말이죠~!
그리고 음악이 재생하는 상태에서도 모든 페이지로 이동이 가능하구요~!
아이폰에서 홈화면 저장하게 되면, 어플과도 같이 사용이 가능합니다!!
사파리로 넘어가지도 않고, 웹앱내에서 모든 이동이 가능합니다!!
마치 앱 같습니다.
lab.brosu.com에서는 다양한 웹기술들이 사용되어진 웹사이트를 확인해보실 수 있습니다.
앞으로도 좀 더 실험적이고, 재미있는 브로스유의 활동들 기대해주세요~
온라인 뿐만 아니라 전체적인 브랜딩 활동들도 보여드리겠습니다!!
브로스유
brosustudio@gmail.com