최카피의 컴퓨터 배우기

web site를 구축하려면 무엇을 공부하는 것이 좋을까요?

html & css & javaScript 등 프론트엔드 언어를 배우는 것이 좋습니다. 다른 언어들도 있지만 단기간에 빨리 배울 수 있고, 다른 사람들에게 강력한 퍼포먼스를 주기에는 위에 언어들이 매우 좋습니다.

 

하지만...

모든 사람들이 언어를 배울 수는 없습니다. 시간이 없을 수도 있고, 굳이 개발 언어를 배우며 web site 를 구축한다는 것이 어려운 분들도 있으니까요.

특히 요즘에는 web site 구축 플랫폼들이 잘 되어 있어서 언어를 몰라도 site 구축이 쉬워졌으니까요.

그래도 언어를 알고 쉽게 가는 것과 모르고 쉽게 가는 것은 시간이 지나 site 확장이나 리뉴얼에 중요한 변수가 되니 틈틈히 언어를 익혀두는 것을 추천 드립니다.

 

https://hyunytip.tistory.com/25

 

W3SCHOOLS에서 HTML 공부하자!

W3SCHOOLS! http://www.w3schools.com/ HTML(HyperText Markup Language)은 하이퍼텍스트 마크업 언어의 약자로 웹 페이지를 위한 언어입니다. HTML은 제목, 단락, 목록 등 본문을 위한 구조적 의미를 표현하기도..

hyunytip.tistory.com

예전에 포스팅 한 W3SCHOOLS 사이트를 통해 혼자라도 공부를 할 수 있습니다.

 

해당 포스팅에서는 이런 일련의 과정을 보다 쉽게 도울 수 있는 Tool을 소개하려고 

 

Tumult 회사에서 만든 Hype 시리즈입니다.

2019년 12월 17일 현재 버전 Hype 4 까지 개발되었습니다.

저는 Hype 4를 구입하지 않았기 때문에 Hype 3를 이용해 소개하겠습니다.

 

https://tumult.com/

 

Tumult Hype

Tumult Hype is the HTML5 creation app for macOS. Animations and interactive content made with Tumult Hype work on desktops, smartphones and iPads. No coding required.

tumult.com

Hype를 개발한 Tumult 메인 사이트입니다.

Hype가 지원하는 운영체제는 MAC 운영체제입니다. 아쉽게도 Windows 운영체제에서는 사용할 수 없습니다.

 

https://tumult.com/store/

 

Tumult Hype

Tumult Hype is the HTML5 creation app for macOS. Animations and interactive content made with Tumult Hype work on desktops, smartphones and iPads. No coding required.

tumult.com

Hype 스토어 사이트에 접속하면 사이트에서 직접 구매하거나 Mac AppStore로 이동하여 결제할 수 있습니다.

구매 후 설치를 완료 했다면 실행해 볼까요.

썸네일 이미지 처럼 생긴 아이콘이 Mac 컴퓨터 런처에 있을꺼에요.

 

저는 Hype 2 버전 때 부터 사용을 했었는데, 개발사가 Hype를 처음 홍보한 문구는 'Animate' 제작이었습니다.

당시 엣지 애니메이터 등 애니메이션을 만드는 Tool에 대한 이슈가 있었던 것 같기도 하고, Hype도 처음에는 그 쪽 방향으로 컨셉을 잡았던 것 아닌가 생각이 드네요.

 

hype 3의 레이아웃을 설명하며,

상단에는 엘리먼트를 생성하거나 엘리먼트 속성 설정, 페이지 배율, 프리뷰 등을 설정할 수 있고,

왼쪽에는 Scenes bar로 site로 구분하면 페이지를 추가하거나 삭제할 수 있습니다.

중앙 상단은 작업창이며, 중앙 하단은 타임라인 설정 bar 입니다.

우측은 엘리먼트 또는 외부에서 가져온 오브젝트의 위치, 모양 등 다양한 옵션을 설정하는 공간입니다.

 

https://tumult.com/hype/tutorials/

 

Tumult Hype

Tumult Hype is the HTML5 creation app for macOS. Animations and interactive content made with Tumult Hype work on desktops, smartphones and iPads. No coding required.

tumult.com

Hype Tutorials 페이지로 튜토리얼 영상들 몇 개만 보셔도

Hype Tool 의 대단함을 이해할 실 것입니다.

 

그리고 이런 Tool을 이용해 web site 구축에 도움이 될 영상을 하단에 링크하겠습니다. 제가 만든 영상으로 web site를 만드는 분들이 참고 하시면 도움이 될 내용입니다.

https://youtu.be/ZJKcx5SoW_g

 

해당 포스팅은 소개편으로 사용편에서 보다 자세한 Tool의 모양을 다루겠습니다. 포스팅에 있는 메인 사이트와 튜토리얼 그리고 제 영상을 먼저 봐두시면 사용편이 보다 쉽게 이해되실 것입니다.

 

사용편에서 또 뵐께요.

이 글을 공유합시다

facebook twitter googleplus kakaoTalk kakaostory naver band