UX디자인 - A guide to the Modern Minimal UI style

 

Bright backgrounds and whitespace

1. Bright backgrounds and whitespace

 // 밝은 배경과 여백이나 공백

 // 배경은 대부분 밝거나 흰색으로, 여백을 신중하게 사용하여 인터페이스를 깨끗하게 보이는데 목적

 

 

---

 

Subtle roundness on UI elements

2. Subtle roundness on UI elements

 // UI 요소의 테두리 원형

 // 적당하고 미묘한 둥근 테두리의 시대가 왔다. 

 

---

 

Big, readable headings

3. Big, readable headings

 // 크고 읽기 쉬운 제목

 // 볼드한 느낌의 제목 요소, sans-serif 또는 serif 중에서 선택할 수 있지만, 개인적으로 Gilroy, Sofia Pro, Lufga 또는 Circular와 같은 인기 있는 기하학적 산세 리프를 고수하는 것이 좋다.

 

---

 

Real-life photography

4. Real-life photography

 // 실제 상태의 사진

 // 2021 년 디자인 트렌드에 대한 기사에서 실제 사진의 컴백을 예고! 유치한 3D 렌더링, 납작한 사람, 손으로 그린 낙서에 서서히 질렸.. 실제 사진의 큰 장점은 디지털 제품에 현실감을 더 해준다

 

---

 

Thoughtful use of colors

5. Thoughtful use of colors

 // 신중한 색상 사용

 // 모던 미니멀 스타일은 색상에 있어서 매우 미니멀함 

 

 

---

 

Focus on contrast

6. Focus on contrast

 // 명암의 대비효과에 포커스 맞추기

 // 대비가 충분하면 배경과 요소를 쉽게 구별하고 시각적 계층 구조를 이해하며 인터페이스를 쉽게 사용할 수 있다

 

 

---

 

Limited use of effects

7. Limited use of effects

 // 제한된 효과 사용

 // 컬러풀한 그림자, 흐릿한 오로라 배경, 엠보싱 및 글라스 효과도 환영

 

 

---

 

Small details, often illustrated

8. Small details, often illustrated

 // 작은 디테일, 일러스트

 // 아이콘, 그림이모티콘 및 패턴과 콜라주와 같은 기타 그래픽 요소와 같은 작고 친근한 요소를 수용

 

 

 

참조링크

 - https://uxdesign.cc/a-guide-to-the-modern-minimal-ui-style-531ac1e9fbfe

A guide to the Modern Minimal UI style

 

 

 

 

 

※ 여백(餘白)과 공백(空白)

 공백을 사전적의미로 검색해보면 글씨나 그림이 없는 빈 곳. 여백(餘白)이라 한다.

 여백은 종이와 같은 평면에 그림이나 글씨가 채워지지 않고 남은 빈부분이라 한다.

 사전적의미로 볼 땐 동의어로 묶일 수 있지만 그 뜻을 그대로 들여다보면 공백은 그저 비어있는 곳을

 여백은 비어있는 공간과 중심이 되는 대상이 조화를 이루는 계산된 여백을 뜻한다 생각한다.

 white-space속성은 여백, 공백, 공란, 띄어쓰기를 의미한다.

 

※ border-radius (둥근모서리)

  둥글 둥굴 한 글씨체보다 sans-serif 같은 딱딱한 서체를 좋아하는 나로 써는

  현재 변하고 있는 코너가 둥근 형태의 이미지나 버튼에 적응하기 힘들지만 유행은 맞춰가야 하니까 😂

If you know the latest craze called Clubhouse, you’re probably familiar with their rounded avatars. They make the whole product look more original and distinctive!

  Clubhouse의 둥근 아바타들이 독창적으로 유일하게 보이는 건 당연한 거 아닌가?

 그 동안 뾰족한 코너의 모서리들이 여기저기 분포되어있다보니..

 

 

※ 폰트

https://www.dafontfree.io/gilroy-font-family/ 

Gilroy Font Family - Dafont Free

https://fonts.adobe.com/fonts/sofia

Sofia | Adobe Fonts

https://fontsup.com/ko/font/circular-regular.html

Circular Regular 무료로 글꼴 다운로드

 

 

※ 일러스트가 배경으로 잔뜩 들어간 웹사이트는 당분간 못 볼 듯 만세🤸‍♀️🤸‍♂️

 - 그러나 오늘 dbcut에서는 일러스트가 가득한 https://seoulland.co.kr/ 가 업로드되었다

 

 - 우리나라 웹디자인은 올 하반기부터 서서히 바뀌지 않을까 싶다. 

 

 - 전체적으로 글 읽자마자 생각났던 건 얼마 전 업로드된 https://www.kakaocorp.com/page/  (둥글둥글)

   -  와중에 카카오 주식 많이 올랐던데.. 😅😅😅