모든 UI 디자이너가 알아야 할 최고의 UI/UX 팁과 요령

 

1. UI 디자인에 시각적 단서 추가하기
시각적 요소는 학습과 사용자의 디자인 상호작용을 훨씬 더 매력적이고 기억에 남게 만듭니다. 시각적 단서는 단순히 디자인에 감각이나 개성을 더하는 것 이상의 역할을 합니다. 시각적 단서는 사용자가 메시지를 더 빨리 이해하고 정보를 더 쉽게 파악할 수 있도록 하여 전반적인 사용자 경험을 향상시킵니다.

 

시각적 단서가 어떤 영향을 미치는지 다음 디자인을 비교해 보세요:

이제 시각적 단서를 사용하여 더 나은 이메일 메시지 UI를 디자인한 또 다른 예를 살펴보겠습니다. 첫 번째 디자인에서는 시각적 단서의 원리를 적용하지 않은 UI를 볼 수 있습니다. 이 UI 디자인은 기능적이지만 사용자 경험을 향상시키고 이메일 받은 편지함의 전반적인 사용성을 개선할 수 있는 기회가 있습니다.

이메일 받은 편지함이나 메시징 앱에서 색상 세트와 가운데에 첫 글자가 있는 아이콘을 사용하면 창의적이고 시각적으로 매력적인 방법으로 발신자를 나타낼 수 있습니다.

2. 아이콘과 이미지로 이메일 받은 편지함 UI 개선하기
이제 시각적 단서를 사용하여 이메일 메시지의 UI를 개선한 또 다른 예를 살펴보겠습니다. 첫 번째 디자인에서는 시각적 단서의 원리를 적용하지 않은 UI를 볼 수 있습니다. 이 UI 디자인은 기능적이지만 사용자 경험을 향상시키고 이메일 받은 편지함의 전반적인 사용성을 개선할 수 있는 기회가 있습니다.

이메일 받은 편지함이나 메시징 앱에서 색상 세트와 가운데에 첫 글자가 있는 아이콘을 사용하면 창의적이고 시각적으로 매력적인 방법으로 발신자를 나타낼 수 있습니다.

 

발신자를 더 효과적으로 표현하는 방법은 사람 이미지와 회사 로고를 사용하는 것입니다. 이를 통해 사용자는 발신자를 쉽게 식별하고 메시지의 맥락을 빠르게 이해할 수 있습니다.

 
3. 그림자 색상을 배경과 일치시키기
그림자의 색상을 배경과 일치시키면 디자인의 일관성에 큰 차이를 만들 수 있습니다.

연한 보라색 배경의 예시를 통해 이를 살펴보겠습니다. 첫 번째 경우에는 요소에 회색 그림자가 적용되고 두 번째 경우에는 그림자가 배경과 일치하는 보라색 색조를 띠고 있습니다.

첫 번째 예의 회색 그림자는 안전한 것처럼 보일 수 있지만 실제로는 밝은 보라색 배경과 충돌합니다. 시각적 조화가 깨지고 결과가 어색하게 느껴집니다. 반면에 두 번째 예시에서는 보라색 그림자가 배경과 매끄럽게 어우러져 시각적으로 매력적인 디자인이 만들어집니다.

이 트릭을 배우면 컬러 배경에 순수한 회색 또는 검은색 그림자를 다시는 사용하지 않을 것입니다. 디자인을 개선하여 보다 일관성 있고 매력적인 UI를 만들 수 있는 쉽고도 영향력 있는 방법입니다.


출처: https://medium.com/@uxpeak.com/top-ui-ux-tips-tricks-every-ui-designer-needs-to-know-about-part-5-0856f07e09a6

 

 

 

---

 

엔엑스웹 홈페이지 바로가기홈페이지 제작 견적 문의 바로가기

 

 

---