알아두면 좋은 (UIUX)디자인 기초지식
안녕하세유?
[기본에 충실하라] 라는 말이 있듯 모든 것은 기본기만 있어도 반은 먹고 들어가기 마련인데요.
그래서 이번에는 내 작업물이 뭔가 이상하다, 뭔가 구리다 싶을 때 돌아보고 체크해보면 좋을 기초 지식 몇가지 알려드리겠습니다.
이제 막 시작하시는 분들도 한번 참고하고 시작해보면 좋겠죠?😆
시작하기에 앞서, 제가 작성한 것들은 모두 제 경험에서 비롯한 것이니 틀린 것이 있거나 아리송한 부분이 있어 문제가 생길 시,
다 님 말이 맞으니까 제껀 고냥 참고만하세요 하하!
모든 것에 정답은 없잖아유?
흰 것은 배경이요, 검은 것은 글씨로다?
사실 요즘은 까만 것도 배경이 될 수 있는 시대긴 하죠? 다크모드가 잘 정착했으니 말이에요!
근데 그거 아세요? 하얀 배경에서 온연한 까만색은 잘 쓰지 않는다는 사실을?!
여러분!!! 동네 사람덜!!!!!! 이거 보세요! 이거 아셨냐고요~!
우리가 자주 이용하는 네이버와 같은 곳들에 마냥 까만 글씨인 줄 알았던 폰트들이 사실은 완전한 까만색인 #000000은 아니라는 것이에요.
이렇게 나 좀 괜찮다 하는 곳들은 보통 어떤 특정 목적이 있지 않는한 순수 검정색은 글에서 잘 쓰지 않습니다.
차이를 아시겠어요? 진짜 미세한 차이긴 하거든요.그렇지만 이 미세한 차이가 눈의 피로도나 가독성을 달리할 수 있다는점..!사실 지금 당장 체감을 못할 수 있지만 장시간 글자에 노출 되었을 때, 명도 대비가 비교적 적기 때문에 눈에 피로도가 조금 적다고 해요.뿐만 아니라 순수 검정색은 다른 색상과 사용했을 때, 유독 튀어보이거나 조화를 방해해 시선을 분산시키고 내 소중한 디자인 자체에 촌스러움을 줄 수 있답니다? 때문에 #000000을 쓸 때는 지금 진행 중인 내 작업물에 잘 어울릴지와 용도를 확인해보고 신중히 사용하는 것을 추천드려요.
그럼 여기서 반대로 다크모드일 때는,
Q. 비슷한 이유로 완전한 하얀색을 잘 안쓰나요?
A. 네!! 눈이 부시니까요! (?)
네 극단적인 하얀색은 시력에 안좋을 수 있답니다. 그렇지만 일반모드에서 완전한 검정색은 잘 사용하지 않는 반면에 사실 다크모드에서 완전한 하얀색은 자주 쓰긴합니다.긴 글이 아닌 타이틀 같은 잠깐 읽으면 되는 부분에 사용하고 장시간 눈이 머무르는 곳에서는 잘 쓰지 않는 편이에요.
강약조절
자 이제 검은색이 다 같은 검정색이 아님을 알았지만,엄청 연한 검정색, 일반 연한 검정색, 보통의 검정색, 진한 검정색 등등등 쓰임새가 다양합니다.실상 구글에 그레이스케일만 검색해보 검은색부터 회색을 거쳐 하얀색이 나오는 팔레트가 나오죠. 거기서 하나 가져와서 활용해보세요.아무튼.
자, 이 프로필 카드영역에서 가장 중요한 부분이 어디라고 생각하세요?일단 프로필이라는 것 자체가 누구인지를 파악해야 하는 역할이니 제 생각엔 이름이 가장 중요하다고 볼 수 있겠는데요?
제 기준 우선순위를 정해보자면,
1 → 2 = 5 → 3 → 6 → 4 이 순서라고 생각해보겠습니다.
물론 사용자에 따라서 이미 이 대상에 대해 잘 알고 있거나 어떤 다른 경험이 있다면 우선순위는 달라져야겠습니다만..
모든 정보는 잘 보여야하지만 기본적으로 이 중요한 것들 중에서 더!! 잘 보여야하는 것들과 조금은 힘을 빼줘도 되는 부분이 있는데요.
사용자 기준으로 생각했을 때, 가장 알고싶을 정보가 무엇인지 우선 순위를 매겨 본 후 폰트에 색상과 두께를 통해 힘 조절을 할 수 있습니다.
예시를 살펴보면 변경 전은 확실히 모든 요소들이 야야 얘들아!! 나 좀 봐라!!! 하고 있는 상태인 반면에,
변경 후는 뭔가 더 안정감 있고 강조 돼야할 부분들이 쏙쏙 다 보이는 것 같은 느낌이 들지 않.나.요.? ^__________^
딱 색상과 두께만 바꿨는데도 큰 차이가 있으니 내 작업물이 뭔가~~ 이상하다면 과감하게 우선순위를 다시 정해보는 것도 좋습니다.
행간과 자간 기본으로 쓰고 싶다고!!
행간과 자간은 정말 차이를 분명하게 느끼지 못하기도 하고 괜히 그냥 auto로 쓰는 경우도 많지만그럼에도..! 지켜줘야하는 부분이니까 뭐 시작할 때 텍스트도구 눌렀다면 걍 바로 바꿔버리고 시작하세요들.
행간팁 -
본문글에 행간은 보통 하나하고 반절을 더한 값이 가장 가독성이 좋다고 ..! 우리 교수님이 그랬어요.근데 배울 땐 "뭐허 행간이 그게 그거지..~" 싶었는데, 확실히 두개 놓고 비교해보면 차이가 분명하게 납니다.왼쪽 auto 보다는 오른쪽 1.5배가 더 잘 읽히는 것 같지 않나요? 예를 들어 폰트 사이즈가 36이라면? 행간은 1.5배인 54정도 이상은! 나와줘야 잘 읽힌다는 것이에요.
(일반적으로 본문에 36을 사용하진 않습니다만, 예시니까 예.. 고냥 네 - ..)
그러면..! 본문이 아닌 타이틀에서도 행간을 1.5배로 주면되냐?
아닙니다요. 행간은 또 달라요..
타이틀에서도 1.5배는 사실 너무 넓거든요.
오히려 응집력도 떨어지고 가독성이 안좋아져 뭔가 애-매한 느낌을 받으실 수 있어요.
그래서 저같은 경우에는 띄어쓰기한 자간과 동일하거나 그에 비슷한 정도로 행간을 최대로 좁혀줍니다.
예를 들어 띄어쓰기 간격이 18일 경우, 행간도 18정도로 최대한 줄여줍니다.
여기서 정답은 사실? 없어요. +-18로 더 안정적이고 잘 보이는 행간을 찾아 사용해주도록 합시다~
자간팁 -
자간은 솔직하게 고백하자면 저도 차이가 기가막히게 보이진 않는데요?
하지만 폰트마다 조금씩의 차이가 있고 너~~~무 넓거나 너~~~무 좁으면 안보이기 마련이니 약간의 조정을 통해 가독성을 높혀주면 되겠습니다.
보통 0 보다는 -0.3 ~ - 0.4가 좋다니 참고하시어 더 좋은 작업물을 이끌어 내시길..-
기본이란..
기본이란게 진짜 끝도 없이 많습니다만 .. 오늘은 여기까지만 할게요.
실무에서는 그냥 다 필요없고 빨리 해달라고 하면 기본이고 나발이고 다 신경 안쓰고 막 하는 경우가 많거든요.
그래도 안쓰더라도 알고는 있자! 이 말이에요 호호
되도록 쓸 수 있도록 노력도 하고욤ㅎㅎㅎㅎㅎ
그람 이번주도 무탈 마무리 하시길ㄹㄹ~🍀