동적인 웹사이트 제작을 위한 UI 애니메이션 GIF 포토샵 강좌 모음

 

애니메이션 유저인터페이스 포토샵 강좌

 

 

웹사이트에 동적인 부분을 가미한다면 사용자에게 생동감있는 웹페이지를 제공할수 있습니다. 동적인 유저인터페이스를 만들려면 플래쉬, 제이쿼리, html5, gif 등 다양한 방법이 있는데요. 최근들어 언어의 길이가 길고 복잡한 플래쉬 액션스크립트에 비해 생산성이 높은 제이쿼리와 gif를 이용한 UI가 많이 개발되고 있습니다.

 

오늘은 유저인터페이스 애니메이션을 만들수 있는 포토샵 GIF 강좌를 소개해 드리겠습니다. 총 8가지의 GIF 제작 과정을 배움으로써 초보자와 전문가 사이의 간격을 좁힐수 있는 계기가 되었으면 좋겠습니다.

 

포토샵 강좌

 

 

 

 

 

 

Loading Circle Animation Using Photoshop CS6    

 

이 강좌는 포토샵CS6를 사용하여 로딩 GIF 애니메이션을 만드는 내용입니다. 매우 부드럽게 작동하는 서클 로딩바를 만들수 있습니다.

 

GIF 제작

  

 

 

 

 

 

Photoshop’s Timeline Rocks

 

이 강좌는 배너에 풍선이 움직이는 모습을 GIF로 만드는 내용입니다. 세부적인 내용까지 설명하고 있지는 않지만 타임라인에 대한 이해도를 높일수 있습니다.

 

 

 

 

 

 

 

 

Create an Animated Interface GIF in Adobe Photoshop

 

포토샵으로 스마트폰 앱이 작동하는 모습을 가상으로 만들어보는 GIF 강좌입니다.

 

 

 

 

 

 

 

Create Smooth UI Animations in Photoshop

 

부드러운 UI 애니메이션을 제작하는 강좌입니다.

 

 

 

 

 

 

 

 

Photoshop Animation Techniques

 

총 3부로 나눠진 포토샵 애니메이션 동영상 강좌입니다. 포토샵 애니메이션의 주요 기능과 워크플로우 단계를 배울수 있습니다.

 

 

 

 

 

 

 

UI Animation In Photoshop

 

포토샵 CS6의 타임라인 기능을 사용하여 간단한 애니메이션을 만드는 기본적인 절차를 다룬 강좌입니다.

 

 

 

 

 

 

 

 

A Guide to Animated GIFs in Email

 

이메일 마케팅에서 활용할수 있는 GIF 제작 가이드 강좌입니다.

 

 

 

 

 

 

 

GIFs for UI design presentations

 

UI디자인에 대한 프리젠테이션 용도로 사용되는 멋진 애니메이션 GIF 제작 강좌입니다.

 

 

 

 

 

 

 

<관련글>

2015/03/10 - [포토샵&일러스트레이터 강좌] 로우폴리곤 아트 제작 기법 모음

2015/03/02 - 엘리건트&모던 스타일의 예쁜 명함디자인 무료 소스(AI 및 EPS)

2015/01/13 - 레이어명을 한번에 바꿀 수 있는 포토샵 스크립트 소개

2014/11/28 - [포토샵 강좌] 활활 타오르는 불꽃을 이용한 파이어 텍스트 효과

2014/11/17 - [포토샵 강좌] 일반 이미지를 8비트 스타일의 픽셀 아트로 만들어 보자

저작자 표시
신고
웹통 꼴랑모

댓글을 달아 주세요

  1. 아롱복 2015.03.25 13:25 신고  수정/삭제  댓글쓰기

    외쿡사이트에서 디자이너들이 만든 움직이는 ui작업물들을 볼때 마다 어떻게 저렇게 할까 라는 생각을 많이 했는데,
    이번 자료가 많은 도움이 될 것 같네요 고맙습니다.

    • 웹통 꼴랑모 2015.03.24 15:50 신고  수정/삭제

      안녕하세요. 아롱(록)복님 ^^ 저도 계속 보고는 있지만 이해안되는 내용이 많이 있습니다. 이런식으로 만든다는 정도로 참고만 하셔도 좋을것 같아요.

    • 아롱복 2015.03.25 13:25 신고  수정/삭제

      ㅎㅎ저도 모르는 사이에 아록복으로 되어있네요ㅋㅋ
      "아롱복"입니다~ㅎㅎ

Powerd by Tistory, designed by criuce
rss