오늘 우리는 시작하는 데 필요한 웹 디자인 도구 세트를 안내해 드리겠습니다.
하지만 그 전에 먼저 웹 디자인과 웹 개발의 차이점을 빠르게 정의해 보겠습니다. 다음은 동일한 맥락에서 자주 사용되는 두 가지 용어이지만 완전히 다릅니다.
웹 디자인 및 웹 개발:
웹 디자인-사이트 시각적 부분의 예술적 디자인입니다. 페이지, 구조, 모양 등 모든 측면이 포함됩니다. 모습웹사이트의 기능과 시각적 디자인 원칙의 구현 및 사용자 경험에 대한 설명이 필요합니다. 이런 방식으로 웹 디자이너는 시각적으로 매력적이면서 동시에 사용자가 사용하기 쉬운 디자인을 만듭니다.
웹 개발, 사이트 자체를 만드는 과정입니다. 이 프로세스에는 프로그래밍(코드 및 스크립트 작성), 향후 웹 디자인 및 정보 콘텐츠를 위한 페이지 레이아웃이 포함됩니다. 개발자는 사이트의 기반을 만들 수 있는 경험과 프로그래밍 능력이 있어야 웹 디자이너가 만들 수 있는 여지가 있습니다.
웹 디자인 도구:
이제 웹 디자인이 무엇인지 알았으니 이를 작동시키는 데 필요한 도구로 넘어가겠습니다.
스케치 및 그리기 도구:
모든 유형의 디자인과 마찬가지로 웹 디자인도 스케치(아이디어)에서 시작됩니다. 종이에 그리거나 그래픽 태블릿을 사용할 수 있습니다.
태블릿:디지털 발명품을 좋아한다면 그래픽 태블릿을 사용하여 디자인 아이디어를 스케치할 수 있습니다. 그들은 설치할 수 있습니다 어도비 포토샵 Illustrator를 사용하면 디지털 스케치를 빠르게 만드는 데 도움이 됩니다.
연필 + 메모장:전통적인 방법은 손으로 스케치하는 것인데, 이 방법이 좋고 쉬운 방법입니다.
타이포그래피:
귀하의 웹사이트 디자인 아이디어에 적합한 유형을 선택하는 것이 매우 중요합니다. 그리고 아무도 당신에게 그것을 주지 않을 것입니다 좋은 조언이것에 대해, 너만 제외하고! 개인의 '취향'과 '비전'에 따라 다르기 때문입니다. 다음은 찾을 수 있는 몇 가지 리소스입니다. 최고의 유형귀하의 웹 디자인 프로젝트를 위해.
구글 글꼴글꼴을 찾는 첫 번째 장소 중 하나입니다. 무료이며 Blogger, WordPress 또는 Squarespace로 쉽게 전송할 수 있습니다.
oert.org다양한 타이포그래피 스타일을 탐색하고, 유형에 대해 자세히 알아보고, 실험해 보는 데 사용할 수 있는 훌륭한 플랫폼입니다.
그림 물감:
색상 팔레트를 만들고 색상이 서로 어떻게 상호 작용하는지 탐색하는 데 몇 시간을 보낼 수 있습니다. 간단하고 아름답습니다! 하지만 처음에는 색상 팔레트에서 선택하는 것이 어려울 수 있습니다. 시간이 지남에 따라 프로젝트에 완벽한 색상 팔레트를 빠르게 만들기 시작할 것입니다. 다음은 귀하에게 도움이 될 수 있는 몇 가지 자료입니다.
Coolors.co- 아름답고 간단하며 쉬운 인터페이스 빠른 생성색상 팔레트.
color.adobe.com- 어도비 팔레트. 쿨러에는 질량이 있습니다. 추가 기능, 색상을 혼합하고 일치시키고 자신만의 팔레트를 만들고 싶은 경우. 또한 영감을 얻을 수 있는 기성 색상 팔레트의 거대한 라이브러리도 있습니다.
저자로부터:많은 초보자들은 웹 디자인을 어디서부터 배워야 할지 모릅니다. 위대하고 끔찍한 인터넷에는 종종 혼란을 주는 다양한 자료가 가득합니다. 더욱이 대부분의 사람들은 자신의 재능에 대해 의심을 품고 실패에 대한 두려움을 갖고 있습니다. 특히 그래픽에 대한 지식이 초등학교 미술 수업에만 국한된 경우라면 더욱 그렇습니다.
오늘은 엄청난 양의 정보 속에서 길을 잃지 않고 웹 디자이너가 되는 방법을 알려드리겠습니다. 자신에 대한 믿음과 배우고자 하는 열망이 있다면, 이 기사는 당신을 위한 것입니다!
원시인들은 동굴 벽화를 만들었고, 고대 이집트인들은 상형문자를 그렸고, 우리는 웹 디자인 시대에 살고 있습니다. 그것은 무엇입니까? 나는 그것을 "손가락으로" 설명하려고 노력할 것이며 이 영역으로 이동하기 전에 이해해야 할 최소한의 내용을 이 기사에 담을 것입니다.
웹디자인은...
우리 모두는 웹 디자인이 화면의 정보를 미학적으로 즐겁고 알아볼 수 있는 것으로 바꾸는 것임을 직관적으로 이해합니다. 다른 사람들과 아이디어를 공유하는 것입니다. 당신의 개성을 표현해보세요. 사이트의 주요 목표와 목적, 개념에 대한 그래픽 공식화. 일반적으로 이것은 다각적이며 언뜻보기에는 매우 복잡합니다. 특히 다음과 같은 경우:
87세 할아버지;
관련 경험 및/또는 교육이 없습니다.
당신은 그리는 방법을 모릅니다.
컴퓨터를 소유하고 있지 않습니다.
위 사항 중 적어도 하나라도 귀하에 관한 것이 아니라면, 귀하는 웹 디자이너가 될 수 있는 진정한 기회가 있는 것입니다! 하지만 진지하게, 자신이 사랑하는 것에 열정을 쏟는 사람에게는 장벽이 없습니다. 웹 디자인 교육은 독립적으로 수행하거나 전문 문헌, 강의, 인터넷 리소스, 유료 및 무료 비디오 과정을 통해 수행할 수 있습니다.
웹디자이너의 요구사항
기업 웹사이트, 블로그 또는 기타 리소스가 사용자에게 어떻게 인식될 것인지 정확하게 결정하는 것은 웹 디자이너의 책임입니다. 페이지의 내용을 얼마나 쉽고 빠르게 이해하고, 탐색을 탐색하고, 필요한 정보를 찾고, 이 작업 또는 해당 작업을 수행할 것입니다. 예를 들어, 그는 서비스나 제품을 주문할 것입니다.
따라서 웹사이트 디자인 전문가의 주요 업무는 다음과 같습니다.
회사의 장점에 대해 사용자의 관심을 유도합니다.
가장 밝은 부분 중요한 정보제품, 서비스, 기업에 대해;
논리적으로 방문자가 구매하거나 다른 행동을 수행하도록 유도합니다.
클라이언트를 위한 이 어려운 투쟁에서 웹 디자이너의 도구는 버튼, 이미지, 비디오, 링크, 텍스트 블록 등 사이트 구조의 적절한 요소여야 합니다.
자율 학습은 어디서 시작하나요? 성공을 위한 5단계
1. 웹 디자인의 외부 측면을 배우십시오. 학습과 자기 교육은 영감을 얻기 위해 다른 작품을 보는 것부터 시작해야 합니다. 대형 스튜디오, 유명 디자이너의 작품을 둘러보고, 트래픽이 많은 사이트를 분석해보세요.
그들은 어떤 글꼴을 사용합니까? 어떻게 선정됐나 색상 팔레트? 메인 블록, 제목, 이미지, 버튼의 특징은 무엇입니까? 이 모든 미묘함에주의를 기울여야합니다.
2. 내면의 관심을 따르십시오. 자신의 말을 듣고 이 작품이나 저 작품에서 당신을 매료시키는 것이 무엇인지, 당신에게 가장 흥미로운 것이 무엇인지 이해하려고 노력하십시오.
정확히 무엇을 하고 싶은지에 대한 비전을 얻을 때까지 시도하고 실험해 보세요. 이는 웹사이트 디자인, 브랜딩 및 로고 개발, 아이덴티티 또는 기업 아이덴티티 생성, 디자인이 될 수 있습니다. 모바일 애플리케이션등.
3. 그리기와 구성의 기초를 배웁니다. 이렇게하려면 미술 학교에 등록하거나 같은 초보자와 함께 교실에 앉아 공이나 꽃병을 그리려고 노력할 필요가 전혀 없습니다. 스케치를 할 수 있으면 충분합니다. 손이 연필에 익숙해지도록 하세요. 이렇게하려면 인내심을 갖고 사진, 그림, 비디오 자습서를 복사하십시오.
이 단계를 성공적으로 완료하려면 그리는 대상에 대해 잊어버리십시오. 공간에서의 비율과 위치에 대해서만 생각하십시오.
자신의 능력을 믿지 않는다면 성인기에 처음 그림을 그리기 시작한 예술가 Matisse, Paul Gauguin, Moses, Adolphe Bouguereau의 전기를 Google에서 찾아보세요.
4. Photoshop 도구 사용법을 배우고 탐색해 보세요. CSS 기본적응형 레이아웃의 원칙인 HTML. 많은 프로그램을 즉시 쫓아서는 안되며 웹 디자인을 배우는 과정에서 자신에게 부족한 구체적인 지식이 무엇인지 이해하게 될 것입니다.
5. 찾기 실제 사용당신의 지식. 나만의 웹사이트나 블로그를 만들어 보세요. 포트폴리오를 만들어 전문 프리랜스 거래소에 올려보세요.
자신만의 작품을 갖기 위해 실제 프로젝트를 완료할 필요는 없습니다. 웹사이트, 애플리케이션 인터페이스, 지역 회사 로고 등을 직접 스케치할 수 있습니다.
인터넷에서 찾은 책이나 강의를 활용하여 연습해 보세요. 초기 단계에서는 웹 디자인을 배우기 위해 다른 사람의 아이디어를 빌려서 수정할 수도 있습니다.
최신 유행을 유지하고 발전하세요. 아티스트로서 엄청난 재능을 갖고 있더라도 래스터 및 벡터 그래픽, CMYK 및 RGB, 적응형, 평면 및 재료 디자인의 원리, 포토샵 도구.
이러한 것들을 공부하는 데 하루에 최소 1~2시간을 투자하면 실력이 향상되고 특정 수준에 도달하여 웹 디자인 분야에서 높은 연봉을 받는 전문가가 될 수 있습니다. 학습을 시작할 곳 - 함께 자율 학습그리기의 기본과 그래픽 프로그램또는 종합 교육 과정 - 귀하의 포부와 동기에 따라 선택은 귀하에게 달려 있습니다.
웹 사이트 디자인에 관심이 있으면 학습이 매우 쉽습니다. 홈페이지와 블로그를 끝없이 보고, 디자이너 인터뷰도 읽고, 유튜브 강의도 질리지 않고 들을 수 있습니다.
하지만 웹디자인은 이론적으로만 연구할 수 없는 분야라는 점을 기억하세요. 실제 경험이 많을수록 좋습니다.
현대 시장은 "웹 디자이너"라는 직업에 그 흔적을 남깁니다. 지난 몇 년 동안 이국적인 글꼴, 주름 장식, 그림자 등이 없는 미니멀하고 단순화된 웹 사이트 구조를 향한 추세가 자리 잡았습니다. 큰 타이포그래피, 페이지 전체 너비에 걸친 배경 이미지 및 플랫 스타일도 여기에 있습니다. 인기 최고조.
다음 기사에서는 현대 디자인 트렌드에 대해 자세히 설명하겠습니다. 이것으로 작별 인사를하겠습니다. 디자이너와 웹사이트 개발자 환경의 모든 이벤트와 신제품을 확인하려면 블로그 업데이트를 구독하세요. 배우고 개발하면 성공할 것입니다!
안녕하세요 여러분, 친구들! 이 자료에서는 웹 디자인이 무엇인지, UI/UX가 무엇인지, 현대 웹 디자인의 와이어프레임이 무엇인지, 고품질 UI 디자인을 위한 기본 규칙, 웹 디자인 애플리케이션의 올바른 작업 구성을 살펴보겠습니다. 웹 디자인에서 HTML 레이아웃의 중요성과 웹 디자인을 독립적이고 올바르게 학습하고 웹 디자이너로서 발전하는 방법에 대해 설명합니다. 즉, 친구는 멋진 웹 디자이너를 위한 최고의 가이드, 이는 초보자뿐만 아니라 전문적인 개발을 원하는 숙련된 웹 디자이너에게도 매우 유용할 것입니다.
시원한
더듬다
1부: UX는 모든 것의 선두입니다
어떤 UX이고 또 어떤 헤드인지 당황해서 물어보시나요? 건조하고 생명이 없는 정의부터 시작한 다음 모든 것을 인간의 언어로 더 자세히 분석하겠습니다.
UX- 공부하는 학문 상호작용 경험제품에 대한 사용자의 인식, 사용으로 인한 반응.
UX는 웹디자인뿐만 아니라 다른 분야에도 적용되는 개념입니다. 더 깊이 파고들어 실제 사례를 살펴보겠습니다. 상호작용 경험은 공장의 전문가가 몇 개의 버튼을 눌러 복잡한 장비를 제어하는 경우이며, 종료 버튼은 훨씬 더 큽니다. UX는 아름답고 깨끗한 인도가 있음에도 불구하고 길을 이용해 집으로 가는 지름길을 택하는 것입니다. 이것은 자동차 내부 패널의 특별한 움푹 들어간 곳에 커피 한 잔을 놓는 경우입니다. 브레이크 페달이 가속 페달보다 넓은 경우입니다. UX는 유튜브에서 내 영상 설명에 사용된 모든 강의 자료의 링크가 보이고, 필요한 파일을 오랫동안 검색하지 않아도 되는 것입니다. 그것은 사용자 경험에 관한 것입니다. 많은 예가 있을 수 있지만 본질은 동일합니다. UX는 사용자가 가장 편안한 방식으로 목표를 달성할 수 있는 방법입니다. 그리고 당신이 멋진 웹 디자이너가 되고 싶고 일반적으로 성공한 사람이 되고 싶다면 이것을 배워야 합니다.
먼저 사진을 살펴보겠습니다. 여러분에게는 이것이 충격적인 사실로 다가올 수도 있지만, UX는 연구와 디자인은 물론 시각화와 레이아웃까지 포함하는 영역입니다. UX 작업의 결과로 작동하는 프로토타입을 얻어야 합니다. 웹 디자인에 관해 이야기한다면 이러한 프로토타입은 HTML 레이아웃입니다. 휴대폰에서 화면을 떼어내면 화면 자체 외에도 전선, 라이닝, 접착 이음새를 볼 수 있습니다. 이것이 인터페이스입니다. 좋은 디자이너는 레이아웃을 포함한 모든 세부 사항을 갖춘 인터페이스를 개발합니다. 앞으로는 화면이 전화보드(Back-end, PHP, Python, Ruby)에 연결되거나 프로그래밍(Front-end, JS)될 것입니다. 나는 그러한 진술이 일부 사람들, 특히 레이아웃이 전 세계, 별도의 지식 영역인 오래된 레이아웃 디자이너를 불편하게 만들 것이라는 것을 이해합니다. 하지만 전개를 객관적으로 보고 스페이드를 스페이드라고 부르자. 현실은 우리가 기껏해야 테스트를 통과해야 하는 모델을 개발하고 있다는 것입니다. 이것이 웹 디자이너로서 여러분의 임무입니다. 더 나아가 이 모델(HTML 레이아웃)을 백엔드 개발로 직접 전송하거나, 복잡한 프로젝트인 경우 프론트엔드 개발자에게 JS 애플리케이션 코드를 작성하도록 전송할 수 있습니다.
많은 매체와 대기업종종 UX, UI 전문가 및 HTML 코더- 이들은 다른 사람들입니다. 하지만 이 모델은 프리랜서에게는 실제로 작동하지 않습니다. 가장 효과적인 디자이너는 아이디어의 황금실을 잃어버리고 작업의 절반을 다른 사람에게 넘기는 대신 자신의 아이디어를 처음부터 끝까지 구현할 수 있는 사람입니다. 태양 아래 공간은 점점 줄어들고 이제 "그냥 레이아웃 디자이너"는 브레이크를 밟을 줄만 아는 운전자와 같습니다. 레이아웃에는 복잡한 것이 없습니다. 이것은 평균적인 복잡성을 지닌 일반적인 일상적인 작업입니다.
웹상의 UX- 이는 웹사이트나 애플리케이션의 디자인이 구축되는 기초입니다. 이는 웹 사이트 디자인을 만드는 사람들의 요구를 고려하여 인터페이스를 디자인하는 것입니다. 최종 사용자는 누구이며, 사용자가 인터페이스를 사용하여 추구하는 목표는 무엇이며, 가능한 한 빠르고 편안하게 결과를 얻을 수 있도록 어떻게 도울 수 있습니까? UX가 해결하는 주요 문제는 다음과 같습니다.
사용자 경험을 창조할 때 어려운 점은 사용자가 스스로 이해하는 것보다 사용자의 요구를 더 잘 이해해야 한다는 것입니다.
제스 개렛.
많은 초보 웹 디자이너(초보자뿐만 아니라)는 웹 디자인과 시각 디자인을 혼동합니다. 어떤 사람들은 여전히 웹사이트 디자인을 만드는 과정이 무엇보다 기초(UX)를 완전히 잊어버리고 이 모든 것들이 그려지는 대상이 누구인지를 조사하는 것을 잊어버리고 그림, 버튼, 아이콘(UI)을 만드는 것이라고 믿습니다.
나는 시각적으로 별로 아름답지 않은 사이트와 LP가 어떻게 엄청난 매출을 올리고 스타일리시한 아이콘과 인포그래픽을 갖춘 해외 플랫 인터페이스보다 더 잘 작동하는지 반복해서 보았습니다. 예, 예, 터무니없는 그라데이션, 거대한 버튼, 수정하지 않은 원시 사진 및 압축된 텍스트 블록이 있는 사이트였습니다. 그러나 그들은 일했습니다. 기적이라고요? 생각하지 마세요. 그런 사이트를 디자인한 디자이너가 클라이언트의 청중을 대상으로 연구를 했을 뿐이고, 특별한 시각적 취향이 없더라도 제품 사용자의 실제 요구 사항을 듣고 이해하는 방법을 알고 있을 뿐입니다. 아니면 실수로 올바른 방향을 추측했습니다. 진정으로 훌륭한 웹 디자이너가 되고 싶다면 동전의 두 면을 갖춰야 합니다. 한편으로는 훌륭한 UX 전문가가 되어야 하고, 다른 한편으로는 미각을 키워야 합니다. 인터페이스는 기능적일 뿐만 아니라 UI도 매력적입니다. 사용자 경험을 염두에 두고 그림을 그리지만 아름답지는 않은 디자이너, 또는 놀랍고 깔끔한 인터페이스를 그리지만 인간의 문제를 전혀 파고들지 않는 디자이너 등 어느 디자이너가 더 나은지에 대해 이야기한다면 첫 번째 디자이너가 확실히 승리합니다. 그리고 이것은 이해할 수 있습니다. 왜냐하면 더 많은 돈간단히 말해서 고객을 비즈니스로 끌어들이는 첫 번째 제품입니다.
나의 겸손한 의견: 디자인은 시각적 디자인을 위해 존재하지 않을 것이며 Web 3.0은 UX의 시대이며 정보 콘텐츠와 편의성이 향상됩니다.
UX 과제
우리는 점차적으로 이론에서 실천으로 옮겨가고 있습니다. UX는 어떤 문제를 해결할 수 있나요?
디자이너의 주요 임무는 제품과의 상호작용을 통해 최종 사용자의 만족도를 극대화하는 것입니다. 이하에서 제품이란 실제 제품, 서비스, 웹 애플리케이션 또는 웹사이트 등 사용자 상호 작용의 모든 개체를 의미합니다.
웹 디자이너는 사업주와 잠재 고객 사이에 다리를 놓는 사람입니다. UX 디자인의 주요 연구 작업이 제품의 잠재 고객을 연구하는 것임을 이해하는 데 엄청난 과학자가 필요하다고 생각하지 않습니다. 여기서 가장 어려운 것은 만질 수 없고 측정할 수 없는 것입니다. 이것은 웹 디자이너나 UX 전문가의 공감, 다른 사람의 욕구와 감정을 이해하는 능력입니다. 웹 디자이너는 잠재적인 청중의 욕구와 감정을 결정할 수 있을 만큼 충분한 경험을 쌓아야 합니다. 이는 다소 복잡한 주관적 과정이지만 검증된 연구 및 디자인 기술 덕분에 이를 정리하고 UX 기술을 향상시킬 수 있습니다.
2부: 연구
단순히 고객의 제품을 가져와 이를 위한 웹사이트, 애플리케이션 또는 랜딩 페이지를 만들 수는 없습니다. 다른 사람의 랜딩 페이지, 다른 사람의 작업을 가져오는 것은 근본적으로 잘못된 것입니다. 그러나 더 나쁜 것은 허공에서 아이디어를 빨아들여 그것에 대한 일종의 임시 디자인을 그려서 삽입하는 것입니다. 키워드제품에 대한 텍스트 블록으로 근본적으로 잘못된 일임에도 불구하고 대부분의 사람들은 그렇게 합니다. 웹 디자인에 대해 덜 깨달은 고객이 여전히 우연으로 돈을 받는 나쁜 전문가의 우스꽝스럽고 실패한 결정을 무시한다는 사실에도 불구하고 이것은 막다른 골목이자 아무데도 갈 수 없는 길입니다.
정확히 이 섹션, 정확히 이러한 요소, 정확히 이 순서를 만드는 이유를 명확하게 이해해야 합니다. 웹 페이지. 모든 행동은 철근 콘크리트 기초로 뒷받침되어야 합니다. “왜 이 작고 둥근 것들이 여기에 있지?”라는 질문에 대한 설명은 다소 이상하게 들릴 것입니다. 형식으로 - "왜냐면 내가 이것을 어딘가에서 보고 결정했기 때문입니다. 이 양식내 상상은 작동하지 않으니까 당신의 허구 콘텐츠에 적용해 보세요." 이상하지 않나요?
올바른 방법 - 연구. 연구는 디자이너가 어떤 프로젝트에서든 작업할 때 취하는 첫 번째 단계입니다. 사용자 그룹을 명확하게 식별하고, 인터페이스를 개발 중인 대상을 최대한 많이 파악하고, 이 대상의 요구 사항을 파악해야 합니다. 물론 개인적인 경험과 느낌만으로는 인터페이스에서 객관적으로 올바른 결정을 내리기가 매우 어렵습니다. 창의성과 창의성의 결과에 대해 공정하지 않기 때문입니다. 개인적인 경험특정 제품에 대해서는 상당히 제한적일 수 있습니다. 그러나 웹 사이트를 디자인하려는 제품을 철저하게 연구했다면 몇 가지 결론을 도출하고 결정을 내릴 수 있습니다. 프리랜서이고 혼자 일하고 UX 전문가로 구성된 팀이 없는 경우 해야 할 최소한의 일은 현재 비즈니스 경험을 연구하고 제품의 일반 소비자의 초상화를 그리는 것입니다. 예를 들어 농기계 판매를 위한 랜딩 페이지를 만드는 경우 잠재 고객은 사이트의 시각적 디자인에서 특별한 장식을 찾는 것이 아니라 제품 카탈로그, 사진, 배송 시간 및 방법에 더 관심이 있습니다. 특히 해당 지역, 가격 및 가능한 할인에 따라 다릅니다. 마지막 요점은 UX 디자인이 비즈니스와 매우 밀접한 관련이 있음을 시사합니다. 이것은 웹 디자이너가 일반적으로 이야기하지 않지만 모든 사람이 생각하는 것입니다.
조사를 시작할 때 고객인 사업주와 대화해야 합니다. 그는 자신의 제품에 대한 전문가이며 고객과 함께 일한 경험이 있으며 청중을 잘 알고 있습니다. 추가 분석을 위해 모든 핵심 사항을 스티커 메모나 메모장에 적어 두십시오. 프리랜서라면 유사한 제품, 주제별 포럼 및 커뮤니티의 경험을 연구하되 경쟁사의 개발을 프로젝트에 맹목적으로 적용하지 마십시오. 이는 올바르지 않고 효과적이지 않습니다. 스튜디오라면 온라인 설문조사, 청중과의 인터뷰, 잠재적으로 효과적인 여러 프로토타입에 대한 A/B 테스트를 수행하는 등 심층적인 연구에 충분한 리소스와 프로젝트 예산을 보유하고 있습니다.
계속 진행합시다. 귀하가 주로 관심을 갖는 방문자의 특성 목록을 작성하십시오. 이를 위해 잠재적으로 제품 사용자가 될 수 있는 사람들의 표를 만들고 그들을 특징짓습니다. 그 사람의 입장이 되어 역할에 익숙해지고 그 사람처럼 생각하기 시작하십시오.
1-2-3명의 사람을 정확하게 특성화하면 목표를 달성할 확률이 더 높아집니다. 엄청난 숫자주어진 주제에 대해 비슷한 가치와 요구를 가진 사람들. 2~3명(또는 그 이상)의 사람을 정의하면 방문자가 인터페이스를 사용하여 해결할 수 있는 작업을 정의할 수 있습니다.
3부: 와이어프레임 작성, 와이어프레임 모델링
청중을 식별하고 개인의 목표와 가치를 정의한 후에는 소위 와이어프레임(Wireframing)이라는 인터페이스 프레임워크 모델링을 시작할 수 있습니다. 와이어프레임은 향후 페이지에 정보를 배포하는 역할을 합니다. 중요한 순서대로 - 위에서 아래로. 모델링 과정에서 페이지에 어떤 정보가 포함될지 생각하고 정보 출력의 기본 형식을 결정하지만 세부 사항에 들어가지 않고 시각화에 참여하지 않습니다. 나중에 구조가 완전히 성공하지 못했다는 것을 알게 되더라도 모든 것을 다시 실행해야하기 때문에 당황해서는 안됩니다. 스타일을 잊어버리고 구조에 집중하세요.
프레임을 만들려면 다음을 사용할 수 있습니다. 특별한 응용또는 상자나 점 안에 종이에 손으로 그린 다음 스캔하여 프로젝트 자료가 있는 폴더에 넣습니다. 나는 보통 사용한다 온라인 신청 wireframe.cc, 실시간으로 변경하고 클라이언트와 동의할 수 있기 때문입니다. 하지만 너무 게으른 나머지 컴퓨터 앞에 앉아 있을 수 없을 때는 가끔 종이에 페이지 구조를 짚어봅니다.
팁: 사이트의 메인 페이지나 애플리케이션의 메인 화면에 하나의 와이어프레임을 사용하지 말고 구조 레이아웃에 대한 여러 스케치를 만드십시오. 홈페이지의 경우 페르소나 테이블에서 정보를 가져와 중요도에 따라 목표와 가치를 정렬하고 방문자에게 정보를 제공하는 형식을 실험해 보세요.
웹사이트나 애플리케이션의 모든 페이지를 살펴보고 전체 사이트의 골격이 준비된 후에만 다음 단계로 넘어갑니다.
4부: UI, 시각화
UX에 대한 철저한 작업을 마치고 여러 와이어프레임을 생성하고 가장 매력적인 옵션을 선택하면 시각화를 시작할 수 있습니다. 시각화는 와이어프레임을 그리고 통일된 스타일을 만들고 콘텐츠를 디자인하는 것입니다. 즉, UI 작업을 시작합니다. 대부분의 경우 Adobe Photoshop, Sketch.app, Inkscape+Gimp 또는 기타 도구가 시각화에 사용됩니다. 인터랙티브한 그래픽 프로토타입을 시각화하고 개발하려면 Adobe XD를 사용하는 것이 좋습니다. 앞으로는 수업에서 이 도구만 사용하여 디자인을 만들 것입니다. 여기에서는 즉시 시각화를 만들고 사용자가 페이지에서 어떻게 이동하는지 보여줄 수 있기 때문입니다. 벡터 그래픽 작업을 위해 저는 Inkscape를 사용합니다. 여기서 작업에 필요한 아이콘과 기타 필요한 그래픽을 만듭니다. 래스터 그래픽- 가장 좋은 솔루션은 Adobe Photoshop입니다.
매너의 규칙
Artemy Lebedev는 웹 디자인에는 규칙이 없다고 말합니다. 웹디자인에는 매너의 법칙이 있다고 대답하겠습니다. 웹사이트 디자인을 개발할 때 웹 디자이너는 디자인할 때 암묵적인 특정 규칙을 준수합니다. 줄 간격, 간격, 글꼴, 요소 크기 - 이 모든 것이 측정 가능하며 솔직히 잘못된 구현이 있습니다. 따라서 초보자이고 미각이 초기 단계에 있더라도 디자인을 잘못 시각화하지 않을 일련의 규칙을 작성할 수 있습니다.
디자인 경험이 많고 자신이 하는 일을 잘 알고 있다면 이러한 규칙이 깨질 수 있다는 점에 유의하세요. 초보자이고 실험 중인 경우에도 이러한 규칙을 어길 수 있습니다. 초보자 웹 디자이너라면 이러한 규칙을 위반하는 인터페이스를 프로덕션에 출시하지 마십시오.
타이포그래피, 텍스트, 링크
- 너무 큰 제목을 사용하지 마십시오.
- 12px보다 작은 글꼴을 사용하지 마십시오.
- 줄 간격을 너무 작거나 너무 크게 만들지 마십시오.
- "변형" 도구를 사용하여 글자를 늘리지 마십시오. 글꼴은 자연스럽게 비례해야 합니다.
- 한 페이지에 3개 이상의 글꼴을 사용하지 마세요.
- 대비를 너무 적게 사용하지 말고 흰색에 밝은 회색을 인쇄하거나 검정색에 어두운 회색을 인쇄하지 마십시오.
- 수행 중인 작업을 알고 있고 선택한 글꼴을 사용하면 텍스트를 가장 우아한 방식으로 "풍선"으로 만들 수 있는 경우 문자 사이의 간격을 주의해서 사용하십시오.
- 단락, 제목, 요소 사이에 너무 작은 공간을 두지 말고 디자인에 약간의 분위기를 더하세요.
- 필요한 경우가 아니면 캡슐을 사용하지 마십시오.
- 기본 텍스트 블록에 지나치게 복잡한 장식 글꼴을 사용하지 마십시오. 일부 Sans 또는 Serif 계열(Serif 및 Slab - 수행 중인 작업을 알고 있는 경우)의 글꼴은 간단하고 읽기 쉬운 글꼴이어야 합니다.
- 탐색 항목을 제외한 모든 링크에는 밑줄이 그어져 있어야 합니다. 또한 이미 방문한 링크를 기본 링크 색상이 아닌 더 어두운 색상으로 디자인해 보세요.
- 사이트 계층 구조에 3개 이상의 수준이 포함된 경우 이동 경로를 잊지 마세요.
그래픽, 아이콘, 사진
- 디자인에 템플릿 사진을 사용하지 마세요. 직접 촬영하는 것이 더 낫습니다. 고객에게 사진 작가에게 연락하거나 가장 "실물 같은" 사진을 찾도록 권장합니다.
- 사진으로 만든 아이콘을 사용하지 마세요.
- 모든 아이콘은 다음 형식으로 제작되어야 합니다. 유니폼 스타일;
- 원본 크기 이상으로 사진을 확대하지 마십시오.
- 그래픽을 불균형하게 확장하지 마십시오.
- 일반 이외의 레이어 혼합 모드를 사용하지 마십시오.
- 여러 상태를 가져야 하는 이미지(예를 들어 일반적으로 마우스 오버 시)에는 필터를 적용하지 마세요. 모든 오버레이 및 변경은 새 레이어를 추가해야만 이루어집니다. 모든 것은 HTML 레이아웃으로 쉽게 재현되어야 합니다. 이는 수정 및 사진 준비에는 적용되지 않습니다.
- 스마트 개체로 변환하기 전에 사진의 크기를 조정하지 마십시오.
- 모양에 대한 클리핑 마스크만 사용하여 사진을 자르고 원본 사진은 이전 지점과 마찬가지로 스마트 개체에 저장해야 합니다.
- Photoshop에서 아이콘을 그리는 경우 축소된 크기로 래스터화하지 마세요. 레이아웃에는 여전히 레이아웃 단계가 있으며 모든 아이콘을 벡터화해야 한다는 점을 잊지 마십시오. 아이콘이 있는 원본 스마트 개체는 고품질 추적을 위해 충분히 커야 합니다.
- 이상적으로는 모든 플랫 아이콘과 그래픽을 SVG 형식으로 별도의 폴더에 보관해야 합니다. 게으른 디자이너라면 고품질 변환 가능성이나 아이콘을 SVG로 내보낼 가능성을 고려해보세요.
색상
- 순수한 색상을 사용하지 말고 가장 기분 좋은 색상을 얻으려고 노력하십시오.
- 한 페이지에 강조 색상을 2개 이상 사용하지 말고, 텍스트에 어두운 회색(또는 검정색) 색상을 2개 이상 사용하지 마세요. 이상적으로는 텍스트에 강조 색상 1개와 어두운 회색/검정색 1개만 사용하는 것이 좋습니다. 저는 밝은 배경의 기본 글꼴로 111111 - 222222 색상을 사용하고 있습니다.
- 페이지에서 가장 중요한 요소만 강조 색상으로 칠하고 해당 요소에 주의를 집중하세요. 버튼, 화살표, 중요한 항목의 체크박스, 텍스트 링크, 정보 아이콘("로그인", "비밀번호", "메일"과 같은 작은 아이콘 및 양식의 아이콘은 강조할 필요가 없음)입니다.
그래픽 편집기 작업, 작업 구성 등에 대한 규칙
- 레이어에 의미 있는 이름을 지정하세요.
- 인터페이스의 의미 블록과 구성 요소를 그룹으로 구성해 보세요.
- 항상 TTF 또는 OTF 형식으로 사용하는 모든 글꼴이 포함된 별도의 폴더를 만드세요. 아이콘 글꼴도 이 폴더에 있어야 합니다.
- 1-in-1(72ppi) 레이아웃을 만듭니다. 100% 표시에서 레이아웃은 의도한 HTML 레이아웃 결과와 동일한 배율이어야 합니다.
- 작업에 일종의 그리드 시스템을 사용하십시오. 직접 개발할 수도 있지만 Bootstrap 그리드 시스템을 사용하는 것이 좋습니다. 컨텐츠 너비는 원래 Bootstrap 그리드 너비에서 사용자 정의할 수 있습니다. 이를 위해 Photoshop 사용자인 경우 그리드 생성을 위한 플러그인을 사용할 수 있습니다.
- 실용적이지 않다면 장식적인 요소를 만들지 마세요. 이것이 이미지 사이트이고 필요한 경우 좋은 사진, 이 규칙생략 가능;
- 의미 있는 시각적 계층 구조를 고수하세요. 시각적 계층 구조에 대해 읽어보세요.
- 블록의 내부 요소 사이의 거리가 블록 사이의 외부 거리보다 작아야 한다는 "내부 및 외부" 규칙을 사용합니다.
- 사람들은 사이트의 메인 페이지가 아닌 내부 페이지에 가장 자주 방문한다는 점을 잊지 마십시오. 따라서 머리글, 바닥글, 사이드바(있는 경우)와 같은 유용한 범용 블록을 생각해 보십시오. 헤더는 최대한 많은 정보를 제공해야 하지만 과포화되어서는 안 됩니다. 필수 요소: 로고, 프로젝트 이름, 탐색. 프로젝트에 따라 사이트 검색 및 기타 요소가 배치됩니다.
- 좋은 해결책은 바닥글에 모든 숨겨진 장소가 포함된 자세한 탐색 또는 사이트 맵을 배치하는 것입니다. 바닥글 또는 바닥글은 완전히 별개의 주제이므로 별도의 기사를 작성할 가치가 있습니다. 지하실을 가장 작은 세부 사항까지 생각하고 로고와 전화 번호가 있는 빈약하고 좁은 지하실을 만들지 마십시오. 여기서도 프로젝트에 따라 다르지만 대부분 바닥글을 높게 펼친 상태로 만드는 것이 좋습니다. 나는 필요한 숨겨진 정보를 지하에 자주 찾는 편이고, 높고 세심하게 계획된 지하실을 좋아한다. 지하실에 대해 그런 말을 하게 될 줄은 몰랐어요.
지금까지 규칙이라고 할 수 있는 기본 진술을 살펴보았습니다. 이제 웹 디자인에 대한 가장 일반적인 통념을 살펴보겠습니다. 이는 일부 사람들에게는 규칙이자 행동 지침이 되었지만 전문가들은 더 이상 사용하지 않습니다.
웹 디자인 신화
- 세 번의 클릭 규칙. 신화. 사용자가 메인 페이지의 정보에 관심이 있다면 목표를 달성하기 위해 원하는 만큼 클릭을 할 것입니다. 원하는 자료에 대한 탐색 포인터를 올바르게 배치하려면 그를 조금 도와야합니다. 탐색은 간단하고 명확해야 합니다.
- 콘텐츠 슬라이더- 이것 좋은 결정. 매우 논란이 많은 진술입니다. 나는 콘텐츠를 표시하기 위한 형식으로 슬라이더를 자주 사용했지만 슬라이더를 스크롤하는 사람이 거의 없다는 연구 결과가 있으며 실제로 이것이 사실이라는 것을 알려줍니다. 아마도 가까운 미래에 콘텐츠 슬라이더의 효과는 신화가 될 것입니다.
- 좋은 디자인을 만들기 위해서는 많은 노력이 필요합니다. 신화. 청중을 정확하게 식별했다면, 하나의 좋은 그림, 헤드라인, 텍스트 블록만으로도 사용자가 제품에 진심으로 관심을 갖도록 만드는 데 충분합니다. 웹 디자이너가 디자이너가 충분한 작업을 수행하지 않았다는 비난과 함께 고객의 요청에 따라 인터페이스(CTA, 카운트다운 타이머, 해킹된 클릭 유도 문구가 포함된 여러 섹션)에 무엇이든 채워 넣어야 하는 상황이 있습니다. 재미 있고 우스꽝 스럽습니다. 불행하게도 이것은 사업주의 일반적인 특징이며 웹 디자인에서 "더 많을수록 더 즐겁다"는 규칙이 작동하지 않는다는 것을 정확하게 설명할 수 있으면 됩니다.
- 디자인은 독창적이어야 합니다.물론 한 달 정도 여유가 있고 고객의 지갑이 넉넉하다면 이는 좋습니다. 그러나 이는 사실이 아닌 경우가 많습니다. 독특한 일러스트와 디자인에 많은 돈과 시간을 투자할 수 있지만, 결국 그런 기회가 없었던 것처럼 같은 결과로 끝나게 됩니다. UX 작업과 우수한 결과를 위해서는 이러한 시간과 비용 낭비가 필요하지 않습니다. 보편적인 블록(머리글과 탐색, 바닥글)의 특정 배열에 익숙한 사용자는 모든 것이 "독창적이고 특이한" 사이트를 방문할 때 혼란스러워하는 경우가 많습니다. 웹 표준을 고수하면 자전거 잭을 다시 만들 필요가 없습니다. 게다가 스타트업은 실험할 시간이나 자금이 없는 경우가 많습니다. 저는 시각적인 화려함에 의지하지 않고도 실제로 효과가 있고 고객을 끌어들이는 단순한 디자인을 변형하는 것이 가능하다고 믿습니다.
5부: 레이아웃
저는 웹디자이너가 레이아웃을 할 줄 알아야 한다고 생각해요. 하지만 내 의견에 동의하지 않는 게으른 동료들도 많을 것입니다. 내 채널 이름은 다음과 같습니다. 웹디자인 마스터그리고 수업을 녹음하기 시작했을 때에도 웹 디자인이 무엇인지, 무엇이 포함되어 있는지에 대해 꽤 명확한 아이디어를 갖고 있었습니다. 물론, 뭔가 변했고, 뭔가 변하지 않은 채로 남아 있지만, 나는 그러한 세계관이 매우 객관적이라는 것을 점점 더 확신합니다.
저는 프론트엔드에 능숙하지 않습니다. 왜냐하면 실제 프론트엔드는 대규모의 심각한 프로젝트를 위한 복잡한 인터페이스 로직을 개발하는 심층적인 JavaScript이기 때문입니다. 저는 프로그래머가 아니라 디자이너라는 사고방식을 갖고 있기 때문에 제가 좋아하지 않는 분야에 억지로 뛰어들 필요가 없습니다. 하지만 필요하다면 언제든지 내 디자인을 "소생"시키고 상당히 높은 수준에서 작동하는 HTML 프로토타입을 만들 수 있습니다. 그리고 이것은 전문가로서 가격표가 최소한 두 배나 되기 때문에 웹 디자이너에게는 매우 훌륭한 옵션입니다. 새로운 지평을 탐험하는 것을 두려워하지 마십시오. 레이아웃은 어렵지 않습니다.
프론트엔드 개발자로서 레이아웃과 기본 기술을 익히고 싶다면 다음을 추천합니다.
- HTML 기본 이해
- 이론을 공부하세요. 이를 위해서는 htmlbook.ru 사이트를 마스터하는 것이 좋습니다. 처음부터 끝까지 모든 것이 HTML 태그, 모든 CSS 속성
- 실제로 지식을 통합하십시오. 이에 적합한 재료는 다음과 같습니다.
HTML 레이아웃에 자료가 충분하므로 레이아웃이 완료되었습니다.
6부: 자기 학습과 자기 계발
일반적으로 웹 디자인과 웹 개발은 다른 분야와 달리 가장 중요한 분야입니다. 자기 교육. 결국 우리는 웹 디자인 분야의 전문가를 양성할 학교, 대학 및 기관이 없으며(2016년 현재) 업계 자체가 가만히 있지 않고 항상 흐름에 있어야 합니다.
UX의 경우 모든 것이 조용하고 차분합니다. 사실 UX는 심리학을 연구하는 학문이고 여기서는 가까운 시일 내에 어떤 것도 바뀔 가능성이 없기 때문에 이것은 오랫동안 그렇게 유지될 것입니다. 여기서 자기 교육은 내면 세계의 발전, 즉 자신의 경험에 있습니다. 데이터베이스를 연구한 후에는 가끔 이 분야의 뉴스를 모니터링하고 좋은 탐정 이야기를 읽는 것만으로 수년 동안 안전하게 작업할 수 있습니다. 그러나 자가 학습 UI에는 특별한 주의가 필요합니다. 이곳의 삶은 한창이고 시각 디자인의 트렌드는 서로 교체되고 거의 매일 보완되고 진화합니다! 나는 맹목적으로 경향과 경향을 따르는 지지자가 아니지만, 실습에서 알 수 있듯이 추세에는 합리적인 곡물이 있으며 따라야 합니다.
UI 기술을 향상시키는 데 있어서 명확한 지침을 줄 수도 없고, 아름다운 인터페이스를 만드는 데 도움이 되는 책을 추천할 수도 없습니다. 그러나 그럼에도 불구하고 나는 내 경험을 바탕으로 자가 학습이 나에게 어떻게 도움이 되는지에 대해 몇 가지 조언을 드릴 수 있습니다.
- ThemeForest의 작업을 끊임없이 탐색하세요. ThemeForest는 현대 웹 디자인의 보고입니다. 작품에 콘텐츠를 표시하는 매력적인 형태를 사용해 보세요. 하지만 너무 성급하게 생각하지 말고 기본인 UX를 잊지 마세요. 모든 것이 주제에 관한 것이어야 합니다.
- awwwards.com에 정기적으로 방문하셔서 긴장을 늦추지 않도록 멋진 작품을 감상하세요 ;-)
- 또한 미각을 키우기 위해서는 behance.net에서 좋은 작품을 주기적으로 공부해 보는 것도 도움이 될 것입니다. 연습하는 데 시간을 투자하세요. 연습에서 좋아하는 작업을 반복하세요. 그래픽 편집기, 그러나 어떠한 경우에도 귀하의 사본을 어디에도 게시하지 마십시오. 이는 연습과 자기계발에만 필요합니다.
- 도시 거리의 광고를 비판하고 어떻게 하면 더 잘할 수 있는지 생각해 보세요.
- 거리의 UX를 비판하고 더 편리하게 할 수 있는 일이 얼마나 많은지 생각해 보세요. 다행스럽게도 소련 이후의 공간에는 이에 대해 이야기할 수 있는 장소가 있습니다. 사람에 대해 생각하고 사람처럼 생각하십시오.
그리고 오늘 나는 그녀와 비슷한 글을 쓰고 있습니다. 비슷한 기사이지만 직업과는 거리가 멀습니다. 사실 웹 디자이너는 코드를 전혀 이해하지 못할 권리가 있는 사람이지만 사이트가 모형에서 실제 인터넷으로 이동하는 방법에 대해 최소한 기본적인 이해를 갖는 것이 좋습니다.
처음부터 웹 디자이너가 되는 방법과 이에 필요한 것은 무엇입니까?
이전 기사와 유사하게 먼저 이 직업을 마스터하는 데 필요한 것이 정확히 무엇인지 나열하겠습니다.
- 일하는 법을 배우세요 포토샵 프로그램또는 레이어 작업이 가능한 다른 곳. 그러나 PhotoShop에 대해 안팎으로 알 필요는 없습니다. 통계에 따르면 웹 디자이너는 프로그램 기능의 10~15%만 사용합니다.
- 웹사이트를 디자인하는 방법을 알아보세요. 즉, 레이아웃을 그리기 전에 최소한 향후 프로젝트에 대한 대략적인 그림을 그려야 합니다. 이것은 웹 디자이너들 사이에서 좋은 습관이고, 전문가들도 이것을 하기 때문에 여러분도 배워야 한다는 의미입니다.
- 어떤 유형의 웹사이트 디자인이 있는지 이해하세요. 예를 들어 기술이란 무엇입니까? 디자인 또는 평면 디자인.
- 레이아웃을 그릴 수 있습니다. 적응형 디자인. 즉, 다양한 화면 해상도에서 사이트가 어떻게 변경되는지 그려볼 수 있습니다. 오늘날 모든 사람이 모바일 친화적인 웹사이트를 원하기 때문에 이는 거의 필수 요구 사항입니다.
- 사이트 유형을 이해합니다. 정보 포털에는 전혀 적합하지 않은 단일 페이지 웹 사이트에 적합한 것이 있음을 이해하십시오.
- 찾아서 신청하세요 유용한 도구직장에서. 디자이너는 자신의 작업을 더 쉽게 만들어 줄 다양한 지원 서비스를 사용하는 방법을 배워야 합니다. 예를 들어, 좋은 서비스웹사이트 디자인, 색상 선택 등을 위해
보시다시피 많은 일을 할 수 있어야 하지만 모든 것을 마스터하는 것은 그리 어렵지 않습니다. 다음으로, 가능한 한 짧은 시간 내에 웹 디자이너를 배우고 되는 방법에 대한 유용한 링크와 권장 사항을 공유하겠습니다.
직업을 배울 수 있는 곳
Geekbrains - 이 사람들은 웹 디자인을 처음부터 완전히 배우고 첫 번째 모형을 만들 수 있는 5개월 간의 교육 프로그램을 가지고 있습니다. 괴짜이것은 슈퍼 교육 플랫폼이며 여기의 교육 품질은 최고 수준입니다.
Netology가 대안입니다. 멋짐 측면에서 Geekbrains와 Netology 중 누가 더 나은지조차 모르겠습니다. 사실 두 사이트 모두 매우 긍정적으로 입증되었으며 수천 명의 사람들이 이미 그곳에서 공부했으며 후회하지 않습니다. 예, 둘 다 가격이 가장 낮지는 않지만 그 대가로 전문가로부터 교육을 받습니다. 그리고 프로가 가르쳐주어야만 프로가 될 수 있습니다. 다음 교육 프로그램웹 디자인 수업이 5월 20일에 여기서 시작됩니다. 두 회사 모두 학생들의 졸업 후 취업을 적극적으로 돕습니다.
Webformyself - 돈을 투자하지 않고 시도해보고 싶은 사람들을 위한 무료 웹 디자인 강의입니다. 또한 회사 웹사이트에는 초보 디자이너를 위한 매우 좋은 유료 강좌가 몇 개 있습니다.
Magisters.org/ - 마침내 여기에서 웹 기술에 대한 많은 무료 강의가 있는 또 다른 사이트를 찾았습니다. Photoshop 및 첫 번째 웹 사이트 레이아웃 그리기 과정도 있습니다. 이 코스는 사이트에 제시된 다른 코스보다 객관적으로 더 좋기 때문에 유료이지만 비용은 1,500 루블에 불과합니다. Netology 교육과 비교하면 10~12배 적지만 얻는 것도 적지만 정보의 품질은 여전히 높으며 강의를 시청하면 실제로 자신만의 레이아웃을 그릴 수 있습니다.
글쎄요, 여기서 제가 이 게시물을 마치겠습니다. 주요 링크를 제공했습니다. 여러분이 해야 할 일은 직업을 배우고, 기술을 향상시키고, 웹 디자인으로 돈을 버는 것뿐입니다. 틀림없이, 직업이 어울릴거야모든 사람에게 해당되는 것은 아니므로, 이것이 자신의 인생에서 하고 싶은 일인지 먼저 결정하는 것이 좋습니다.
안녕하세요, 독자 여러분! 이 글에서는 스스로 웹 디자이너가 되는 방법을 알려드리겠습니다.
전문가 수준으로 가는 길은 쉽지 않지만 결과는 그만한 가치가 있습니다. 우리는 배울 것이 많기 때문에 인내심을 갖고 열심히 일하는 것이 좋습니다.
먼저, 노력할 가치가 있는지 결정해 볼까요? 결국 돈을 벌겠다는 목표에 쫓기면 이것만으로는 충분하지 않으며, 중요한 것은 배우고 명령을 이행하는 과정을 즐기려는 욕구입니다. 그러면 고용주는 당신을 소중히 여길 것입니다. 왜냐하면 진정한 동기는 당신의 평생의 일이기 때문입니다.
초보자를 위한 시작점
이 분야의 많은 초보자는 수많은 정보, 책, 기사, 비디오 강좌에서 길을 잃습니다. 모든 정보를 구조화하고 특정 단계를 간략하게 설명하겠습니다.
동의하시나요?
- 그래픽 편집자와 함께 작업하는 방법을 알아보세요.
우선, Adobe Photoshop에 대한 충분한 지식이면 충분합니다. 이 프로그램은 개발에 시간과 노력이 필요한 놀라운 기능을 제공합니다. 색상, 브러시, 효과를 실험해보세요. 웹사이트를 당장 그릴 필요는 없고, 포토샵을 사용할 때 미각과 기술력을 키우는 것이 중요합니다.
다음 사항을 이해하는 것도 도움이 될 것입니다.
- Illustrator – 아이콘과 로고를 만드는 데 도움이 됩니다.
- UX 및 UI 디자인 – 기본 지식은 사용자 친화적인 인터페이스를 만드는 데 도움이 됩니다.
- HTML, CSS - 프로그래밍 언어를 이해하면 그래픽을 사이트의 본격적인 요소로 최적화하는 데 도움이 됩니다.
하지만 배움은 거기서 끝나지 않고 단지 시작일 뿐입니다.
- 자유시간을 모두 그려보세요.
특히 경험이 없는 경우 다른 디자이너, 유명 브랜드 및 해당 웹 사이트의 작업을 다시 그리는 것이 중요합니다.
- 만들다 자신의 블로그, 당신이 배운 첫 번째 작품과 요령을 출판할 곳입니다.
숙련된 웹 디자이너에게 귀하의 작업에 대한 의견을 요청하세요. 이는 귀하와 다른 초보자에게도 유용합니다.
- 당신의 예술적 취향을 개발하십시오.
웹디자이너는 창의적인 아이디어와 취향 없이는 살아갈 수 없습니다. 자연이 당신에게 이것을 빼앗겼다면 당신은 그것을 스스로 키워야합니다. 영화관에 가고, 사진을 찍고, 광고에 주목하고, 전시회에 가고, 새로운 그림에 관심을 갖고, 책을 사고, 아름다운 곳을 여행하는 시간을 가져보세요. 창의력을 발휘할 수 있도록 영감을 주는 것은 무엇이든 하세요!
- 한 가지에만 매달리지 마세요.
당신이 좋아하는 것을 정확하게 찾아보십시오. 결정하려면 웹사이트를 디자인하거나 랜딩 페이지를 만드는 등 많은 노력을 기울여야 합니다. 여러 가지를 잘할 수 있지만 한 가지 분야에서는 전문가가 되는 것이 더 좋습니다.
- 분석하다.
아니요, 제가 아니라 Andrei Gorokhov 또는 Vasily Pirogov와 같은 다른 디자이너의 작품입니다. 이 직업의 국내 대표자뿐만 아니라 외국 대표자도 연구하십시오. 이렇게 하면 자신의 스타일을 빠르게 찾고, 영감을 얻고, 동기를 부여받을 수 있습니다.
- 양질의 포트폴리오를 만드세요.
웹 디자이너를 위한 포트폴리오를 만드는 방법(링크는 나중에 제공됩니다) 지침에서 이에 대한 자세한 내용을 읽어보세요.
- 그들은 그것을 제안합니다. 그것을 받아들이십시오.
어떤 일이든 맡으세요. 간단한 배너와 로고로 두어도 상관 없습니다. 결국, 처음부터 시작한다면 포트폴리오에 대한 작업이 필요합니다. 그리고 이것은 오직 행함으로써만 얻을 수 있는 가장 중요한 경험이며, 다른 것은 없습니다. 행동을 취하다! 자신을 시험해보고 자신의 고객을 찾으십시오. 아직 자신의 능력에 확신이 없다면 가격을 부풀리지 마세요.
- 거래소에서 방금 주문을 받기 시작했다면 주의를 기울여 WebMoney 및 Yandex Money와 같은 전자 지갑을 만드는 것을 잊지 마십시오.
- 고객과 소통하는 방법을 배우세요.
이를 위해서는 Skype를 사용하는 것이 좋습니다. 이는 사람의 욕구를 더 잘 이해하기 위해 필요합니다. 결과적으로 고용주가 정확히 무엇을 보고 싶어하는지 알아내는 것이 중요합니다. 고객에게 자신이 좋아하는 사이트를 보여달라고 요청하고, 거기에 없어야 할 사이트도 물어보세요. 신중하게 공부하세요 기술적인 업무(TZ) 불분명한 점이 있으면 반드시 명확히 하십시오. 마감일에 대해 논의하십시오.
성공적인 프로젝트의 구성 요소
매력적인 작업을 수행하는 방법을 배워야만 훌륭한 웹 디자이너가 될 수 있습니다. 이상을 추구하려면 극단적으로 치우치지 않는 것이 중요합니다. 좋은 웹사이트를 만들기 위해 필요한 것이 무엇인지 이야기해 볼까요? 그는 같은 것입니다?
- 그는 직관적이고 명확합니다.
수년간 인터넷을 사용하면서 사용자는 대략적인 웹사이트 표준에 익숙해졌습니다. 이것 간편등록, 생성된 프로젝트에 대한 정보입니다. 그러나 모두가 독창성을 추구하기 때문에 경험이 부족한 디자이너는 단순하고 이해하기 쉬운 리소스에서 독특하지만 불편한 리소스를 만들 수 있습니다. 따라서 혁신이 장려됩니다. 완성된 프로젝트는 밝고 독특하면서도 표준에 가까워야 합니다.
- 간단 해.
Google이 왜 그렇게 인기 있고 수요가 많은지 궁금한 적이 있습니까? 그것은 단순성에 관한 것이며 가능한 한 사용자의 언어를 사용합니다. 귀하의 사이트는 흥미로울 것입니다. 하지만 이해할 수 없는 많은 버튼과 옵션은 분명히 불필요할 것입니다.
- 사용자의 시간을 존중합니다.
이것을 눈치채셨나요? 한 사이트로 이동하면 모든 페이지가 빠르게 로드되지만 다른 사이트에서는 시간을 낭비하고 싶지 않을 정도로 시간이 너무 오래 걸립니다. 콘텐츠는 최적화되어야 합니다. 조금만 덜 하면 그래픽 요소, 비디오나 애니메이션 등을 사용하면 로딩 속도가 빨라질 뿐만 아니라 사용자가 귀하의 사이트에 관심을 가질 가능성도 높아집니다.
- 피드백이 있습니다.
소위 피드백은 항상 사이트 방문자에게 사랑을 받고 있습니다. 이 도구는 수요를 분석하고 제품에 대한 의견을 찾는 데 도움이 됩니다. 이 정보는 향후 이 사이트의 소유자가 고객에게 제공하는 콘텐츠나 서비스 자체를 개선하려는 경우 필요할 것입니다.
- 흥미로운 내용으로 가득 차 있습니다.
가장 중요한 것은 콘텐츠입니다. 사람들은 이런 저런 문제를 해결하기 위해 사이트를 방문하며, 양질의 정보 외에도 가독성도 관리해야 합니다. 여기에는 적절한 그림, 글꼴, 색상, 텍스트 구조, 완전성 및 유용성이 포함됩니다.
특수 교육 없이 성공하는 방법은 무엇입니까?
- 배우다.
웹디자인에 대한 다양한 교육과 강좌를 수강해보세요. 항상 비싼 것은 아니며 때로는 무료이기도 합니다. 그러나 이것은 같은 생각을 가진 사람들과 함께 경험이 풍부한 마스터의 지도하에 연습할 수 있는 훌륭한 기회입니다.
- 책을 읽어보세요.
전문 문헌은 전문적 우수성을 향한 길에서 충실한 조수가 될 것입니다.
- 어디서 공부할지에 대한 질문은 어렵지 않습니다. 결국 인터넷은 다양한 것들로 가득 차 있습니다.
- 웹 디자인 용어에 대해 조금 알아보세요.
예를 들어, 무엇입니까? 모듈형 그리드또는 타이포그래피. 새로운 단어가 나올 때마다 전문적인 어휘가 늘어나며 곧 고용주와 고용주의 요구 사항을 이해하는 것이 훨씬 쉬워질 것입니다.
- 언제 받을 수 있나요? 필요한 지식특정 프로그램을 사용하는 경우 초보자로서 다음 작업을 완료하는 것이 매우 유용할 것입니다.
인터넷에서 원하는 사이트를 찾아야 합니다. 다음으로 Photoshop을 다운로드하고 사이트 레이아웃(최소 한 페이지)을 복사합니다. 이 연습을 정기적으로 수행하면 전체 프로세스를 매우 빠르게 작은 단계로 나눌 수 있습니다. 이렇게 하면 첫 DIY 프로젝트를 시작할 때 두려움이 사라질 것입니다.
- 연습은 좋지만 이론과 "씹는"정보 없이는 할 수 없습니다. 따라서 다양한 비디오 튜토리얼과 기사를 공부하는 것이 좋습니다.
예를 들어 egraphic.ru 웹사이트를 볼 수 있습니다.
- 훨씬 간단하게 할 수도 있습니다. 즉, 경험이 풍부한 다른 디자이너의 PSD를 다운로드하고 예시에 따라 직접 레이아웃을 만들어 보세요. 이렇게 하면 꽤 빨리 속도를 낼 수 있습니다.
- 열정이 충분하다면 이미 경험이 풍부한 웹 디자이너를 찾아 교육을 요청할 수 있습니다. 아니면 적어도 스스로 알아낼 수 없는 문제에 대해 미니 상담 일정을 잡으세요.
- 다양한 온라인 프로그램을 활용해보세요.
예를 들어,bannerovich.ru는 배너, 로고 등을 만드는 데 적합합니다.
결론
우리는 웹 디자인을 마스터하는 데 더 가까이 다가갈 수 있는 몇 가지 단계에 대해 논의했습니다. 시간 자기 교육처음부터 시작하는 데는 보통 5~6개월이 걸립니다. 이것은 모두 순전히 개인이며 개인 자신의 능력과 능력에 달려 있습니다.
따라서 한두 달 안에 훌륭한 결과를 얻을 수 있는 전문 교육도 있다는 것을 잊지 마십시오.
성공적인 노력을 기원합니다! 모두 제일 좋다!
