디자인 뭐부터 시작하면 될까? uiux 디자인? 웹디자인?

uiux디자인 ? 웹디자인 ?

결론부터 말하자면 이 두 디자인 분야는 나눌수가 없다

 

자체적으로 포괄되는 개념이 있고 상충되어야하는

필수 불가결한 요소들이 들어있기 때문이다 (ex : 제품 디자인 또한 uiux 디자인이라고 말할수 있다)

 

물론 본인이 선택할수있는 디자인 분야로의 진로 개척후

 

 

원하는 형태의 디자인을 만들어 나갈수 있는 환경이 구축되어있다면 ?

사실 이런 환경 만큼이나 이상적인 환경은 없을테지만

대부분의 디자이너들에게는 우연찮은 계기에 

새로운형태의 디자인 분야를 접하고 각자 환경에 맞는 컨셉으로 구축해 나가는 형태의 근무환경이 조성된다

 

일단은 신입이 웹디자이너가 될려면 어떠한 조건들이 뒷받침 되야할까?

현직 시니어 디자이너들의 조언은 단연 "기본기"이다

이곳에서 말하고자 하는 기본기의 요소들을 "pc wab:으로 가정을 해보자면

 

1. 해상도적인 측면에서

노트북 pc 등의 다양한 저해상도 모니터도 다 고려할수있는 와이드값을 알고 있는가? 모르고있는가?

이런 요소들이 상당히 중요하다 (사실상 이걸 모르고 디자인이 시작되는 경우 제대로된 디자인이 나올수 없다는 의견이다)

 

또한 다양한 형태로 디자인되는 웹사이트상의 와이드값의 기본적인 요소들과 제작 의도를 분석해야한다

why ? : 1320px , 1080px 이런 기준점을 가지고 디자인을 해야한다 

 

2 . 폰트의 기준점이 있어야한다

웹에서는 폰트크기 몇을 써줘야 하는지 모바일에서는 최소 몇을 써줘야 하는지 등의 기준점

(폰트사이의 간격,행간 , 자간은 몇정도가 적당한지)

이 부분에 대한 기준점은 없지만 업계에서 많이 사용되고있는 크기들이 존재를 한다

ex)11폰트 이하는 가독성측면에서 많이 떨어지므로 사용하지 않는다 ,

모바일의 경우도 몇폰트 이하는 너무 작아 보이므로 사용하지 않는다

 

이러한 공부를 하기에 가장 이상적인 매체는 어느곳들이 있을까 ? 

벤치마킹의 사례로 가장 많이 손꼽히는 유명 포털 사이트를 중점으로 두고 공부를 시작하면 도움이 많이되며

접근성 측면에서도 상당부분 고려하여 디자인 되므로 초보 디자이너라면 반드시 거쳐야할 필수 관문중 하나이기도 하다

 (추천 사이트 : 네이버 f12누른이후 어떤 폰트와 어떤 자간 행간을 사용하는지 면밀하게 분석을 해본다 이후 사용된 동일 폰트를

나의 창작물에 고스란히 담아본다 )

 

 

모바일의 경우는 어떻게 보면 좋을까 ? 

모바일을 캡쳐한 이후 화면을 그대로 pc로 가지고 온다 이후 동일 비율을 확인해준 이후 행간 , 자간 , 폰트등을 분석한다 

(이 부분에서 가내수공업이 좀 들어간다)

 

3.운율감 pc에서 사용하는 운율감과 모바일에서 사용하는 운율감은 다르다

보통pc의 경우 (강>약>중간>강)의 순서로 전개된다.

 

레이아웃의 대한 구성이나 컬러에 대한 구성

쉬운 예로 예시를 들어보자 

메인배너에 색상을 강렬한 레드컬러로 잡았다고 가정해 보자 밑의 띠 배너가 강한 보라색으로 들어오는 경우는?

난잡한 디자인이 만들어 질것이 눈에 훤하다 

메인의 컬러가 강하면 아래의 띠배너는 약하게 풀거나 중간정도로 운율감을 맞춰주는 훈련을 해주는것이 중요하다

물론 이러한 것들이 정답이라고 할수는 없으나 

 

이런 일련의 훈련들을 통해서 운율감을 익혀나가는 것이다

해당 사례의 경우 컬러에 대한 이야기를 하였지만 레이아웃에 대한 운율감도 있다

상단에 4단을 사용했다면 밑에는 2단을 사용하여 디자인 하여보는것이다 

그 다음3단 1단의 방식으로 계층구조 자체에 특이성을 부여해주는것이다 

 

상단4단 그 바로밑에 4단의 계층구조로 레이아웃 디자인시

계층구조가 단순해지므로 배치가 재미 없어지고

레이아웃이 운율감이 없이 완성되어 전반적인 디자인이 재미없게 나온다 

(물론 배너 , 컬러 , 그래픽 등으로도 재미요소들을 제공해줄수는 있다)

디자인을 어떻게 푸느냐에 따라서 사이트 자체의 느낌이 전혀 달라지는 것은 이러한 이유 때문이기도 한다

대부분의 신입들의 경우 이미지도 복잡하고 레이아웃도 복잡하고 이미지도 강하게 쓰고 컬러도 쎄게쓰고

이렇다 보니 사이트 자체에 집중할수 있는곳이 없는것이다  

 

그렇다 보니 가독성이 떨어지는것이다 

pc웹디자인의 경우 한가지 요소에 집중되도록 디자인 하는것이 매우 중요하다

 

그러면

 

모바일의 경우에는 어떻게 디자인 되어야할까 ?

 

모바일의 경우에는 한 화면에서 단순하게 보여주는 레이아웃이 매우 중요하다

옛날에는 한 화면에 많은량의 정보를 보여주는 디자인이 유행이었다면 현재는 

한화면에 큼직큼직하게 보여주는것이 유행이다

 

시대가 바뀌었다 

스마트폰 초기 도입 시절에는 젊은층의 사용이 앞도적이었다면 (early adopter 성향의 소비자들)

현재는 다양한 연령층이 스마트폰시장에 유입되어 시장에서 제공하는 편리성의 수혜를 받고

리뷰하고 피드백을 제공해주는 시장이 형성되었으니 말이다

 

이러한 유입량에 따라 모바일디바이스화면에 사용자들이 점점 익숙해지고 있다는것을 알수있다 

이 부분이 시사하는바라고 한다면 폰트의 크기가 점점 커지고 있다는 점이다

(고령의 사용자들에게도 편리성을 제공해야하기 때문이다)

(어차피 복잡한 형태의 ui를 사용한다고 하더라도 사용자들의 집중도만 흐트러트릴뿐 사용성에는 아무런 도움이 되지 않는다)

깔끔하고 , 정갈하고 , 정리되어있고 , 심플하고

이러한 원칙을 적용하여 사용자에게 접근성을 유도하여야 하는것이다

 

 

4.모바일의 핵심은 버튼의 크기와 간격

 

돋보기아이콘과 마이페이지아이콘이 함께 붙어있다고 예시를 들어보자

이 예시에서 간격의 중요성을 언급하는 이유는 "손가락의 두께"때문이다

두개가 동시에 눌려서 버튼이 선택되지않는 경우가 발생하는걸 미연에 방지하기 위해서

 

적정 간격을 고려하여 디자인하는것은 매우 중요하다uiux 디자인? 웹 디자인?