본문 바로가기


전체 글

(468)
FTP 파일질라 사용팁 파일질라는 지난 게시물에 웹사이트 개발을 위한 웹호스팅 공간인 서버와 내컴퓨터를 일정한 계정을 부여받아서 접속하는 프로그램으로 소개한 바있다. 이번시간에는 웹사이트 개발을 위해 파일질라의 사이트관리자 기능과 비밀번호 묻기처리, 탐색 동기화등 내컴퓨터인 로컬사이트와 웹호스팅한 서버공간인 리모트 사이트의 기본적이지만 익숙하지 않아 어렵게 사용하는 분들을 위해 소개합니다. 아직 무료 웹호스팅 서비스 신청을 못했거나, 파일질라 사용법을 모르면 아래 영상을 통해서 충분히 숙지하고 따라하기 바랍니다. UI UX 폴더내에 home 폴더생성 후 01. 웹호스팅 신청 / 계정정보 확인 : oztv21 ◆ 호스트(도메인,FTP 주소) : oztv21.ivyro.net ◆ FTP 암호????? : ********* 02. ..
Web 03. 하이퍼링크, 아이디와 클래스, 폰트어썸 & 구글아이콘 Hyper link : 웹 문서, 웹 사이트 등의 URL연결시에 사용하는 태그이다. 외부연결시에는 타겟이 필요하다. 바로가기(그림은 배너) 본 게시물 하단에 Div Tag에 대해서 소개하고 html문서를 공유합니다. URL에는 웹 문서, 웹 사이트, 현재문서내 위-아래 바로가기, 전화번호(전화상담,문자상담),이메일,폰번호(010-0000-000 전화및문자 상담) 등을 연결해서 모바일 환경에서 자주사용 ※아이콘 주로 활용하는데 폰트어썸을 주로 이용한다. 앵커태그사이에는 글,그림,아이콘을 주로 넣는다. 외부연결시에는 타겟이 필요하다. 새창개념의 new, 빈 창/탭 개념의 _blank를 주로 사용한다. 앵커태그와 유사한 기능을 하는 자바스크립트 예외이다. 서브라임텍스트에서는 본 문서내에서 우클릭후 '오픈 인 ..
Text 전용 Animator After Effect에서 개성있는 Text Animation을 표현하기 위한 Effects & Preset의 기원이되는 Animator를 Position, Opacity, Scale 등의 개별 Text에 속하는Transform 속성을 필요에 의해 추가하고 Start, End 값을 조절해서 애니메이션 만드는 원리와 3D Layer를 활용한 표현을 소개합니다. 01. Text레이어를 펼치고 Animate ▶ Position을 추가한다. 02. Position을 0,-200 Y축으로 내려주고, Range Selector1의 End값을 0~100키프레임을 삽입해서 아래서 위로 올라가는 애니메이션을 표현해본다. 03. Text레이어에서 다시 Animate ▶ Opacity를 더 추가한다. 다른 속성의 불투명도를..
시네마4D 06. Material & Texture Cinema4D의 다양한 Material과 이미지 기반의 Texture를 쉽게 가져와 적용하는 방법을 소개 하겠습니다. 아래 사이트는 C4D의 재질을 검색해보고 찾아 적용할 수 있는 사이트 입니다. https://c4ddownload.com/category/materials-and-shaders/ Materials and Shaders Materials and Shaders Materials and Shaders Free Cinema 4d Shaders download c4ddownload.com 검색한 결과물의 갤러리 이미지를 클릭하고 하단의 작은 Download Material을 누르면 됩니다. 현재 작업중인 C4D파일에서 재질을 쉽게 불러오기 C4D파일만 있어도 현재 작업 중인 공간에서 Load M..
시네마4D 포폴 01. 파도의 표현(Water Wave) 시네마4D 포트폴리오 제작에 활용할 멋진 모션그래픽 중 여름 무더위를 날려보낼 Water Wave표현을 C4D의 표현방법과 더 쉽게하는 C4D관련 외부 설치형 hot4D 플러그인을 이용해서 파도위에 오브젝트들이 떠있는 장면을 연출해보겠습니다. A-1. No Plugin 시네마4D 자체 기능 중에서 파도장면 Water Wave를 우선 제작해보겠습니다. 01. 평면인 Plane을 추가하고 Object 탭에서 아래 그림과 같이 너비, 높이와 공간 내의 나눠지는 Segments를 각 50정도 준다. 02. Displacer을 추가하고 Plane아래에 연결해준다. 그리고, Shading 탭으로 가서 Shader ▶에서 Noise를 적용한다. 03. Displacer Noise 썸네일을 클릭하여 크게보고, 0F 타..
스마트문화앱 사용자 조사분석(0724) 보호되어 있는 글입니다.
Ae 5-2편. 식물 성장 모션그래픽 - 일러스트레이터 , Taper 일러스트레이터에서 선형도구인 Spiral tool로 그린 넝쿨식물이 애프터이펙트에서 성장하며 싹을 나게하는 자연, 성장, 재생을 표현하는 모션그래픽을 표현해보겠습니다. Plant growth motion graphics 식물성장 모션그래픽 E0101 일러스트레이터에서 선형도구인 Spiral tool(스파이럴 툴, 나선형 도구)를 이용해 그린 후 Pen tool으로 이어 그린 형태에 Width tool로 완성한 잎을 그려서 완성한 일러스트파일(Ai, PDF)을 저장합니다. 다음으로 저장한 파일을 애프터이펙트에 파일 가져오기(Import)를 통해 Composition Retain Layer Sizes로 레이어 사이지를 유지하며 자동으로 Comp를 만들어주며 작업을 진행합니다. 일러스트레이터의 Stroke의 ..
스마트문화앱 콘텐츠설계(0719) 보호되어 있는 글입니다.
3D 그래픽 제작 (0712) 보호되어 있는 글입니다.
시네마4D 08. 2D얼굴표정으로 캐릭터의 감정표현 3D모델에 눈,코,입 등의 감정표현을 하는 것은 어려운 작업으로 각 표정을 하는 신체부위를 크기를 조절하고 회전을 주는 방식으로는 작업효율이 떨어집니다. 포토샵과 일러스트레이터를 이용해서 정해진 크기의 투명한 PNG이미지를 준비한다면 캐릭터의 표정을 4단계로 쉽게 바꿀 수 있다. 2D 얼굴표정으로 캐릭터의 감정표현은 일러스트레이터에서 작업을 하고 각각 필요한 얼굴 단위로 face1.png와 같이 PNG이미지파일로 사용할 수 있습니다. PNG이미지는 Color와 Alpha라는 재질에서 동일한 Shade의 복사,붙이기를 이용하며 재질내의 속성을 변경하고 렌더링을 하면 아래 그림과 같이 같은 표정을 다수의 캐릭터얼굴에 부여할 수 있습니다. PNG Face JPG Face PNG 얼굴표정 재질적용 순서 01. ..
Web 02. HTML Style, Color, List, Table 일반문서에서도 쪽 여백과 관련된 문서의 스타일들이 있습니다. 웹문서에도 필요한 여백과 서체(웹폰트 포함), 배경색상과 글씨색상 등 Head문에 삽입외는 마진:외부여백, 패딩:안쪽여백, 보더:테두리 색상 두께 스타일 3개속성 h1태그에 연습하기....웹 요소 박스형상을 띰 // 보더는 적용위치에 따라서 적용하기도 하고 일반적으로는 상하좌우에 선이 보인다. -bottom, -left, -top, -right h1{border-left:16px #f00 solid;border-bottom:1px #000 solid;padding-left:10px;}
시네마4D 07. 지구본 Earth (Ai Merge ) 시네마4D에서 Ai 활용해 지구본을 반들어보는 튜토리얼을 준비했습니다. 픽사베이에서 SVG파일로 받아서도 Adobe Illustrator에서 열어 볼 수 있습니다. 색상은 Material로 적용하니 단색으로 구성하고 중요한 것은 저장시 Ai 버전을 8.0으로 저장해서 C4D에서 File - Merge로 가져와서 작업이 진행됩니다. 01. 일러스트레이터에서 Ai파일을 Illustrator 8.0 버전으로 저장한다. 02. C4D에서 새 스피어를 만들어 놓고, File-Merge 를 통해서 Ai파일을 Import한다. Position은 0,0,0 맞춘다. 그리고 Spline(Shape) 전용의 Extrude를 추가한다. 03. 지도를 Extrude에 삽입하고 하단의 Hierarchical를 체크하면 입체감이..
Web 01. 앱콘텐츠 설계 HTML입문 스마트 문화 콘텐츠의 기본적인 콘셉트는 프로젝트를 기획하면서 알게 모르게 자연스럽게 만들어진다. 그렇기 때문에 콘셉트를 정하기 위해 가장 먼저 해야 할 일은 앞서 작성한 프로젝트 기획서를 검토하고 프로젝트 기획서 안에 이미 녹아들어 있는 콘셉트를 발견하는 것이다. 그리고 발견한 콘셉트를 구체적으로 정리하여 확장 및 발전시켜 나가야 한다. 하나의 프로젝트 기획에서 다양한 형태의 결과물 만들어질 수도 있다. 콘셉트를 어떤 방향으로 확장·발전시키느냐에 따라 전혀 다른 결과물이 나올 수 있기 때문이다. 이와 같이 하나의 자원을 토대로 다양한 사용처를 개발해 내는 것을 OSMU(One Source Multi-Use)라고 한다. 스마트문화앱 콘텐츠 설계 NCS교재 HTML은 무엇인가? 하이퍼텍스트 마크업 언어(Hy..
시네마4D 05. 카메라 추가와 렌더링 시네마4D에서는 여러분이 Alt키를 누르고 이동하면서 각기 다른 관점에서 렌더링을 하면 되는 편의가 있습니다. 하지만 카메라가 트렉을 회전하며 촬영하는 것 같은 전문적인 카메라 추가하고 렌더링하는 방법을 소개합니다. Additive manufacturing Building Information Modeling (BIM) Product design Visual effects (VFX) Virtual reality (VR) Generative design CAD/CAM https://www.coursera.org/articles/3d-design 어떤 환경에서도 특정한 대상만 잡는 타겟카메라 타겟 카메라는 액션영화의 주인공을 타겟으로 카메라맨이 넘어지고, 회전해도 주인공을 필히 잡아서 앵글속에 담는 기술입니..
시네마4D 04. 시뮬레이션 효과 사실적인 텍스쳐 시네마4D의 연기, 바람 등 사실적인 시뮬레이션 효과를 소개합니다. https://youtu.be/NF7cvDXPGEw 01. 최상단 메뉴 Simulate에서 Particles - Emitter을 찾아서 추가하고, 목적에 맞게 회전, 크기를 조절한다. 결과물을 Play [F8]키를 누르면 작은 입자가 나가는 것을 볼 수 있다. Landscape & UV Mapping C4D에서 풍경이란 뜻의 랜드스케이프(Landscape)를 추가하고 아래 재질들을 Color에서 Texture- Load Image를 통해 적용해 산악지형을 반영했습니다. 이어서 Physical Sky를 추가하고 앞의 아이콘을 클릭해서 시점을 19:00 전후로 놓으면 사진같은 사실감을 줄 수 있습니다. 지형과 산은 단순히 추가하는 Color..
시네마4D 02. 키프레임애니메이션(3D무료소스) 시네마4D에서 키프레임을 기반한 단순한 애니메이션을 넘어 경로운동, 루프 애니메이션, 시뮬레이션, 리깅을 통한 걷고 뛰는 애니메이션 작업까지 소개합니다. 아래 무료 3D 모델소스를 구할 수 있는 사이트를 소개하며 C4D 외 FBX, OBJ 등의 확장자도 모델링 공통소스로 활용가능하니 필요한 경우 다운로드하여 사용하시기 바랍니다. 현재 문서내에서 File-Merge를 통해 가져온 소스들을 각각 필요한 부분만큼 배치하여 사용합니다. 기존의 파일과 무관히 모아주는 기능이 Merge입니다. DropDown방식을 열기만 합니다. https://free3d.com/ko/3d-models/cinema-4d Cinema 4D 무료 3D 모델 - .c4d 다운로드 - Free3D free3d.com 01. 도로만들기 :..
시네마4D 03.이미지로 오브젝트를 덮는 UV Map UV 매핑(UV mapping)은 3차원 모델로 펼쳐서 2차원 그림으로 변환시킨후 그래픽작업 하고 다시 3차원 모델에 맵핑 소스로 덮어서 사실적인 표면을 보이게 하는 프로세스 입니다. 대 부분 면(Polygon, Face)에 색상대신에 이미지 파일을 표면에 덮는 기술로 오브젝트를 펼치고 이미지 파일로 내보낸 후 포토샵, 일러스트레이터에서 편집한 이미지파일을 다시 가져와 메테리얼로 덮는 기술 입니다. cereal boxes images | My Art School Designs: 3D Cereal Box Design | Box template, Box design, Barbie paper dolls It's not to scale because I have to be able to print it on 8..
영상CG작업 - 포트폴리오 모션그래픽 인트로씬 30s 보호되어 있는 글입니다.
Ae Portfolio 03 - Portfolio(Pride) Cover Title Portfolio를 소개하는 영상은 대부분 1분정도로 인트로와 이어지는 영상들의 컬렉션을 트랜지션으로 마주리하고 최종 아웃트로로 제작을합니다. 이번 강좌는 인트로에 사용하는 커버타이틀로 오징어게임, 아래 그림을 클릭해서 볼 수 있는 원조 Movie Shapes님의 Pride 등 일러스트레이터를 이용한 라인아트를 주로 다뤄보겠습니다. 01. 일러스트레이터에서 단어별로 이어지는 라인 작업을 그림과 같이 진행합니다. 이 작업은 폰트를 사용하는 것이 아니라 도형과 펜툴을 이용한 작업이어야 하고 Portfolio와 같이 표지 타이틀 같은 느낌으로 각 단어별(레이어의 선형 형태별)작업을 해야 하는 점 잊지 마세요. 직선으로 그리고 직접선택도구를 이용해서 그림과 같이 코너를 둥글게 처리해줍니다. 원을 이용한 경우에는..
Adobe 응용소프트웨어 아이콘 무료공유 파워포인트로 만든 Adobe 영상제작 응용소프트웨어 대표 아이콘들을 무료로 공유합니다. PDF로 고해상도로 파일-내보내기-PDF로 내보낼 수 있기 때문에 어느 프로그램보다 손쉽게 아이콘을 제작할 수 있죠. 서체는 맑은고딕으로 표현하니 비슷하더라구요. Adobe 영상제작 응용소프트웨어 대표 아이콘을 표현한 파워포인트 원본은 아래 파일을 다운로드하면 됩니다. 리플렉션의 표현도 반사를 이용하니 포토샵의 마스크 작업한 표현보다 더 쉽게 표현이 됩니다. 중요한 점은 영상디자인 등 어떤 시각디자인 분야라도 응용방법은 늘 아이디어를 내면 쉽게 해결되는 방법이 나올 수 있으니 여러분도 응용해보세요. 위 이미지들을 PNG이미지입니다. 아래는 아이콘을 제작한 PowerPoint 원본파일로 별도 공유합니다.
Ae Portfolio 01 - 신한은행, Trim path, Track Matte, Mask 애프터이펙터에서 제일 많이 활용되는 Trim Path 를 일러스트레이터 파일을 가져와 사용한ㄴ 방법과 애프터이펙트의 펜툴, Text를 Shape로 만들어 사용하는 트림패스 작업을 소개합니다. 본 내용은 앞서서 알아야할 기본지식을 배우고 적용할 수 있으니 아래 배너를 클릭해서 배우고 각자의 창의적인 발상으로 모션그래픽에 활용하면 좋겠습니다 E01 - 트림패스의 응용 Ae 5편. 선형 모션그래픽기법 Trim Paths와 오프닝 애프터이팩트(Ae)에서 방송영상에 많이 활용되는 선형 모션그래픽기법 트림패츠(Trim Paths)를 배워봅니다. 벡터 그래픽 응용프로그램인 일러스트레이터(Ai)의 기본 선형들과 유사한 개념으로 선, oztv.tistory.com 앞서 소개한 트림패스는 많이 적용하는 Ae의 모션그래픽 ..
QR코드 생성하고 콘텐츠에 삽입하기 QR코드는 폰으로 찍어서 바로간다 QR 코드(Quick Response code)은 Black Color의 패턴 형태속에 '정보를 담은 매트릭스 이차원 코드'이다. 위키백과를 참고하면 해당 정보를 더 볼수 있다. 주로 종이, 현수막, 패키지 등 인쇄형태로 출력되는 기획한 콘텐츠(출력물)에 삽입해서 단순한 텍스트 에서 부터 전화번호, 웹사이트 URL(홈페이지, 블로그, 유튜브채널 주소), 전자우편, 단문서비스 문자보내기(SMS)로 스마트폰 기기(디바이스)의 카메라 기능으로 접근할 수 있어서 오프라인 환경에서 유선전화 및 네트워크 등 온라인의 가교역할을 하고 있다. QR코드는 웹콘텐츠에서도 해당된 고객센터, 앱 플레이스토어 등에 바로 접근할 수 있어서 오프라인과 온라인 다양한 플랫폼에 적용가능하다. QR코드..
GTQi 일러스트 B형 2급-3번(속전술 연필N, 패턴) 최신기출문제 링크 - GTQ (종목전체에서 선택 후 검색) KPC자격 한국생산성본부 자격에 대한 원서접수 ITQ, GTQ, ERP, IEQ, UTQ, SWC, MAT, SMAT, CAD, 3D CAD 실무능력평가, DSAC, PAC, 데이터 사이언티스트 능력인증자격 ,프레젠테이션 능력, 3D 프린팅 모델링 자격 등을 서비 license.kpc.or.kr
특수영상합성(0620) 보호되어 있는 글입니다.
Ae CG. Fill Water - Wave Warp, Ripple Rainfall이 전체에 떨어지는 물같다면, 컵같은 제한 공간에 떨어지는 낙수에 물이 채워지는 효과는 기존에 배운 기법들을 활용하면 좋다. Wave와 Trim Path로 떨어지는 낙수표현에 Particle, Bubbles(Foam)을 적용하면 더 좋은 특수영상 합성효과를 구현할 수 있다. 작/업/순/서 01. Trim Paths, Wave Warp 파란색상의 Stroke를 그리고 세로로 떨어지는 물을 표현하기 위해 우선 Trim paths를 적용해서 End 0 ~ 100%으로 처리하고, Start는 뒤에 0 ~ 100%처리를 했습니다. 파란색상의 Stroke를 선택하여 Wave Warp를 적용하고, Direction을 0도로 수직으로 내리는 형태가 되게 방향을 바꾼 후, Wave Height와 Width..
코이의 법칙 문화콘텐츠 - 한국홍보 푸티지(포폴 참고) 코이의 법칙, 제한된 생각과 환경에서는 큰 뜻을 펼치기 힘들다. 20~30초 분량의 하나씩 어떤 메시지를 담은 작은 작품들이 모여서 1~2분짜리포트폴리오 작품집이 됩니다. 실적을 뜻하는 포트폴리오는 여러개의 작품을 사진앨범 속에 끼워놓고 넘기는 것과 같습니다. 실제 건설회사의 포폴은 1년에 몇개없는 공사실적 등을 말하기도 한다고 합니다. 개인이 상업적인 목적이 아닌 포트폴리오로 음원과 영상 출처를 밝히고 공공의 이익과 안녕을 위해 영상편집에 사용하는 것은 예외로 할 수 있다고 합니다. 문화콘텐츠로 한국홍보영상에 활용할 만한 푸티지는 개인 연습용 편집 영상으로 한국의 아름다움을 보여주고자 만들어 보았습니다. 대부분 TV CF를 짜집기하였고 비상업적 목적으로 만들었습니다. 코이의 법칙(Koi's Law) 피..
GTQi 일러스트 B형 2급-2번 (입체, 3차원) 최근 GTQi 일러스트 기출문제에는 요독 그리기 어려운 입체적인 모양이 출제됩니다. 악기, 클립,박스 등 그림이 복잡 합니다. 아래는 2023. 4월 GTQi의 2급 B형 2번문제로 아래 문제를 참고해서 2D로 그리는 입체사물을 그려보는 연습을 하시기 바랍니다. GTQi 일러스트 B 2급2번 GTQi 일러스트 2급 시험에 출제된 문제를 푸는 내용은 상세하지만 아래 강좌를 Play ▶ 버튼을 누르시고 따라해 보세요. 복제하듯이는 만드는 것은 욕심이고 실제 1개 문제만 풀다가 불합격의 고배를 마시는 분들이 많습니다. 비슷하게 뭐 하나 빠뜨리지 말고 90분의 시간을 잘 안배해서 3개으 그림을 그려보세요. 자신있으면 어떤 그림이라도 표현할 수 있습니다. Play ▶ 버튼을 누르시고 따라해 보세요. Play ▶ ..
Ae CG. Rain Effect, Adjustment Layer AfterEffects - Simulation CC Rainfall(Roto brush, Track Matte Alpha) 위 강좌영상은 2개의 Chapter로 구분되었습니다. 아래 비내리는 도시밤풍경 이미지를 사용해서 콤프내에서 작업 할 것입니다. 아래 이미지를 클릭해서 다운로드 후 작업을 진행 합니다. E01 - 콤프 전체 공간의 Rainfall(Blend mode, Adjustment Layer) CC Rainfall을 적용한 Adjustment Layer 아래에 있는 모든레이어들이 비내리는 효과를 화면 전체 적용할 수 있다. Adjustment Layer 위에 있는 오른쪽 같은 대상은 전혀 영향을 받지 않고 있다. E02 - 제한된 공간의 Rainfall(Track Matte Alpha) CC R..
Ae CG. 형태의 변화 모핑(Morph) 영화에 나오는 변신장면 처럼 형체가 전혀 다른 이미지로 변화하는 모핑(Morph)을 이용하여 뒤바꿀 영상과 영상사이의 스틸이미지(Still Image)의 형태를 변형 후 영상으로 복원하여 자연스럽게 연결시키는 방법을 반영하기도 합니다. Premiere Pro의 모핑효과를 적용하는 Effect중에 Morph Cut이라는 Video Transition이 있지만, 아래 그림처럼 못볼상이 됩니다. 같은 형상으로 눈이 뜬 이미지와 감은 이미지 정도가 적당합니다. After Effects에서도 유료 플러그인을 사용하지만 강좌영상을 참고해서 한단계씩 따라 할 수 있는 쉬운 프로그램입니다. 뭐라.... AAAA dfdfdfdfdf 이미지기반의 무료 모핑효과 FotoMorph 위 강좌는 아래는 오픈소스(무료) 3MB도 ..
Template 스케치로 캐릭터 아웃라인부터 동작표현까지 연필스케치에서 일러스트 아웃라인이 주제입니다. 여러분이 종이에 직접 스케치이미지를 일러스트레이터로 File-Place혹은 Drop Down방식으로 던지듯이 가져와서 별도의 레이어를 구성하고, 스케치 원본이미지가 있는 레이어를 Double Clip하여 레이어 속성창을 열고 레이어 이름을 바꾸거나 항목중 Template를 체크하고 OK를 누르면 템플레이트 레이어가 됩니다. 01. Template 스케치로 캐릭터 아웃라인 작업 Template 레이어를 만든 이유는 연필스케치 원본이미지 위에 몸,얼굴 등 별도 레이어에서 개별적인 아웃라인 작업하는 방법, Fill Color로 채색하고 완성도 있게 그라디언트를 적용하는 방법, 표정의 경우는 심볼로 등록해서 사용하고 복제한 심볼을 교체하는 방법, 손과 발과 같은 긴..

반응형