요즘 핫한 마케팅 트렌드만 소개하던 테사의 main job은… 의외로 AE가 아니라 디자이너라는 사실.
오늘은 부캐 끄고 본캐 켜봤습니다. 콘텐츠위드에서는, 디자인 작업을 진행하게 되면 기본적으로 모니터 화면을 고려하여 진행합니다. 다양한 사례의 웹용 디자인 작업을 활발하게 진행하고 있는 만큼, 디자인 트렌드를 참고하여 작업하는데요!
그렇다면 어떤 트렌드를 주로 참고하는 것이 좋을까요? 디자인은 범주가 굉장히 광활하지만 그 중에서도 모바일 UX 디자인은 가장 빠르게 발전하고 역동적으로 변화하며 해마다 새로운 트렌드를 선도하고 있습니다. 유행은 한 번쯤 따라줘야 하니까~
21년 올해의 디자인 트렌드, 그 중에서도 모바일 UX 디자인 트렌드를 살펴보시죠.
맥시멀리즘 테사가 존경하는 미니멀리즘
심플한 것이 베스트라는 진리를 따라 트렌드를 선도하고 있는 미니멀리즘. 사용자들은 한층 고차원적으로 발전하고 스마트 해진 덕분에 “디자인”보다는 “본질”이 중요하다는 것을 알게 되었습니다. 화려한 것들은 되려 눈과 뇌를 지치게 할 뿐. 따라서 디자인만 화려한 것은 제작자도, 사용자도 중요하게 생각하지 않는 것이죠.
미니멀 하게 컨셉을 잡으면 디자인하기가 편한 것은 아니겠죠. 중점 메시지를 보다 수월하게 전달하면서, 밋밋하지 않되, 효율적인 디자인을 해야 하니 만드는 사람의 상당한 창의력과, 보는 사람의 수용력이 요구됩니다.
특징을 적절히 강조하는 미니멀리즘을 아는 당신… 테사가 아주 많이 사랑합니다.
왜 이렇게 사랑을 받을까? 뉴모피즘
스큐어모피즘과 평면 디자인의 조합이라니, 상상이나 해봤을까요? 방향성이 다른 2가지 요소가 합쳤더니 최고가 되었습니다.
초현실적인 디자인이었던 스큐어모피즘과 미니멀한 플랫 디자인은 각각 트렌드의 한 자락을 잡았던 기법들입니다. 가까운 과거에는 미니멀하고 깔끔한 디자인이 유행이었지만, 그 전에는 가능한 많은 효과와 공을 들인 디자인이 유행이었습니다.
흔히 접할 수 있는 핸드폰 화면만 보아도 알 수 있죠.
현실을 담은 듯한 아이콘이었던 IOS4를 보세요. 보다 사실적인 형태로 묘사 되어있는 아이콘들입니다. 기능 자체가 곧 일러스트로 표현되고, 그 일러스트가 그라데이션과 입체감을 굉장히 살린 디자인입니다.
반면 IOS8은 보다 아이콘이 간소화되었습니다. 심플하고 깔끔하며, 직관적입니다. 디테일 하게 표현하지 않아도, 플랫한 아이콘만 보고도 기능을 파악할 수 있도록 디자인한 것이죠. 애플의 디자인 흐름만 보아도, 한 획을 그은 트렌드를 반영하며 인터페이스를 발전시켜 왔습니다.
그리고 지금, 사실적이고 입체적인 스큐어모피즘과 깔끔한 플랫 디자인이 적절히 섞여, 뉴모피즘 디자인이 트렌드의 한 획을 그었습니다. 적절한 대비 효과와 자연스러운 입체감으로, 화면으로 봐도 버튼처럼 보이게 합니다.
단순히 예쁘다고 노 룩 패스? 멈춰! 디자인은 쓰임에 따라 달라져야 하는 만큼, 뉴모피즘은 시인성이 떨어질 수 있으므로 율격을 갖춰야 하는 자료에는 응용하기 어렵다는 단점이 있습니다. 접근성이 낮다는 평가도 있죠. 따라서 뉴모피즘을 적용해보기 위해서는, 포인트 컬러와 백그라운드 컬러의 대비가 명확한 컨셉에서만 사용하길 권장합니다. 실제로 UX / UI 디자이너분들의 의견을 들어보면, 뉴모피즘은 ‘사라졌으면 하는 트렌드’라고 합니다. (주관적 의견) 여론을 보며, 문득 “왜 그럴까?” 궁금해졌습니다. 궁금한 건 못 참는 애기 테사. 슨배님들께 직접 물어보기로!
깔끔하지만, 활용했을 때의 직관성과 시인성이 저하될 수 있기 때문에 적용된 실사례를 찾기는 힘들다고 하죠. 아직까지는 뉴모피즘 보다는 플랫이 훨씬 많이 적용되고 있습니다.
‘아름다울 美’ 중 제일은 ‘여백의 美’라…
뷰티 업계라면 빼놓지 않는 방식, 바로 여백을 적절히 살린 디자인입니다. 여백은 디자인 오브젝트들의 공간을 적절히 확보하여 다양하게 쓰이는 것입니다. 여백을 활용함으로써, 강조하고 싶은 것만 강조할 수도 있고, 전체적인 균형을 맞출 수도 있습니다. 전달하고 싶은 중점 메시지가 있다면, 그 메시지만 보여줄 수도 있습니다.
여백은 단순히 공백이 많은 것을 이야기하는 것이 아닙니다. 한 면에 정보가 꽉 찬 신문에서도 여백은 적절히 활용되고 있습니다.
웹 또는 모바일에서 활용되는 시안의 여백활용은 대개, 공간을 적당히 남겨두는 디자인이죠. 합당하게 공간을 남겨 여백 활용을 잘 하는 것은 보다 집중력을 높이게 됩니다. 이는 오브젝트에 명확한 중요 순위를 보여주며, 해당 위치에 ‘왜 놓여야 하는지’ 또는 ‘왜 이렇게만 배치하였는지’에 대한 필연성을 자연스럽게 느낄 수 있도록 합니다.
많은 사람들은 ‘무엇인가 부족해 보인다’거나, ‘하다 만 것 같다’는 평가를 하기도 합니다. 이 말인 즉슨, 공간을 살리려면 ‘정보가 충분히 전달 되었는가’에 대해 숙고해야 한다는 뜻이겠죠!
그래도 여백을 살리는 디자인은, 언데드처럼 살아주길. A-men…
The night is darkest… 다크모드
다크모드는 작년부터 트렌드로 자리 잡아, 구글 / 애플 / 인스타 등 많은 브랜드에서도 지원하고 있죠?
많은 분들이 즐겨 쓰는 다크모드의 본질은 인체 공학적인 개선입니다. 어두운 테마를 사용하여, 눈의 피로를 덜어주고, 모바일의 경우 배터리 소모량을 줄여줍니다. 밝은 빛을 줄여, 조명이 없는 곳에서 더욱 쉽게 화면을 볼 수 있게 해줍니다. 이런 디자인을 응용하여 트렌디 하며 시각적으로도 편한 디자인으로 응용할 수 있습니다. 다크모드의 느낌을 살리기 위해서는, 완전한 블랙 컬러가 아니라, 적당히 어두운 그레이 계열 사용을 권장 드립니다. 검은색을 사용할 경우 대비 효과가 극대화되어 다크모드의 본질과는 멀어질 수 있습니다.
하지만, 가시성을 위해 ON 컬러를 잘 활용해야 합니다. 새하얀 색상은 피하되 적당히 대비되어 보이는 반전색을 사용해주세요. 다크모드는 모든 화면이 어두운 톤으로 다운되는 만큼, 정보의 우선 순위에 따라 깊이감에 차이를 주어야 합니다. 네이버의 다크모드를 보면, 네비게이션 BAR는 모두 조금씩 밝은 회색인 점을 보실 수 있습니다.
그치만 제 주변에 다크모드를 쓰는 사람들은, ‘눈이 피로하지 않아서’라는 의견보다는 ‘예뻐서’, ‘테마를 바꿔서 사용하기 위해’ 등. 주로 심미적인 이유로 사용되고 있었다는 비하인드…
디자인 컨셉과 작업에 대해 고민하고 계실 분들에게 좋은 참고가 되었으면 좋겠습니다.
트렌드에 대해서 소개해 드렸지만, ‘트렌드’가 트렌드로 불리는 것에는 이유가 있습니다. 테사는 작업을 진행하며 항상 디자인 트렌드에 참고를 하면서도, 유행은 항상 흐르기 마련이라 또 빠르게 변할 것을 알고 있습니다. 금방 증발되는 디자인을 보며 체념과 초탈을 무수히 겪는 테사 (ㅋㅋ), 역시 디자인은 역할은 예쁜 것보다, 효율적이고 적합한 것에 초점을 두는 것이 맞다고 생각하기에 언제나 사용자가 원하는 것 / 필요한 것을 만들어내야 하는구나 싶습니다.
오늘도 사용자 경험을 위해 항상 고민하고 계실, 수많은 디자이너 분들에게 경외를 남기며 마무리하겠습니다.
요즘 핫한 마케팅 트렌드만 소개하던 테사의 main job은… 의외로 AE가 아니라 디자이너라는 사실.
오늘은 부캐 끄고 본캐 켜봤습니다. 콘텐츠위드에서는, 디자인 작업을 진행하게 되면 기본적으로 모니터 화면을 고려하여 진행합니다. 다양한 사례의 웹용 디자인 작업을 활발하게 진행하고 있는 만큼, 디자인 트렌드를 참고하여 작업하는데요!
그렇다면 어떤 트렌드를 주로 참고하는 것이 좋을까요? 디자인은 범주가 굉장히 광활하지만 그 중에서도 모바일 UX 디자인은 가장 빠르게 발전하고 역동적으로 변화하며 해마다 새로운 트렌드를 선도하고 있습니다. 유행은 한 번쯤 따라줘야 하니까~
21년 올해의 디자인 트렌드, 그 중에서도 모바일 UX 디자인 트렌드를 살펴보시죠.
맥시멀리즘 테사가 존경하는 미니멀리즘
심플한 것이 베스트라는 진리를 따라 트렌드를 선도하고 있는 미니멀리즘. 사용자들은 한층 고차원적으로 발전하고 스마트 해진 덕분에 “디자인”보다는 “본질”이 중요하다는 것을 알게 되었습니다. 화려한 것들은 되려 눈과 뇌를 지치게 할 뿐. 따라서 디자인만 화려한 것은 제작자도, 사용자도 중요하게 생각하지 않는 것이죠.
미니멀 하게 컨셉을 잡으면 디자인하기가 편한 것은 아니겠죠. 중점 메시지를 보다 수월하게 전달하면서, 밋밋하지 않되, 효율적인 디자인을 해야 하니 만드는 사람의 상당한 창의력과, 보는 사람의 수용력이 요구됩니다.
특징을 적절히 강조하는 미니멀리즘을 아는 당신… 테사가 아주 많이 사랑합니다.
왜 이렇게 사랑을 받을까? 뉴모피즘
스큐어모피즘과 평면 디자인의 조합이라니, 상상이나 해봤을까요? 방향성이 다른 2가지 요소가 합쳤더니 최고가 되었습니다.
초현실적인 디자인이었던 스큐어모피즘과 미니멀한 플랫 디자인은 각각 트렌드의 한 자락을 잡았던 기법들입니다. 가까운 과거에는 미니멀하고 깔끔한 디자인이 유행이었지만, 그 전에는 가능한 많은 효과와 공을 들인 디자인이 유행이었습니다.
흔히 접할 수 있는 핸드폰 화면만 보아도 알 수 있죠.
현실을 담은 듯한 아이콘이었던 IOS4를 보세요. 보다 사실적인 형태로 묘사 되어있는 아이콘들입니다. 기능 자체가 곧 일러스트로 표현되고, 그 일러스트가 그라데이션과 입체감을 굉장히 살린 디자인입니다.
반면 IOS8은 보다 아이콘이 간소화되었습니다. 심플하고 깔끔하며, 직관적입니다. 디테일 하게 표현하지 않아도, 플랫한 아이콘만 보고도 기능을 파악할 수 있도록 디자인한 것이죠. 애플의 디자인 흐름만 보아도, 한 획을 그은 트렌드를 반영하며 인터페이스를 발전시켜 왔습니다.
그리고 지금, 사실적이고 입체적인 스큐어모피즘과 깔끔한 플랫 디자인이 적절히 섞여, 뉴모피즘 디자인이 트렌드의 한 획을 그었습니다. 적절한 대비 효과와 자연스러운 입체감으로, 화면으로 봐도 버튼처럼 보이게 합니다.
단순히 예쁘다고 노 룩 패스? 멈춰! 디자인은 쓰임에 따라 달라져야 하는 만큼, 뉴모피즘은 시인성이 떨어질 수 있으므로 율격을 갖춰야 하는 자료에는 응용하기 어렵다는 단점이 있습니다. 접근성이 낮다는 평가도 있죠. 따라서 뉴모피즘을 적용해보기 위해서는, 포인트 컬러와 백그라운드 컬러의 대비가 명확한 컨셉에서만 사용하길 권장합니다. 실제로 UX / UI 디자이너분들의 의견을 들어보면, 뉴모피즘은 ‘사라졌으면 하는 트렌드’라고 합니다. (주관적 의견) 여론을 보며, 문득 “왜 그럴까?” 궁금해졌습니다. 궁금한 건 못 참는 애기 테사. 슨배님들께 직접 물어보기로!
깔끔하지만, 활용했을 때의 직관성과 시인성이 저하될 수 있기 때문에 적용된 실사례를 찾기는 힘들다고 하죠. 아직까지는 뉴모피즘 보다는 플랫이 훨씬 많이 적용되고 있습니다.
‘아름다울 美’ 중 제일은 ‘여백의 美’라…
뷰티 업계라면 빼놓지 않는 방식, 바로 여백을 적절히 살린 디자인입니다. 여백은 디자인 오브젝트들의 공간을 적절히 확보하여 다양하게 쓰이는 것입니다. 여백을 활용함으로써, 강조하고 싶은 것만 강조할 수도 있고, 전체적인 균형을 맞출 수도 있습니다. 전달하고 싶은 중점 메시지가 있다면, 그 메시지만 보여줄 수도 있습니다.
여백은 단순히 공백이 많은 것을 이야기하는 것이 아닙니다. 한 면에 정보가 꽉 찬 신문에서도 여백은 적절히 활용되고 있습니다.
웹 또는 모바일에서 활용되는 시안의 여백활용은 대개, 공간을 적당히 남겨두는 디자인이죠. 합당하게 공간을 남겨 여백 활용을 잘 하는 것은 보다 집중력을 높이게 됩니다. 이는 오브젝트에 명확한 중요 순위를 보여주며, 해당 위치에 ‘왜 놓여야 하는지’ 또는 ‘왜 이렇게만 배치하였는지’에 대한 필연성을 자연스럽게 느낄 수 있도록 합니다.
많은 사람들은 ‘무엇인가 부족해 보인다’거나, ‘하다 만 것 같다’는 평가를 하기도 합니다. 이 말인 즉슨, 공간을 살리려면 ‘정보가 충분히 전달 되었는가’에 대해 숙고해야 한다는 뜻이겠죠!
그래도 여백을 살리는 디자인은, 언데드처럼 살아주길. A-men…
The night is darkest… 다크모드
다크모드는 작년부터 트렌드로 자리 잡아, 구글 / 애플 / 인스타 등 많은 브랜드에서도 지원하고 있죠?
많은 분들이 즐겨 쓰는 다크모드의 본질은 인체 공학적인 개선입니다. 어두운 테마를 사용하여, 눈의 피로를 덜어주고, 모바일의 경우 배터리 소모량을 줄여줍니다. 밝은 빛을 줄여, 조명이 없는 곳에서 더욱 쉽게 화면을 볼 수 있게 해줍니다. 이런 디자인을 응용하여 트렌디 하며 시각적으로도 편한 디자인으로 응용할 수 있습니다. 다크모드의 느낌을 살리기 위해서는, 완전한 블랙 컬러가 아니라, 적당히 어두운 그레이 계열 사용을 권장 드립니다. 검은색을 사용할 경우 대비 효과가 극대화되어 다크모드의 본질과는 멀어질 수 있습니다.
하지만, 가시성을 위해 ON 컬러를 잘 활용해야 합니다. 새하얀 색상은 피하되 적당히 대비되어 보이는 반전색을 사용해주세요. 다크모드는 모든 화면이 어두운 톤으로 다운되는 만큼, 정보의 우선 순위에 따라 깊이감에 차이를 주어야 합니다. 네이버의 다크모드를 보면, 네비게이션 BAR는 모두 조금씩 밝은 회색인 점을 보실 수 있습니다.
그치만 제 주변에 다크모드를 쓰는 사람들은, ‘눈이 피로하지 않아서’라는 의견보다는 ‘예뻐서’, ‘테마를 바꿔서 사용하기 위해’ 등. 주로 심미적인 이유로 사용되고 있었다는 비하인드…
디자인 컨셉과 작업에 대해 고민하고 계실 분들에게 좋은 참고가 되었으면 좋겠습니다.
트렌드에 대해서 소개해 드렸지만, ‘트렌드’가 트렌드로 불리는 것에는 이유가 있습니다. 테사는 작업을 진행하며 항상 디자인 트렌드에 참고를 하면서도, 유행은 항상 흐르기 마련이라 또 빠르게 변할 것을 알고 있습니다. 금방 증발되는 디자인을 보며 체념과 초탈을 무수히 겪는 테사 (ㅋㅋ), 역시 디자인은 역할은 예쁜 것보다, 효율적이고 적합한 것에 초점을 두는 것이 맞다고 생각하기에 언제나 사용자가 원하는 것 / 필요한 것을 만들어내야 하는구나 싶습니다.
오늘도 사용자 경험을 위해 항상 고민하고 계실, 수많은 디자이너 분들에게 경외를 남기며 마무리하겠습니다.