How to Design a Landing Page in Photoshop – Kickstarter Product

안녕하세요, 제 이름은 Cosmin입니다 오늘의 비디오에서 저는 새롭게 출시 할 회사를 위해 Photoshop 내부의 방문 페이지 디자인 Xook이라고하는 Kickstarter의 제품

이 방문 페이지에서 그곳에 도착한 모든 방문자에 대해 세 가지 주요 질문에 답하십시오 이 제품은 왜 신경 써야하며 누가 사용 했습니까? 이제 Photoshop을 시작하십시오 새 문서를 만드는 것으로 시작하겠습니다 그러나 나는 또한이 16 열 레이아웃을 사용하여 온라인으로 얻게 될 것입니다 링크를 클릭하고 동영상의 너비가 새 문서는 1200 픽셀이며 충분한 공간이 있고에서의 높이를 추가하십시오

최소 5,000 픽셀, 괜찮아요 다음 단계는 새로운 열에서 16 열을 이동하는 것입니다 그룹 전체를 클릭하여 다른 문서로 드래그하면됩니다 Command + T를 눌러 전체 그룹을 변환하고 Alt 키를 누른 채로 나는 그것을 바닥으로 끌고있다 맨 아래 레이어의 잠금을 해제하고 이름을 변경하고 측면과 중심에 몇 가지 가이드를 추가하기 시작하십시오

내가 그것을 한 후에 나는 갈 것이다 이미지 – 캔버스 크기로 1920 픽셀로 설정합니다 나는 배경을 채울거야 흰색은 레이어를 선택하고 Command와 Backspace를 누르고 있습니다 악 확대하고, 확대하고 첫 번째 요소를 추가하십시오

시작하려면 16 열 가이드를 숨기고 새 그룹을 만들고 이름을 지정하십시오 머리글을 배치하고 첫 번째 레이어를 배치하고 내가 일반적으로 무엇을하는지 알 수 있습니다 이 요점은 내 사이에 간격을 유지하는 데 도움이 될 몇 가지 모양을 만드는 것입니다 페이지 전체에서 일관된 요소, 캔버스의 아무 곳이나 클릭하자 사각형의 크기를 설정할 수 있습니다

나는 60 세에 관심이있다 픽셀 높이를 지정하고 맨 위에 놓습니다 멋진 이미지를 얻기 위해 unsplashcom을 사용하고 있습니다 마우스 오른쪽 버튼을 클릭하십시오

이미지 레이어를 선택하고 클리핑 마스크 만들기를 선택합니다 이러한 이미지는 로열티가없고 상업용 프로젝트에서 사용할 수 있으므로 명령을 누른 상태에서 모양 레이어를 클릭합니다 빠른 선택을 만들기 위해 상단에 조절 레이어를 추가하고 그라디언트 맵을 만듭니다 이 기술을 사용하는 나의 목표는 낮은 대비를 얻는 것입니다 페이지의 전체 스타일과 혼합되어 사라지지 않는 이미지 너무 많은 관심을 복사 및 버튼에서

나는 몇 가지로 놀 것이다 내가 좋아하는 것을 발견 할 때까지 나는 파란색의 색조를 띠고 나는 정상을 좋아한다 파란색 요소를 더 많이 돋보이게하기 위해 색상을 적용한 색상으로 변경해 보겠습니다 단추 옆에 새로운 도형을 추가하고 싶지만 먼저 처음에는 가시적으로 만들고 모든 것을 맨 위로 옮기고 싶습니다

그것을 복제하고 초기 모양을 숨긴 후에 나는 기존의 이름을 shape-light로 바꿀 것입니다 Command + T를 치자 모양을 오른쪽 클릭하고 수평 뒤집기를 선택한다 장소는 여기 어딘가에 있고 또한 Shift 키와 왼쪽 하단 모서리를 드래그하십시오 모양 레이어에 특정 색상을 적용하려면 미리보기 이미지를 두 번 클릭하고 밝은 파란색 색상을 추가하고 OK를 누릅니다

이 색상을 저장하고 싶으므로 스포이드를 사용하여 샘플을 만들어 보겠습니다 도구와 견본 패널 안쪽에 새로운 아이콘을 치고 다른 아이콘 뒤에 끌기 요소들, 나는 그 위치에서 100 %가 아니지만, 지금 당장은 그대로 두겠습니다 다음 버튼으로 이동하여 모양을 선택하여 모든 변경 작업을 수행 할 수 있습니다 조금 확대하면, 레이어를 더블 클릭하면 레이어를 더블 클릭하면됩니다 일부 치수 버튼을 클릭하면 스타일이 추가됩니다

먼저 흰색 외부를 추가하겠습니다 글로우, 블렌드 모드가 보통으로 설정되어 있는지 확인하고 싶습니다 색상 드롭 섀도우 추가,이 버튼이 가능하다면이 페이지의 주된 목적은 방문자가 그것 바깥 쪽 광선과 매우 비슷하게 블렌딩 모드를 보통으로 설정합니다 그것의 거리와 크기를 조정하고 마음 속에 명심하십시오

나에게 좋게 보이는 것이 든, 너는이게 좋아 보인다는 것에 동의하지 않을지도 모르지만, 나 야 최선을 다하고 불투명도를 조금 낮추고 다른쪽으로 옮기자 그림자 패널을 선택하고 작은 크기를 선택하십시오 어쩌면 2 픽셀 같은 것을 가지고 불투명도를 증가시킬 수 있습니다 어쨌든 그것을 주목하십시오

내가 축소하고 가이드를 제거합니다 머리글을 볼 수있는 순간,보기 및 선택 해제로 이동할 수 있습니다 엑스트라, 나는 즉시 그 모양이 헤드 라인 위에 있다는 것을 알아 차렸다 그것 뒤에서 움직여 보자 이 섹션에서는 비디오 버튼이있어서 서클을 만들고 추가 할 것입니다

상단 버튼과 같은 스타일링을 클릭하고 레이어 스타일을 마우스 오른쪽 버튼으로 클릭하여 붙여 넣습니다 흰색을 위해 페이지 전체에서 일관된 모양을 유지하려고합니다 지원하는 텍스트 콘텐츠가있는 도형 위에 기울기를 추가해 보겠습니다 왼손쪽에는 펜 도구를 사용하여 우리가 똑같은 각도를 갖도록합니다 거의 똑같지 만 직접 말할 수는 없으며 직접적으로 선택 도구 흰색 모양을 선택하고 경로 모서리를 추가하고 3 개를 추가합니다

픽셀은 잘되어야하며 Shift 키를 누른 채로 아래쪽을 선택합니다 왼쪽 앵커를 드래그하여 오른쪽으로 드래그하면 셰이프가 제거됩니다 더 이상 필요로하고 이것들의 위치와 함께 약간의 조정을하십시오 집단 나는이 배치가 단지 가지고있는 것 이상을 좋아한다

동영상 미리보기 이미지가 더 동적 인 것처럼 보이지만 여전히 재생 아이콘이 필요합니다 확대하고 사각형 도구를 사용하고 Alt 키를 누른 상태에서 클릭하고 드래그하십시오 Shift 키를 누른 상태에서 Command + T를 사용하여 변환하고 45도 회전해야합니다 왼쪽 앵커를 제거하려면 펜 도구를 사용하여 회전하면됩니다 앵커를 클릭하여 제거하고 약간의 조정을하여 아이콘이 원 안에 들어 맞습니다

모양 레이어의 축소판을 두 번 클릭하고 흰색을 샘플링합니다 배경 색상을 선택하고 Command + T를 누르면 원 가운데에 배치됩니다 이 페이지에서 사용 된 모든 아이콘은 Envato 요소에서 다운로드되었으며, 많은 그래픽 애셋을 다운로드 할 수있는 구독권이 있습니다 당신이 원하고 그들이 가지고있는 것이 많아서 그만한 가치가있는 것,이 아이콘들을 배치하는 것 Illustrator에서 Photoshop으로 복사하여 붙여 넣기 만하면됩니다 처음에 나는 이 섹션을 어떻게 보이게 할 지에 대한 매우 거친 생각이지만 이 아이콘을 옆에 놓고 흰색 상자를 너비가 조금 작아 지도록 헤드 라인과 단락을 정렬해야합니다

모양의 내부에서 이제 흰색 모양을 변경할 수 있습니다 나는이 레이아웃을 적용하는 것이 즐겁지 않을지라도이 레이아웃으로 갈 것이라고 생각합니다 상자의 나머지 부분과 같은 간격, 지금은 선택하기 위해 조금 고심하고있다 자물쇠 아이콘으로 색상 오버레이를 적용한 다음 파란색을 사용합니다 내 색상 견본 패널에 저장하고 지문 아이콘입니다

그것을 선택합시다 아마 배경과 같은 색을 가질 것입니다 혼합 모드로 놀고, 곱하기를 선택하십시오 정직하게는하지 않습니다 좋아 보이네요

이전보다 더 좋아 보이지 않는다는 것을 의미합니다 컬러 오버레이 패널을 사용하고 조금 더 어두운 그늘을 찾습니다 나는 특별한 것을하지 않았다 나는 특별한 종류의 것을 사용했다 머리말 이미지와 같은 기법으로 이제는 계속 진행할 준비가되었습니다

마지막 섹션, 우리는 여전히 셰이프를 사용하여 요소들, 미래의 프로젝트에이 기술을 적용 해 주시길 바랍니다 이 행동 촉구에 너무 만족하지 않고 첫 번째 디자인 반복 I 추측은 괜찮아요, 우리는 언제든지 나중에 변경할 수 있습니다 지금은 좀 더 집중하고 있습니다 이를 통해 올바른 메시지를 얻을 수있는 깨끗한 레이아웃을 만들 수 있습니다 난 그냥 하단에 버튼이 있는지 확인하여 여기에 오는 방문자는 행동 할 수있는 방법이 있습니다

나는 또한 어떤 것을 포함시키는 것에 대해서 생각하고있다 공유 링크는 다음과 같은 이유로 관심 분야를 테스트하는 데 사용됩니다 방문객들과 어쩌면 사람들이 그것을 공유하도록함으로써 약간의 추진력을 얻을 수 있습니다 소셜 미디어 방문 페이지에는 추천하지 않으며, 일반적으로 추가하지 않습니다

주요 목표 이외의 종류의 외부 링크를 사용하면 방문자가이 페이지의 땅에주의를 산만하게하지는 않습니다 그것이 더 합리적인 것 같아요 방문 페이지의 최종 모습이 될 것입니다 프로세스와 만약 당신이 같은 버튼을 누르십시오에 가입하는 것을 잊지 마세요 더 궁금한 점이 있으시면 아래의 댓글 섹션에 남겨주세요 그리고 다음 번에 친구들을 돌봐야 할 때까지 도와 줘서 기쁘다

MAGAZINE LAYOUT IN ADOBE INDESIGN TUTORIAL – PHOTOSHOP & INDESIGN – Adobe InDesign Tutorial

오늘 나는 주위에 기초한 튜토리얼을 가지고있다 Adobe InDesign의 잡지 레이아웃 오는 인쇄 및 웹보기 용 바로 지금 어때 사람들은 어서 오세요? 그래픽을 저장하십시오

잘 지내기를 바랍니다 오늘 나는 6 명의 머리에서 움직여야했다 한 주에 간단히 말해서 업로드를 최대 5 회까지 6 일 동안 알맞은 콘텐츠를 만들 수 없다 일주일 거기 그래픽 디자이너 인하는 동안 낮에는 시간이 충분하지 않아서 언제든지 내가 가지 않을거야 오늘 토요일과 일요일에 떠 다니는 그러나 다른 가입자 덕분에 우리가 봤던 제안

기본 레이아웃 및 내보내기로 설계되었습니다 잡지를 사용하는 경우 긴 튜토리얼과 나는 나의 많은 것을 안다 구독자는 할 수 없을 가능성이 큽니다 우리가 자주 디자인 할 수있는 것을 사용하되 좋아한다 다양한 범위의 이 채널의 그래픽 디자인은 당신은 어도비 InDesign의 팬이 아니야

나는 더 많은 일러스트 레이터와 포토샵 튜토리얼뿐만 아니라 많이 파이프 라인에 더 많은 목록이 있습니다 원하는 경우 구석에 시간이 멈 춥니 다 이 튜토리얼의 특정 부분을 참조하십시오 이 튜토리얼이 도움이된다는 사실을 알게되었습니다 아래의 댓글 섹션에서 당신이하지 않은 보안 그래픽을 구독하십시오

이미 앉아서 레이아웃 완료 잡지 / 웹 사용은 천천히 당신이 다른 때 절판하고 선택할 수있는 문서 만들기 웹 사용을 위해 여기에서 생성하십시오 그러나 가장 최근의 웹처럼 설명에 게시 링크 아래에서 프린트 문서를 사용하고 이 잡지의 다음 이유를보아야합니다 나는 지불 할 전형적인 포드를 사용한다 이 경우 여러 연령대로 퍼뜨렸다 인쇄 프로젝트는 나중에 보게 될 것입니다

InDesign 자습서에서 나는 단지 디자인 저는 포토샵에서 일하면서 InDesign에서 텍스트를로드하고로드합니다 이것은 웹보기를위한 것이므로 보는 것은 아닙니다 본문에 대해 걱정해야한다 화면이 흐릿하게 인쇄 됨 리를 사용하여 그것을 염두에두고 만들었습니다 Photoshop의 모든 항목과 전송 된 항목 InDesign에 넘기는 파일 나는 a3 풍경을 만들었을뿐입니다

포토샵에서 300 PPI의 문서 그 다음에 반으로 나눠 줘 내가 한 번 잡지 페이지 크림에 나는 여기에서 일할 수 있었다 잡지 왼쪽 섹션보기 왼쪽 페이지와 오른쪽 보호가 한 번 행복했던 오른쪽 페이지 JPEG로 개별 저장 makanan 디자인 및 상자 도구 사용 파일로 이동하여 내 파일 배치 그 자리에 우리는 웹용 잡지를 내보내고 있습니다 너는 몇 가지 다른 선택이있다 당신이 뭘하고 싶은지에 따라 예를 들어 SWF 파일에는 h2가 있습니다

Sarah와 같은 애니메이션 그러나이 잡지의 클라이언트 대화 형 PDF 버전을 사용하고 싶었습니다 스프레드를 선택하고 모두 JPEG 손실 설정뿐 아니라 나를 위해 잘 작동하는 최대 알파 에있는 링크에서 잡지를 계산했습니다 아래에서 설명 할 내용은 다음과 같습니다 인쇄용 잡지를 만드는 방법 Adobe 조금 더 상세한 InDesign 이제 심층적으로 잡지 레이아웃 용 InDesign 문서 인쇄물은 파일로 이동하고 우리가 분명히 필요로하는 인쇄용 문서 인쇄 옵션을 선택하려면 여기를 클릭하십시오 너가 적합 할 필요가있는 페이지의 수 그러나 당신이되고 싶은 많은 페이지들 잡지는 또한 앞뒤 페이지 삭제를 추가 할 수 있습니다

페이지의 후기 단계에서 쉽게 각 개인의 크기로 넣을 수있다 4 페이지로 나갈거야 오늘과 오리엔테이션에서 나는 가로로 배치하거나 네 개의 열을 묘사 나는 종종 3 권이나 잡지사를 사용하지만 어떤 사람들은 2 개 또는 심지어는 4 개의 열은 완전히 디자이너를 사용하고 싶다면 추가되는 3mm 블리드 전체 문서 주변 측정 값이 9 밀리미터라면 리비아 디자인을 닫아야합니다 다시 열어 맨 위에있는 InDesign으로 이동하십시오 왼쪽 모서리 환경 설정 및 다음 측정 및 증분 InDesign 잡지 문서가 생성되었습니다

그것은 다음과 같이 보일 것입니다 안내하는 페이지의 줄 그들은 인쇄하지 않을거야 그래서 추가 못생긴 페이지는 레이아웃으로 이동 한 다음 여기에서 귀하의 옵션 잡지 디자인에 대한 내 방법 사용 print 나는 CD를 만들 것이다 Photoshop을 사용하거나 이전에 아트 워크를 릴리스하십시오 유형이 아닌 것은 무엇이든 추천합니다 탱크를 추가하려는 로고 및 로고를 Adobe InDesign에 직접 넣으십시오

그때 옛날 품질과하지 픽셀 화되고 인쇄된다 포토샵 나는 a3 문서를 만든 다음 우리는 그것을 90도 회전시킬 것입니다 조경 사건 나는 우리의 300 PPI를 생성했다 그런 다음 가이드를 중간에 추가합니다 하나씩 두 부분으로 나누어 라 VNA 용 그런 다음 가장자리에 가이드를 추가합니다

문서를 6 밀리미터 늘리십시오 각각을 보상 해 줄 것입니다 Adobe InDesign에서 3mm 블리드 프린터의 중앙 집중식 출혈 그들은 외부의 모든 것을 잘라 냈다 주요 콘텐츠 및 출혈 일단 행복하고 나서 각각 자른거야 그들을 평평하게하고 개별 JPEG로 네이티브 InDesign이 상자를 만듭니다

페이지를 가로 질러 이렇게 다음에 가라 제자리에있는 파일 KO 파일 및 그것을 떨어 뜨려 그것에 맞게 그렇게 완벽하게 이 아이콘이 보일 때까지 기다려라 상자 리드 이미지를 복제하려면 여기 다른 쪽 상자 안에 이제 텍스트를 추가 할 수 있습니다 상자 도구를 사용하여 이미지 및 로고 파일 가져 오기 모든 텍스트를 선택하고 너의 앞에 선을 만들기 위해 올라 가라 다른 방법으로 인쇄하려면 파일을 보내십시오

그대로두고 그것을 포장 할 수 있습니다 Adobe InDesign과 함께 글꼴 파일 파일을 내보내거나 인쇄 할 문서 선택한 Adobe PDF 인쇄 및 그런 다음 OK를 누르면 최신 버전 사용 애크로뱃과 이것들은 설정입니다 이 창에서 사용할 압축 나는이 설정을 여기에서 사용한다 고품질 친구를 위해 내가 선택한 자르기 표시를위한 모든 단일 옵션 여기 당신과 이야기하는 것이 가장 좋습니다 이전에 인쇄 회사에있을 수도 있습니다

특정 향수 설정 또는 인쇄 요약 섹션 (있는 경우) 잡지 문서에 관한 경고 완료되면 여기에 표시됩니다 내보내기 및 미리보기가 있어야합니다 그것은 어도비 아크로뱃에서 열립니다 그래서 어떻게 프로모션을 했니? Adobe에서 잡지 레이아웃 만들기 InDesign이 도움이된다면 알려주십시오 아래의 댓글 섹션과 같은 것을 삭제하십시오 이야기 구독하기

내 5 개의 업로드 동영상 중 그래픽이 모두 사라졌습니다 주당 및 다음 번에 디자인 할 때까지 오늘의 특징은

Double Exposure Effect – Photoshop Tutorial

안녕하십니까? 오늘의 비디오에서 이 이중 노출 효과 이미지를 어떻게 만들 었는지 보여 드리겠습니다 여기에서 볼 수있는 어도비 포토샵 사용 좋아, 환상 그래서! IT에합시다! 좋아, 나는 어도비 포토샵을 열어 보겠습니다

내가 사용할 이미지를 가져다가 여기서 열어서 이제 모델을 선택해야합니다 그래서 빠른 선택 도구를 선택하겠습니다 모델 인물을 빠르게 선택하겠습니다 이렇게 그런 다음 빠른 선택을하는 동안 마우스 오른쪽 버튼을 클릭하여 깃털을 선택합니다 여기에 0

5px 깃털을 넣을거야 OK를 누릅니다 좋아, 이제 모델 이미지를 선택하고 CTRL + J를 누를 것이다 이제 새로운 레이어에 추가했습니다 나는 그것을 모델명으로 삼을 것이다

여기에서 이걸 지우겠습니다 좋아, 지금이 이미지의 배경을 더 크게 만들고 우리가 효과를 낼 수있는 충분한 공간을 갖길 원해 그래서 자르기 도구를 선택하겠습니다 여기에서 조금 더 확장 해 보겠습니다 여기도 이 체크 표시를 클릭하여 변경 사항을 적용합니다

좋아, 이제 여기서 조정할거야 솔리드 컬러를 선택하겠습니다 지금은 흰색을 유지하고 OK를 누르면됩니다 나는 그것을 가지고 모델 레이어 아래에 놓을 것이다 배경에 BG로 이름을 지정하겠습니다

좋아, 이제 모델 레이어를 선택하겠습니다 여기는 채도가 없으므로 CTRL + SHIFT + U를 누를 것입니다 또는 다음으로 갈 수 있습니다 : Image, Adjustment and Desaturate 이제, 내가 사용할 두 번째 이미지를 열어 보겠습니다 내가 가져 가서 새 탭에서 열고 여기에있는 다른 탭으로 드래그하겠습니다 나는 그것을 Mountain이라고 부를 것입니다

불투명도를 50 % 정도로 변경하겠습니다 이렇게하면 작업을 시작하기 전에 교체 할 위치를 볼 수 있습니다 이제 이 구름들이 다른 방향으로 있기를 원합니다 그래서 나는 CTRL + T를 누를 것이다 그런 다음 마우스 오른쪽 버튼을 클릭하고 가로로 뒤집기를 선택합니다

이제 나는 내가 원하는 곳에 구름이있습니다 또한 나는이 꼭대기에있는 산 꼭대기를 여기에두고 싶다 그래서 나는 이미지를 더 크게 만들기 위해 shift와 drag를 누를 것이다 그리고 내가 원하는 곳에 이미지를 대치하겠습니다 이 체크 표시를 한 번 클릭하겠습니다

불투명도를 다시 100 %로 변경하겠습니다 이제 모델 레이어를 선택하겠습니다 CTRL을 누르고 모델을 선택하기 위해 그것을 클릭합니다 이제 산 레이어를 선택하겠습니다 그런 다음이 레이어 마스크 아이콘을 한 번 클릭하겠습니다

당신이 볼 수 있듯이 이것은 모델의 실루엣을 생성 할 것입니다 좋아요, 이제이 모델 레이어의 복사본을 만들겠습니다 그래서 나는 ALT를 눌러 사본을 만들어 그것을 산 레이어 위에 올려 놓을 것입니다 Blending 모드를 Lighten으로 변경하겠습니다 우리는 여기에 멋진 효과를 얻을거야

하지만 나는 그것의 불투명도를 약 50 % 이제 레이어 마스크를 적용 해 보겠습니다 그래서 나는 가서이 레이어 마스크 아이콘을 한 번 클릭 할 것이다 여기서 레이어 마스크를 선택하겠습니다 그런 다음 브러시 도구를 선택하겠습니다 불투명도 40 % 검은 색은 내 전경색입니다

이 영역에서 삭제를 시작하겠습니다 좋아, 이제 산 레이어를 선택하겠습니다 그리고 내가 그 레이어 마스크에 있는지 확인하겠습니다 모델의 얼굴을 나타 내기 위해 여기에서 삭제를 시작하겠습니다 좋아요

이제 BG 레이어를 선택하겠습니다 나는 그것을 두 번 클릭하겠습니다 여기에서 색상을 샘플로 채 웁니다 확인을 누릅니다 이제 산 레이어를 선택하겠습니다

CTRL + J를 눌러 복제합니다 레이어 마스크를 가져다가 삭제하겠습니다 나는 그것을 혼합하여 Lighten에 바꿀 것이다 그리고 당신이 볼 수 있듯이 이것은 구름과 함께 멋진 효과를 창출 할 것입니다 이미지에서 볼 수있는 다른 부분이 아직 있습니다

그래서 블랙 레이어 마스크를 적용 해 보겠습니다 내 키보드에서 ALT를 누르고이 레이어 마스크 아이콘을 한 번 클릭하면 이제 내 브러쉬를 선택하겠습니다 내 전경색으로 흰색으로 구름의이 부분 만 볼 수 있도록 여기에서 솔질하기 시작합니다 좋아, 이제이 상단 레이어를 선택하겠습니다 조정하고 단색을 선택하겠습니다

나는 부드러운 핑크색을 고를거야 나는 Ok를 누를거야 블렌딩 모드를 곱하기로 바꿀 것입니다 불투명도를 약 20 %로 설정하겠습니다 이제 스탬프 표시 레이어를 만들겠습니다

그래서 나는 ALT + CTRL + SHIFT + E를 누를 것이다 나는 그것을 desaturate거야 그래서 나는 갈 것이다 : Image, Adjustment and Desaturate 블렌딩 모드를 Soft Light로 바꿀 것입니다 불투명도를 약 30 % 그리고 그게 다야 이 튜토리얼을 마음껏 즐기 셨으면 좋겠습니다 그리고 그것은 당신에게 조금 도움이되었습니다 구독 및 의견을 잊지 마세요

그것을 엄지 손가락으로 보여주고 공유하십시오 더 많은 튜토리얼이 올 때까지 기다린다 사실 다음 튜토리얼에서 여기서 내가 볼 수있는 다른 이중 노출 이미지를 어떻게 만들었는지 보여 드리겠습니다 다 좋아 시청 해주셔서 감사합니다 좋은 하루 되세요

Creating a wireframe in photoshop

일반적으로 내가 수업을 가르 칠 때마다 내가 가르치고 싶은 첫 번째 일 중 하나입니다 학생들은 일을 할 수있는 적절한 순서입니다

번역하는 방법 웹 디자인에 들어가기 위해서는 먼저 와이어 프레임을 작성한 다음 다음 단계로 넘어가 야합니다 우리가 스토리 보드에서 작업 할 단계 디지털 콤포넌트라고도합니다 스토리 보드 색상 및 기본 그래픽을 포함합니다 이것이 바로 와이어 프레임과 분리되는 이유입니다

와이어 프레임 일반적으로 회색조입니다 그런 다음 이미지와 사본을 포함하는 자산을 수집하고, 텍스트라고도합니다 마지막 단계는 페이지를 만드는 것입니다 그래서 그것은 조준 사격 준비 이제 학생들은 자주 페이지를 만들고 처음으로 이 다른 일을하기 위해 다시

그리고 그것은 전혀 말이되지 않습니다 이것이 올바른 주문입니다 페이지를 만들 수 있습니다 그래서 우리가 할 일은 우리가 가고 있다는 것입니다 이걸 죽여라, 나는 연습을 해왔다

와이어 프레임을 만든다 그리고 와이어 프레임은 청사진과 같습니다 집을 위해서 우리는 Photoshop에서이 작업을 수행 할 것입니다 내가 포토샵으로 녹슨 것 같아

일반적으로 Fireworks에서이 작업을 수행했습니다 그리고 이것이 선호되는 도구였습니다 그러나 어도비는 크리 에이 티브 클라우드에서 Fireworks로 전진하지 않으므로 새로운 도구를 배우게 될 것입니다 이 작업을 수행 그리고 우리는 새로운 와이어 프레임을 만들 것입니다

저는 이것을 "위젯"이라고 부를 것입니다 내 가짜 회사가 위젯을 판매 할 것입니다 그리고 나는 칠거야 승인 내 너비는 1024 x 768 픽셀입니다

그렇게 나쁜 시작은 아닙니다 그리고 대개 저는 이것을 설정할 것입니다 배경색을 흰색 또는 검은 색으로 바꾼 다음 상자를 그릴 것입니다 그리고 각 상자 div를 나타낼 것입니다 그래서 나는 모든 것을 그레이 스케일로 만들 예정입니다, 그래서 저는 가고 있습니다

회색 음영을 선택하고 OK를 누릅니다 그리고 직사각형 툴을 선택하려고합니다 960 픽셀 너비로 설정하려고합니다 이것은 컨테이너의 매우 일반적인 너비입니다 과 내 키가 750이 될거야

나는 괜찮을거야 그런 다음 드래그 정렬을 할 것입니다 그 자리에 그리고 내 통치자가 있다는 것을 알게 될 것입니다 저는 여기 픽셀에 있습니다

나는 기본적으로 일종의 센터에 노력하고 있습니다 나는 모두 밖으로 나가고 완벽하게 센터에 갈 수 있었다 그것은, 내가하고있는 일을 위해 정말로 필요하지 않습니다 그런 다음 레이어 이름을 지정하고 그 (것)들과 함께, 나는 전형적으로 그들을 잠글 것이다 좋아, 내 다음 단계는 헤더

그리고 당신은 컨테이너 주위를 조금만 보면서 그렇게 할 수 있습니다 그것 또는없이 일반적으로 어느 방향 으로든 갈 수 있습니다 나는 약 5 픽셀의 마진을 남길 것이다 당신이 그것이 다른 것을 볼 수 있도록

나는 밝은 회색 음영을 고를거야 여기서는 상자를 선택하겠습니다 높이를 120 픽셀로 950 너비로 만들 예정입니다 하락 그곳에 채우기가 정말 행복하지 않습니다 더 가볍게 만들어 봅시다

좋아, 꽤 예쁘다 좋은 헤더를 어디에 놓았는지 이동 한 다음, 화살표 키를 여기에 넣으세요 그래서 그것은 헤더를 나타낼 것입니다 그리고 다시 div가 가질 이름입니다

좋아요, 그리고 다시 잠글 수 있어요 그럼 내가 갈거야 새 사각형을 만들려면 다시 950으로 만들고 바닥 글을 작성해야합니다 짧게, 우리는 90 분에 그것을 만들 것입니다 나는 OK를 칠 것입니다

나는 그 색으로 괜찮아 그리고 이것은 다시 한번 나타납니다 이것은 내가 어떻게 필자의 헤더를 셋업 할 것인지, 내 꼬리말, 모든 다른 부분들 그래서 당신이 일을 할 때 div가 나타납니다 프로그램 작성

그래서 이것은 바닥 글이 될 것입니다 그리고 당신의 임무를 위해 당신은 첫 번째 것과 똑같은 것 당신은 당신을 창조하는 프로젝트를 가질 것입니다 자신의 와이어 프레임 그래서 이것은 단지 그것을하는 법을 배우는 것입니다

그래서 너는 똑같이 만들거야 내가하고있는 하나 따라서 머리글과 바닥 글을 사용하여 2 열로 디자인하고 있습니다 그래서 나는 갈거야 여기에 다른 것을 넣으려면 160 픽셀 너비로 만들어야합니다

그것을해라, 지금 나는 실제로 수학을하고, 내가 지금까지 골랐던 것을 기억하려고 노력해야한다 하자 600 픽셀을 말하십시오 아마 그럴 것 같지 않습니다 그러나 그것이 무엇인지 보자 보이는구나

일반적으로, 저는 이것을 종이로하고 실제로 알아낼 것입니다 수학 좋아요, 그래서 그것은 적당한 크기가 아닙니다 그래서 저는 변형 컨트롤을 보여주고 싶습니다 그리고 나는 그것을 일종의 장소로 밀어 넣을 것입니다

좋습니다 꽤 좋습니다 좋아, 그리고 나서 내 사이드 ​​바 또는 nav 섹션과 같을 것입니다 나는 그것을 벗을 것이다 대다 변환

그래서 저는 그 사이드 바를 호출 할 것이고, 나는 계속해서 그것을 잠글 것입니다 나는 계속 가서 바닥 글을 잠글 것이다 나는 그들 위에 더 많은 것들을 넣을 것이다 그러나 나는하지 않을 것이다 다시 그걸로 돌아 가라

그리고 나서 새로운 직사각형을 넣을 것입니다 820×570으로 시작하는 곳입니다 그것을 제자리에 옮기고 컨트롤을 변형 시키십시오 너가 그건 내 divs를 나타냅니다

그래서 저는 이것을 메인 컨텐츠 또는 메인이라고 부를 것입니다 그리고 그것들 내 div id 될 것이다 그리고이 모든 것을 집어 폴더에 넣는 것이 때로는 편리 할 때도 있습니다 그게 효과가있을 거라 생각 했어 나는 이것을 잘 조직하는 경향이 있습니다

그리고 그것들은 내 사업부 그래서 지금은 다양한 콘텐츠가 있습니다 좋아요 그래서 여기에서 나는 다른 것을 나타낼 것입니다 다른 방식으로 주로 선과 직사각형으로 주로 작업하겠습니다

이제 텍스트를 사용하십시오 헤더가 어떻게 될 것인지 또는 텍스트가 어떻게 될 것인지 알고있는 경우 나는이 시점에서 폰트에 대해 정말로 걱정하지 않는다 나는 Verdana에서 모든 일을한다 왜냐하면 그건 정상입니다 보통입니다

당신은 또한 잠재적으로 대담하게 할 수 있습니다 그래서 나는 이걸 월리 위젯이라고 불러 그것이 우리 회사의 이름입니다 이것은 실제로 배치에 관한 것입니다 이제 저는 기본 버튼을 넣기를 원할 것입니다

우리는 실제로 모양에 대해 걱정하지 않습니다 여기에 버튼이 있습니다 그래서 여기에 다른 직사각형을 넣을 수 있습니다 또는 좀 더 단추 모양으로 보이게하려면 둥근 사각형을 사용합니다 이것들은 버튼을 나타낼 것입니다

나는 사실 그걸로 괜찮습니다 그리고 나서 나는 내가 그곳에서 한 것은 Alt와 화살표 키를 사용하여 복제했습니다 Alt, 화살표 그래서 나는 네 여기 단추 그리고 나는 좀 더 많은 시간을 할애 할 것입니다

하지만 나는 그것들은 기본적으로 내가 원하는 곳입니다 그래서 나는 그들을 어디서 적절히 배치 할 것인가? 나는 그들을 원해 그리고 당신이 원한다면 당신은 더 많은 시간을 들여서 정말로 완벽하게 정렬 될 수 있습니다 슈퍼 중요하지 않습니다 나는 단지 기본 배치를 찾고있다

그러나 이것들은 버튼이 될 수 있습니다 그리고 실제 네비게이션을 위해서는 한 단계 더 나아가고 실제로 텍스트를 넣을 것입니다 이것들 중에서 12 포인트 글꼴을 사용해 봅시다 홈으로 말하면, 움직일 수 있습니다

승인 그리고 다시, 당신은 이것을 평평하게 할 것입니다, 우리는 실제로 이것을 취하지 않을 것입니다 이런 식으로 그래서 나는 텍스트를 포함시킬 것이다 그래서 여기서 주목할 것입니다

내가 그걸 멈추었 어 비디오로 전송하고 빨리 전달했습니다 내 버튼을 얻는 데 약간의 문제가있었습니다 일하다 우연히 버튼 심볼 뒤에 텍스트를 넣고있었습니다

당신은 무엇을 볼 수 있습니다 거기에 이 부분을 위해 내가 원하는 것은 4 개의 단추 모양을 만드는 것입니다 그 위에 레이블을 붙여 놓은 것과 같은 방법으로 레이블이 붙은 텍스트를 그 위에 놓습니다 홈, 제품, 연락처 등이 포함되어 있습니다

당신은 웹 페이지에서 가지고있을 것입니다 접촉 좋아, 그럼 그 사람들이 내 단추가되어야하고, 다시, 당신은 이것을 잠글 수 있지만 나쁜 생각은 아닙니다 폴더로 정렬 할 수 있습니다 도대체 무엇이 당신은해야합니다

그래서 당신은 이것들을 가질 것이고, 당신이 원한다면 조금 더 좋아 보이게 할 것입니다 나는 그냥 물건을 가져갈 곳을 보여 주려고 그래서 내가 할 다음 일은 이미지를 추가합니다 그리고 일반적으로 직사각형이나 정사각형을 넣어 이미지를 표현합니다 일반적으로 흰색 채우기가됩니다

나는 일반적으로 이것에 검은 획을 붙인다 3 점은 괜찮습니다 그리고 저는 일반적으로 사각형에 넣을 것이고, 저는 라인 도구를 사용할 것입니다 그것은 채움이 없어야합니다, 검은 색 스트로크, 3 점, 괜찮습니다 그리고 일반적으로 x와 그 이미지를 나타냅니다

나는 그것들을 그룹화하기 위해 G 명령을 사용할 것이다 Mac 그래서 표현과 이미지가 실제 단어입니다 자네가 알고 있다면 귀하의 링크, 로컬 링크가 있다면, 당신은 여기에 넣을 수 있습니다 또는 당신은 단지 링크를 말할 수 있습니다 그런 다음 조금 더 크게 만들 수 있습니다

그리고 Alt 키와 화살표 키를 사용하여 사본을 만든다 이제 당신은이 링크들이 실제로 될 것이라는 것을 안다면 실제 말 이것에 대해서 우리는 여기에 링크가있을 것만 큼 단순합니다 꼬리말 나는 보통 102 Main Street이라는 주소를 붙인다 어떤 마을, 일리노이 60000

그리고 당신은 사이트를 넣을 수도 있습니다 지도 또는 연락처, 여기에 무엇을 넣을 지, 연락처 정보, 전자 메일, 다양한 소지품 그리고 저는이 페이지의 주요 부분에서 대표자입니다 나는 이것을 취할 수도있다 여기에 그룹화하고 복사하십시오 그리고 나는 그것을 움직일 수 있고 그것은 페이지의 다른 곳에 이미지가 될 것입니다

그래서 당신은 귀하의 페이지에 게재 할 하나 이상의 이미지 그래서 나는 보통 내가 만들 때마다 다른 이미지, 나는 더 많은 것을 끌어 올 것이다 그래서 여기에 몇 장의 이미지가있을 수 있습니다 텍스트, 텍스트 나는 보통 선으로 만 나타내며 그저 선을 그릴 것이다 그리고 Shift 키를 누르면 도움이됩니다

랩톱의 터치 패드가 가장 쉽지는 않지만 그것은 잘 작동합니다 그리고 마지막에 가서 곧게 뻗을 시간을 조금 가져야합니다 이것들을 정렬하십시오 그러나 이것들은 단지 단락을 나타냅니다 어떤 사람들은 그리스 문자를 사용합니다

나는 심지어 내가이 지점에 들어가기를 좋아하지도 않는다 나는 단지 대표한다 텍스트가 어디로 갈지를 나타냅니다 이 선을 선택하고 모두를 만드는 것은 나쁜 생각이 아닙니다 하나의 모양

나는 그걸로 괜찮아 당신이 원한다면 당신은 이것을 깔끔하게 할 수 있습니다 이 지점에서 그러나 그것은 나의 단락을 대표합니다 그래서 나는 기본적으로 너를 보여주는 와이어 프레임을 가지고있다

이것은 텍스트, 이미지는 여기에, 이미지는 여기로, 이미지는 일반적으로 아이콘이 여기로 갈 것입니다 귀하의 버튼이 여기에 적절한 텍스트와 함께있을 것입니다 꼬리말에 적절한 텍스트 링크가 여기에 있습니다 그리고 이것이 당신이 취할 것입니다

너의 클라이언트와 너는 이것에 서명하는 그들을 얻을 텐데 이 페이지에 그리고 당신은 당신이 가지고있는 페이지의 각 유형에 대해 보통 하나를 할 것입니다 따라서 15 개의 제품 페이지가있을 수 있습니다 모두 동일한 방식으로 레이아웃됩니다

제품 페이지를 대표하는 하나의 와이어 프레임을 만든 다음 각 제품 페이지를 대표하는 와이어 프레임을 만듭니다 같은 기초 그래서 나는 이것을 구할 것이다 그리고 괜찮습니다 저는 그것을 위젯으로 저장할 것입니다

Web Design Tutorial For Beginners Using Photoshop

안녕 얘야, 내 이름은 Cosmin이고 오늘의 비디오에서 나는 내가 어떻게 보여줄지 방문 페이지를 재 디자인했습니다 이 프로젝트는 SEO 대행사를 위해 완료되었습니다

그것은 꽤 큰 고객들과 함께 일했고 그들에게 몇 가지 새로운 단서를 얻으십시오 그들이 가진 것과는 완전히 다른, 여기에 몇 가지 비트와 조각이 있습니다 요약하면 방문 페이지는 매우 인상적이며 더 자세하고 자세하게 보입니다 사람들이 그것에 착륙 할 때 우리가 Google의 1 페이지에 귀하의 브랜드가 있으므로 새로운 색상을 시도해보기로했습니다 자신의 브랜드에 맞는 독특한 스타일을 개발하십시오

Photoshop으로 건너 뜁니다 이미 초기 디자인을로드 한 상태이며 방문 페이지이므로 외부 링크를 제거하고 방문자가 더 쉽게 몇 가지 양식 필드를 제거하여 정보를 제출하십시오 이제는 한 번 방문객이 정보를 입력하면 나머지 정보가 수집되는 두 번째 페이지로 리디렉션됩니다 이것은 약간의 마찰을 줄이기위한 것입니다 끝 부분에 단추 만 보관합니다

클릭하면 페이지 상단으로 돌아가고 선택 도구 나는 원했던 내용 만 보관하고 일을 시작했습니다 콘텐츠의 느낌을 얻기 위해 저 충실도 와이어 프레임 나는 조금 봤어 흥미로운 색 구성표를 찾고이 두 색과 글꼴을 선택하십시오 페이지에 대한 액막이

당신이 말할 수 있듯이 나는 그 색상을 적용하고 콘텐츠에 대한 스타일을 변경하고 모든 텍스트 요소를 바꿔서 이제 가야합니다 각 섹션에서이 디자인을 작동시키기 위해 내가 한 일을 보여 드리겠습니다 헤더 영역에서 나는 내 아이디어와 일치하는 그래픽을 디자인했습니다 독특한 시각적 스타일을 가지고 있으며,이 작은 화살표를 통합했습니다 여기에서 Illustrator 내부에서 열고 구조를 확인해 봅시다

보시다시피 저는 오른쪽과 왼쪽에 두 개의 기본 도형이 채워져 있습니다 그들 위에 나는 블렌드를 사용하여 완성 된 이러한 물결 모양의 패턴을 가지고 있습니다 수단 좀 더 재미있게 만들기 위해 작은 둥근 모양도 추가했습니다 어떤 성격을 부여

그 파도를 만들려면 펜 도구를 선택하십시오 캔버스 바닥에 작은 모양을 만들면 모든 종류의 임의가 될 수 있습니다 모양과 우리는 우리가 위에 놓을 더 큰 것을 위해 같은 것을 할 필요가있을 것이다 그만큼 펜 도구를 사용하여 똑같은 작업을하고 몇 개의 앵커 포인트를 드래그하면됩니다 우리는 그 들판이 비어 있는지 확인해야하고 색깔이있다

개요, Object – Blend – Blend Options로 이동하여 원하는 단계 수, 확인을 누르고 다시 돌아가서 "만들기"옵션을 선택하면 물결 모양이됩니다 모양과 그것이 직접적으로 살고있는 한 그것은 완전히 조절 가능합니다 선택 도구를 사용하면 앵커를 선택하고 이동할 수 있습니다 결과 그것을 선택하고 삭제하고 Photoshop으로 다시 이동하십시오

이 섹션의 경우 나는 방금 Spotify 로고의 일부를 지키고 그 밑에 렌더링 모양을 추가했다 텍스트, 모든 것을 일관되게 유지하기 위해 동일한 색상을 사용하십시오 물론 당신은 당신이 좋아하는 모든 변경을 할 수 있습니다 이제 다음 단계로 넘어 갑니 다 팀 섹션에서는 다시 같은 스타일을 유지하는 거대한 모양을 만들었습니다

이제 레이어를 찾고 여기 어딘가에 있어야하고 클리핑 마스크를 만들어 이미지가 다른 이미지 위에 쏟아지지 않도록하십시오 섹션을 만들었지 만 먼저 표시해야합니다 상단의 이미지가로 설정됩니다 오버레이가 매우 낮고 불투명도가 낮습니다 방문 페이지의이 부분에 대해 거의 두 번째 섹션에서했던 것처럼 반복되었습니다

실시간으로 조정하거나 애니메이션을 적용 할 수있는 자유형의 아이디어 버전의 디자인 마지막 섹션에서는 다시 비슷한 모양의 사용자 정의 모양을 만들었습니다 팀 섹션, 이번에는 파란색 만, 옆에 웨이브 패턴과 커플 이 방문 페이지를 끝내기위한 둥근 모양의 결국이 프로젝트는 꽤 흥미로운 점은 클라이언트가 뭔가 다른 것을 원했기 때문입니다 이전에 사용하고 있었기 때문에 나에게 많은 창조적 인 자유를주었습니다 이것이 디자인의 최종 모습, 만약 당신이 좋아하는 비디오를 좋아하는 것을 잊지 마세요 버튼을 클릭하고 더 많은 것을 구독하십시오! 소스를 다운로드하려는 경우 Photoshop 파일의 경우 다음 설명에서 다운로드 링크를 찾을 수 있습니다

시간 보내라, 얘들 아, 안녕!

Photoshop Responsive Web Design Tutorial – Understanding Mobile & Tablet Design 7/48

안녕, 유튜브! 내 이름은 댄이고 이것은 무료 동영상 중 하나입니다 그것은 내가 가르치는 코스의 일부입니다

그래서 당신이 좋아하면 설명에 링크가 있습니다 그러나 지금은 우리가 가진 것을 무료로 보자 적응 형 웹 디자인은 웹을 변경하는 방법입니다 브라우저의 크기에 따라 여기 당신은 Smashing Magazine을보고 있습니다

Smashing Magazine은 자주 읽는 웹 사이트입니다 나는 그들이 다른 페이지를 재 설계하려고 노력한 것을 좋아한다 브라우저의 크기에 따라 다릅니다 이제는 iMac과 같이 매우 큰 화면을 보게 될 것입니다 또는 매우 높은 정의를 지닌 매우 큰 모니터 인 4K 모니터입니다

왼쪽에는 메뉴와 탐색 하위 메뉴가 있으며, 주요 내용 및 광고, 하지만 정상적인 데스크톱에서 볼 때 줄어들면 당신은 그들이이 탐색 바를 바꾸는 것을 볼 것입니다, 주요 내용 및 광고 그러나 작아지면 타블렛을 보자 조금 변경 : 광고를 제거, 탐색 모음이 작아집니다 모바일 용 뷰로 축소하면 다시 변경됩니다 Photoshop에서 디자인 할 때 고려해야 할 사항은 무엇입니까? 그것은 정적 매체이며, 확장 가능하거나 신축 적이 지 않다는 것입니다

당신이 웹 페이지에서 얻는 것과 같습니다 Photoshop에서 프로토 타입을 요약 할 때 디자이너가 수행하는 작업 다른 시각을 디자인하는 것입니다 그래서 개발자에게 넘겨줌으로써 모바일로 바뀌면 사이트가하는 일을 알고, 메뉴가 태블릿보기에있을 때 어떤 일이 발생합니까? 모든 질문은 스케치에서 대답해야합니다 우리는 많은 의심들이오고가는 것을 원하지 않습니다 개발자와 사용자간에 문제 해결을 시도합니다

개념화 단계에서 해결되었을 것입니다 그리고 이것은 적응 형 웹 디자인에 대한 빠른 소개였습니다 공유하고 싶기 때문에이 무료 동영상을 만들었습니다 비록 내가 당신이 풀코스 과정을 계속하기를 원한다면, 50 개 이상의 동영상이 있습니다 설명에 할인 코드가 있습니다

제발, "좋아"하고 구독하십시오 나중에 YouTube에서 멋진 사람들과 만나십시오 나는 내 손으로 작별 인사를하고 있지만, 너는 그것을 보지 못했다 그렇지?

Photoshop CC 2015 Tutorial: What is Technically Possible in Web Design | Adobe tutorial 2017 16/48

안녕, 유튜브! 내 이름은 댄이고 이것은 무료 동영상 중 하나입니다 그것은 내가 가르치는 코스의 일부입니다

그래서 당신이 좋아하면 설명에 링크가 있습니다 그러나 지금은 우리가 가진 것을 무료로 보자 이 비디오에서 우리는 우리를 도울 수있는 것들을 볼 것입니다 우리가 Photoshop 후에 웹을 만들 때 Photoshop에는 무한한 가능성이 있습니다

우리는 음영이있는 그라디언트를 가질 수 있습니다 유니콘과 모든 종류의 물건을 날고 불에 태워라 우리는 포토샵에서 그렇게 할 수 있습니다 그것은 그러한 종류의 프로그램입니다 하지만 웹 디자인에 관해서는 꽤 제한되어 있습니다

코드에 의해 웹에 어떤 것들이 놓일 수 있는지에 관해서 무엇보다도 브라우저에 달려 있으며 브라우저의 나이는 얼마입니까? 그것이 견딜 수있는 것과 불가능한 것 유니콘 비행? 아니요, CSS 기능은 없습니다 그러나 그라데이션 및 평행 음영을위한 함수가 있습니다 우리는이 웹 사이트 "caniuse

com"을 사용할 수 있습니다 이 유형의 페이지가 더 있습니다 나는 이것을 좋아한다 그래디언트를 사용한다고 가정 해 봅시다 그라디언트를 쓸 때 CSS 그래디언트 Opera Mini를 제외한 모든 제품에서 작동합니다

Opera Mini와 호환되는 경우 그라디언트를 사용하여 재검토하십시오 그라디언트는 지금 스타일이 아니고, 평면 디자인이 수행되고, 그래디언트가 필요하다고 상상해보십시오 Opera Mini와 호환되어야하는 경우 당신은 CSS 그래디언트없이해야 할 것입니다 당신이 알아야 할 또 하나의 것은 이전 브라우저와 호환되어야하는 경우 웹 사이트를 만들고 표준이 호환 가능한 경우 적어도 Internet Explorer 9에서는 CSS 그래디언트가 없습니다

그것은 당신이 그들을 사용할 수 없다는 것을 의미하는 것이 아니라 단지 나타나지 않는다는 것을 의미합니다 그래디언트를 적용하지 않으면 평평한 배경을 만들 수 있습니다 일반 배경색과 아무런 일도 일어나지 않는다 그것은 배경에 있기 때문에 중요하지 않습니다 우리는 그림자를 찾을 것입니다

몇 가지 유형의 그림자가 있습니다 상자의 그림자 : <div> 태그의 측면에 매달려 있습니다 그들은 일률적으로 작동합니다 문자 그림자를 보자 IE 9와 호환되지 않습니다

결정할 수 있기 때문에 이것은 더 중요합니다 흰색 배경에 밝은 파란색 텍스트가, 그 뒤에 그림자가 있지 않으면 완전히 읽을 수 없습니다 당신은 그 그림자를 가지고있어서 당신은 텍스트를 읽을 수 있습니다 그리고 그것은 Internet Explorer 9에서 일어날 것입니다 흰색 배경에 흐리게 표시된 텍스트가 표시됩니다

이것은 더 중요합니다 이 사이트를 한번보세요 웹 사이트에서 무언가를 할 수 있는지 묻는 질문 : "사용할 수 있습니까?" 웹의 또 다른 특징은 다음과 같습니다 여기에서 나는 내가 아일랜드에 있다는 것을 발견한다 그것은 내가 지금 녹음하고있는 곳이다

가져 오기를 클릭하면 다음과 같은 메시지가 나타납니다 기본적으로이 데이터는 나에게 글로벌 데이터를 제공하며 현재는 아일랜드의 데이터를 제공합니다 전 세계적으로 90 % 호환되는 것을 볼 수 있습니다 아일랜드에서는 97 %가 호환됩니다 전 세계에는 모든 국가가 포함되며 아일랜드 최신, 기술적으로, 현재 브라우저 및 컴퓨터와 더 많은 호환성이 있습니다

개발 도상국을 위해 특별히 웹 사이트를 만드는 경우 당신은 여기서 매우 다른 비율을 가지게 될 것이고, 그것은 훨씬 더 작아 질 것입니다 이 기능 중 일부는 여기에서 사용할 수 없습니다 그리고 이것은 "사용할 수 있습니까?"웹 사이트였습니다 공유하고 싶기 때문에이 무료 동영상을 만들었습니다 비록 내가 당신이 풀코스 과정을 계속하기를 원한다면, 50 개 이상의 동영상이 있습니다

설명에 할인 코드가 있습니다 제발, "좋아"하고 구독하십시오 나중에 YouTube에서 멋진 사람들과 만나십시오 나는 내 손으로 작별 인사를하고 있지만, 너는 그것을 보지 못했다 그렇지?

Photoshop CC 2015 Web Design Tutorial – How to Used Measuring & Spacing Tools Part 10/48

안녕, 유튜브! 내 이름은 댄이고 이것은 무료 동영상 중 하나입니다 그것들은 제가 가르치는 전체 코스의 일부입니다

그래서 당신이 좋아하면 설명에 링크가 있습니다 그러나 지금은 우리가 가진 것을 무료로 보자 이 비디오에서 우리는 규칙과 측정 도구에 대해 이야기 할 것입니다 우리는 두 가지 이유로 그것을한다 : 우리는 상자들 사이에 공백이 같기를 원하기 때문에 또한 웹을 만드는 사람이 우리가 아니라면, 물건이 얼마나 멀리 있는지 알 수있는 조치를 원할 수 있습니다 또는 객체간에 얼마나 많은 공간이 있는지 확인합니다

공식적인 방법과 내가 사용하는 방법은 두 가지가 있습니다 공식적인 방법은 규칙을 사용하는 것입니다 규칙은 스포이드 아래에 숨겨져 있습니다 클리 코, 나는 여기있다 나는 규칙을 선택한다

이 상자와 아래 상자 사이의 거리를 측정한다고 가정 해 봅시다 내가하는 일은 클릭하고 잡고 쥐는 것입니다 왼쪽에는 응용 프로그램 표시 줄, 나는 그것을 끌 때 측정치가 변한다 기본적으로, 그래서 내가하는 일은 교대를 유지하는 것이다 이 수직 위치에 고정시킨다

이 둘 사이에 77 픽셀로 고정되어 있습니다 이제 우리는 그것이 아주 가깝도록하기 위해 좀 더 가까이에 있습니다 왜냐하면 내가 멀리서 한 것처럼 완벽하지 않기 때문이다 클릭하고 고정하고 드래그하여 문제를 해결합니다 이제 81 픽셀을 갖습니다

이것은 공식적인 방법입니다 이제 규칙을 제거 할 것입니다 Command 또는 Control과 Minus를 눌러 이동합니다 이것이 공식적인 측정 도구이며, 그러나 더 나은 것은 Rectangle을 사용하는 것입니다 이것은 페이지의 사물 가장자리에 붙어있는 장점이 있습니다

우리가 약간의 조정을하기 전에 규칙이 잘 측정되었는지 확인하십시오 그래서,이 거리를 측정 할 것입니다 클릭하고 드래그합니다 사방에 나타나는 분홍색 선을보고, 그것은 그가 문서의 여러 가지와 정렬하려고하기 때문입니다 내 물건에는 여러 가지 요소가 있습니다

그러나 가장자리에 아주 잘 붙어 있습니다 나는 그것을 아래로 끕니다 나쁘지는 않지만 81 픽셀을 사용했습니다 나는 그것을 다시 확인하기 위해 접근 할 것입니다 그것은 붙어있다

사각형은 공간 객체에도 매우 좋습니다 나는 이것을 지울 것이고 나는 조금 떠날 것입니다 그리고 나는 스페이스 바를 눌러 내려 간다 클릭하고 드래그합니다 여기서 포트폴리오를 확대 / 축소 해 보겠습니다

여기에는이 두 객체 사이에 공간이 있습니다 열 너비를 사용하고 있습니다 Vista> Show로 이동하면 가이드가 활성화됩니다 내가 열 사이의 공간을 사용했다는 것을 알 수 있습니다 이제는 여기의 간격이 동일한 지 확인하고 싶습니다

그것이 완벽하지 않다는 것이 분명합니다 사각형을 사용하고, 클릭하고, 누르고,이 둘 사이를 드래그 할 수 있습니다 그것이 가장자리에 붙어있는 것을 볼 수 있습니다 하지만 나는 그것이 완벽한 광장이되기를 원한다 그래서 편집> 뒤로에서 되돌릴 것입니다

직사각형을 그릴 때 Shift 키를 누릅니다 한계가 차단되었습니다 30×30 픽셀이라는 것을 알 수 있습니다 이제 이동 도구를 사용합니다 클릭하고 누른 채로 끌어서 구분 기호로 사용합니다

나는 그것을 하단 가장자리에 붙이고이 이미지를 업로드합니다 때로는이 경우처럼 붙지 않습니다 당신이 할 수있는 것은 키보드의 화살표를 사용하는 것입니다 업로드에 사용하겠습니다 사각형은 알아야 할 좋은 방법입니다

이러한 이미지와 아래 이미지의 내부 여백이 동일한 경우 유일한 결점은 그들이 육체적이라는 것입니다 즉, 인쇄가 가능하거나 스케치에 나타납니다 따라서 완료되면 레이어 패널에서 선택하고 지우십시오 이것이 포토샵에서 측정되는 방식입니다 공유하고 싶기 때문에이 무료 동영상을 만들었습니다

비록 내가 당신이 풀코스 과정을 계속하기를 원한다면, 50 개 이상의 동영상이 있습니다 설명에 할인 코드가 있습니다 제발, "좋아"하고 구독하십시오 나중에 YouTube에서 멋진 사람들과 만나십시오 나는 내 손으로 작별 인사를하고 있지만, 너는 그것을 보지 못했다

그렇지?

Apresentação e Introdução – Curso Photoshop para Web Design – Aula 1 – Alan Mosko

안녕하세요, 웹용 포토샵 과정에 오신 것을 환영합니다 저는 Alan Mosko입니다

2 년간의 공기만을위한 디자인 며칠을 생산할 것입니다 대 수도원의 주요 도구 인 유명한 도구에 대해 다큐멘터리 번역에서 너에게 잃어버린 후에 dilma는 시스템 요구 사항이 무엇인지 선택 사항입니다 세상은 그의 단극을 높이 평가합니다 또는 그렇게 가자 나는 무엇을해야합니까? 사용자를 가능하게하는 강력한 도구입니다

다양한 이미지를위한 madiba 이미지 이 삽화의 응용 웨버 9 월에 그는 탱크를 말했다 포괄적 인 가상 핀토 도구 세트가 있습니다 두려움은 줄이는 모든 일을 돕는 것에 대한 고팔 45 일 디폴트 스테이션은 psp에 의해 채택되었다 별거는 어떤 도시든지 등대를 가진 모양의 한개이다 그래야 코사가 아니야 우리 경제는 단지 50 개만 사용되는 모든 요구 사항을 만들고 있습니다

사실 밴드 19 세 sesi 2014 버전에서 다른 존재하는 것 외에도 적어도 하나의 뿐만 아니라 1 4 윈도우 7 keila regina 더 많은 120 분의 4 분은 기본적인 것입니다 약속하다 그는 그녀도 그렇게 생각하고있다 이 눈을 일곱 살로 시험하다 더 많이 행동해야한다 지금 6 명의 상인이 보유하고 있으면 fatima의 공평하지 않을 것이다 안정적으로 분리되어 있고 무료로 인용 됨 30 일에서 너를 막을거야

상원 의원이 나아갈 것이라고 그에 따라 포토샵 그리고 지금 그가 원하는 건 알지만 재판 버전 그녀는 여기에서 묻고있다 계약이 없다면 더 많은 것을 요구할 생각입니다 정보는 채팅입니다 들린 후 오늘의 좋은 부분은 농장에서 어디 클라이언트 이미 유효 해지고있는 시리아에서 그것이 설치를하는 방법을 보여주는 tanabata 일 것으로 예상되었던 것에 따라 그러나 그들이 인정되면 다운로드 및 고통 이슈가 컴퓨터에 있었다 지금 다른 점은 포토샵이기 때문에 좋을 것입니다

시작하고 싶은 사람의 머리를 처음으로 통과하는 것 그 지역의 연구가 홉을 만든다 다음 질문입니다 오늘날의 걸출한 시장만큼 좋은 프로그램 미국과 중국 차이점은 무엇입니까? 나는 커피를 만든다 때로는 두 가지 유형의 이미지에 대해 먼저 이야기하겠습니다

둘은 벡터 이미지와 매트릭스 이미지가 더 많습니다 이러한 조치들 벡터는 곡선과 기하학적 인물로 구성됩니다 품질을 유지하지 않고도 확대 및 축소 할 수 있습니다 cavs 승리를 시도하자 그가 말한 것을 볼 수 있니? 등반 편차가 있으므로 약간의 왜곡이 있습니다

벡터 동물로 작업하는 예는 로고를 만드는 것입니다 다양한 차원에서 어떻게 필요한가? ortiz 매우 일반적인 로고의 벡터 흥미로운 순간에 경고가 해석된다 그 이유 때문에 그는 그와 함께 일하면 조금 더 시간을 소비합니다 및 기타 이미지 유형은 매트릭스 유형입니다 이미지로 작업하는 좋은 소식 그것은 작은 점들로 이루어져있다 우리는 확대하고 있습니다

노출 된 픽시 억류자들과 함께 피자를 먹을 때보 다 더 많은 양의 피자를 먹는다 미국의 미국 필요하다면 금속의 양이다 여러 곳에 우리가 여기있을거야 여기에 세부 사항으로 우리는 상인을 준다 너는 사람들의 양을 볼 것이다

대부분이 이미지를 재현 할 수있는 세트입니다 가장 좋은 예 바닥재는 정말 더 작동합니다 스카프를 타면 스트라이크를보아야한다는 좋은 예가됩니다 너가 이것의 정상에 도착하면 그 서식지에서 다른 사람이 들어선 줄에서이 결함을 얻는다면 함께 그가 비판적으로 만든 사각형을 만들었다 다른 사람들이 당신을 붙잡 았을 때하는 일의 좋은 예라고 생각합니다

이력서 노래 너는 그가 조금씩 스카프를 만들기 위해 합류 한 것을 볼 것이다 우리는 이전 질문에 특정 영역에 대한 프로그래밍을 요구하고 있습니다 현재 비터의 품질을 보존한다 누구에게 인터뷰 제목을 주 었는지 개념이나 심지어 어떤 사람들처럼 작업하는 것이 좋습니다 coreldraw의 당신은 당신이 가지고있는 가장 오래된 도구 엄청난 양의 도구로 유명합니다

치료 기록 및 사진 편집과 함께 사용할 수 있습니다 에스테 파니아 비디오의 윈도우 설명이 진행된다 리터칭을위한 인산염 품질 도구의 양 결말 이스라엘의 재량에 따라 개별적으로 우리가 계속 분쟁을 일으키도록 초청하는 당선자는 코스에서 생산하고있다 포토샵 나는 축하해 주거나 휴식을 취하고있다 나는 아직도 모른다

나는 너를 이미 알고있다 포르투갈 알고 있니? 이제 그와 함께 일할 수 있습니다 여기에서 사 주셔서 감사합니다 그때까지

Create beautiful Web Design layout – Website Coming soon page – Photoshop Web Design

Photoshop 자습서는 웹 사이트 레이아웃을 디자인합니다 Photoshop에서 곧 제공 될 웹 사이트 레이아웃을 만드는 법을 배우고 있습니다 당신은 곧 나오는 웹 사이트를 디자인하는 것을 배우고 있습니다