티스토리 뷰
글래스모피즘(Glassmorphism)이 점점 인기를 얻고 있습니다.
dribble에서 글래스모피즘을 검색하면 많은 디자인 시도를 확인해 볼 수 있습니다.
2020년에는 뉴모피즘(Neumorphism)이 트렌드였으나 내년에는 글래스모피즘이 새롭게 떠오르지 않을까 예상해봅니다.
글래스모피즘은 배경에 블러(Blur) 효과를 준 것을 기반으로 하는 디자인입니다.
글래스모피즘 디자인을 보면 불투명한 유리를 댄 것 같은 느낌을 받을 수 있습니다.
Mac에서는 전부터 배경 블러 효과를 이용한 글래스모피즘 스타일의 디자인을 사용해왔습니다.
그리고 이번 빅서(Big sur) OS에서 더욱 이런 스타일이 강화된 것을 볼 수 있습니다.
글래스모피즘의 특징은 아래와 같습니다.
- 투명도 (Background blur를 사용한 불투명한 유리 효과)
- 공간에 물체가 떠있는 듯한 레이어 계층(수직적인 층계)
- 불투명함을 강조하기 위한 선명한 색상
- 불투명한 오브젝트의 미묘하고 연한 테두리.
출처: https://uxdesign.cc/glassmorphism-in-user-interfaces-1f39bb1308c9
그림자를 세세히 설정해줘야하던 뉴모피즘 스타일에 비해 글래스모피즘은 투명도를 조절하는 방식으로 적용하기 쉬운 편이지만 더 편하게 시도해볼 수 있도록 도와주는 강의와 사이트를 소개합니다.
1. 글래스모피즘(Glassmorphism) 강의
스케치(Sketch)와 피그마(Figma)에서 글래스모피즘 디자인을 하는 방법을 알려줍니다.
2. 글래스모피즘(Glassmorphism) CSS
슬라이더 조작으로 간단히 글래스모피즘 css 코드를 작성해주는 사이트입니다.
Glassmorphism - simple CSS generator
Glassmorphism UI CSS generator
glassmorphism.com
더 자세한 글래스모피즘에 대한 이야기는 아래의 링크를 참고하세요.
https://uxdesign.cc/glassmorphism-in-user-interfaces-1f39bb1308c9
Glassmorphism in user interfaces
Another year, another UI trend is becoming increasingly popular among designers. Do you know it yet?
uxdesign.cc
뉴모피즘 디자인이 궁금하다면..
https://cheesechaos.tistory.com/7
뉴모피즘(Neumorphism) 디자인
뉴모피즘(Neumorphism) 디자인은 디자인 커뮤니티 Dribble의 디자이너 Alexander Plyuto로 부터 시작됐습니다. 뉴모피즘 스타일은 그림자와 빛으로 요소와 배경을 구분하여 부드러운 느낌을 주는 것이 특
cheesechaos.tistory.com
'design' 카테고리의 다른 글
| 저작권 걱정 없는 무료 이미지(Free images for commercial use) (0) | 2020.12.03 |
|---|---|
| 디자인에서 폰트 사용(Fonts in use) (0) | 2020.12.01 |
| 이미지 용량 줄이기(Image compression) (0) | 2020.11.30 |
| 뉴모피즘(Neumorphism) 디자인 (0) | 2020.11.25 |
| 파비콘(Favicon) 생성 (0) | 2020.11.25 |