brunch

You can make anything
by writing

C.S.Lewis

계정을 잊어버리셨나요?

by Grace Aug 10. 2020

UI디자인을 갑자기 예뻐보이게 만들 수 있는 9가지 팁

디자인을 향상시킬 수 있는 쉬운 실용적인 팁(번역)

아름답고 사용성 좋고 효과적인 ui를 만드는 것은 많은 수정사항을 요구하며 시간이 오래 걸립니다. 여러분은 클라이언트와 사용자, 그리고 스스로가 진정으로 만족하는 무언가를 만들기 위해 끊임없이 수정한다는 것을 알고 있어요. 저도 여러 번 그래왔습니다.

하지만 저는 간단한 시각적 수정이 여러분이 만들려고 했던 디자인 결과물을 빠르게 향상시킬 수 있다는 것을 몇 년에 걸쳐서 알아냈습니다.

이 글에서 저는 여러분이 적은 노력을 들이고 실행에 옮길 수 있는 쉬운 팁 몇 가지를 준비해 왔습니다.

이것이 여러분의 지금 하고있는 디자인을 당장 향상시켜줄 뿐만이 아니라 당신의 다음 프로젝트를 시작할 때 유용한 지침이 될 수 있기를 바랍니다.

어떤 특정한 요소에 다양한 드롭 쉐도우를 사용하거나, (그림자보다 살짝 어두운색의) 미묘한 테두리를 사용하는 것은 그 요소를 더 명확하고 눈에 잘 띄게 해 줍니다. 그리고 진흙같이 구분이 되지 않는 그림자를 피할 수 있게 해 줍니다.

여러분이 당신의 디자인을 만들 때 1가지의 서체만 사용하는 것이 좋습니다. 그리고 때때로 이렇게 하는 것은, 훨씬 강력하고 일관적인 디자인 결과물을 만들어 내는 데에 도움이 됩니다.

블로그 포스트나, 프로젝트 설명같은 긴 형태의 콘텐츠를 만들 때라면 본문 서체 크기로 20pt나 또는 그 이상의 pt 를 적용해 보세요.

물론 이것은 당신이 선택한 서체에 따라 다르겠지만, 인기있는 본문 서체들은 대부분 20pt가 적당합니다. 그리고 사용자가 텍스트 더미를 마주했을 때 가독성이 좋습니다. 18pt는 너무 옛날 말이예요.

엄지가 닿는 위치에 스킵 링크를 걸어서. 사용자들에게 하여금 언제나 모바일 앱 온보딩 시퀀스를 건너뛰는 것이 가능하게 해 주세요. (스플레쉬 페이지를 건너 뛰는 기능을 제공하세요!)

2020년에도 엄지손가락이 사용성을 지배하고 있다는 걸 잊지 마세요.

그림자가 항상 하나의 광원으로 생긴다는 것을 확실하게 하세요. 이것은 간단한 일이지만 때때로 실수하기 쉬운 부분입니다. 그림자를 반드시 한 방향으로 생기게 해야 해요.

우리는 해가 여러 개인 세상에서 살고 있지 않다는 사실을 기억하세요.

이미지 위 어디에 텍스트가 위치하는가에 따라 텍스트와 이미지의 구분을 명확하게 하기 위해 여러분은 전체 이미지 오버레이를 할 것인지, 혹은 더 옅은 아래서 위로 올라오는 그라데이션이나 위에서 아래로 내려오는 그라데이션을 사용할지 선택을 하면 됩니다.

가운데 정렬 텍스트를 제목과 텍스트의 작은 구절에만 사용하세요. 웬만해선 텍스트들은 왼쪽 정렬하세요.

흰 영역과 네거티브 영역은 여러분도 알 것입니다. 이것들을 넉넉하게 사용하거나 적당히 사용하되, 잘 사용하세요.

심지어 단지 적은 양의 흰 영역은 디자인이 숨 쉴 공간을 주고 훨씬 세련되어 보일 수 있습니다. 이것은 여러분의 디자인을 개선하는 데 빠르고 간단한 방법 중 하나입니다.

밝은 배경 위에 있는 텍스트를 너무 밝게 처리하지 마세요. 멋져보이는 디자이너들이 아직 이렇게 하는 것 같지만 여러분은 그것보다 더 똑똑해야 합니다. 그리고 더 사용성 좋은 인터페이스를 원하잖아요 그죠?

이 글은 Marc Andrew가 쓴 9 tips to quickly improve your UI designs을 번역한 글입니다.

keyword

Grace 소속 직업 디자이너

운동 좋아하는 UX, UI 디자이너

구독자 365

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari