평평한 사진과 텍스트를 보지 않고 웹 사이트 탐색을 상상해보십시오. 가상 환경에 들어가거나 AR/VR Google 렌즈를 응시하는 것처럼 느껴집니다. 이것은 3D 시각 효과, 특수 효과 및 애니메이션을 포함하여 달성 할 수 있습니다. 3D 몰입 형 경험은 웹의 요소를보다 대화식적이고 실제적인 것처럼 보이게하는 깊이 감각을 만듭니다.
AVIR 3D 스크롤 웹 사이트를 확인하십시오. 이 홈페이지를 스크롤하면 현실감이 생깁니다. 사용자 가이 페이지를 탐색하는 것이 아니라 "경험"하는 것과 같습니다.
아래 비디오는 AVIR 웹 사이트의 스냅 샷을 제공합니다.
웹 디자이너는 줌, 회전, 수평 스크롤 및 시차 스크롤과 같은 기술을 사용하여 3D 몰입 경험을 달성합니다. 또한 시청자가 화면의 객체와 상호 작용할 수있는 3D 모델도 포함 할 수 있습니다.
3D 몰입 경험의 경향은 사용자 참여를 향상시키고 잊을 수없는 가상 세계 탐색 경험을 만듭니다. 웹 페이지에 가상 현실의 터치를 추가하여 웹 페이지를 대화식으로 시각적으로 매력적으로 만듭니다.
물론, 단점은 저성 장치의 사용자가 장치가 느리게 실행되거나 팬이 고속으로 실행되는 것을 발견 할 수 있으므로 보상이 실제로 가치가 없다면주의 해서이 경로를 선택할 수 있다는 것입니다.
Dark Mode Dark Mode는 새로운 것이 아니지만 익숙한 많은 사람들이 그것 없이는 무슨 일이 있었는지 상상할 수 없습니다. 예를 들어보세요 : 웹 사이트를 방문 할 때마다 거의 항상 어두운 모드 토글 버튼을 찾습니다. 많은 최신 웹 사이트는 이제 Dark Mode 옵션을 제공하여 웹 사이트 레이아웃 및 디자인의 다크 모드 설정을 최적화합니다. 다른 많은 사이트는 단순히 다른 옵션없이 Dark Mode로 직접 돌리기로 결정했습니다.
Dark Mode는 웹 디자인에서 새로운 개념이 아니지만 최근 몇 년 동안 더 많은 사람들이 Dark Mode의 이점을 깨닫고 (웹 컨텐츠와 배경의 대비로 인해) 점점 인기를 얻고 있습니다. HYRE 웹 사이트는 다음 그림과 같이 좋은 예를 제공합니다.
웹 디자이너가 디자인에서 다크 모드를 구현하는 이유는 다음과 같습니다.
사용자의 눈 피로를 줄입니다. (일부 사용자의 눈 피로가 증가 할 수 있으므로 꺼질 수있는 옵션을 제공하는 것이 가장 좋습니다.)
미학.
<.> 배터리 전원을 저장하십시오. 연구에 따르면 다크 모드를 사용하면 밝은 모드를 사용하는 것과 비교하여 배터리 전원을 절약 할 수 있습니다.
Dark Mode Design은 저조도 환경에서도 가시성을 향상시킵니다. 아침 일찍 휴대 전화를 집어 들고 밝은 빛이 눈부신다고 가정 해 봅시다. 이 경우 어두운 모드를 사용하면 훨씬 쉬운 경험을 제공 할 수 있습니다.
대부분의 사용자에게 Dark Mode의 영향을 감안할 때 웹 디자이너가 디자인에 포함시키는 트렌드가되었으며, 이는 PAN 트렌드의 플래시 이상임을 보여줍니다. -
어두운 모드 설계는 일부 사람들에게는 바람직하지 않을 수 있지만 다른 사람들에게는 그렇지 않습니다. 접근하기 쉬운 웹 사이트를 설계하려면 디자이너에게 Dark Mode/Theme Switch가 포함되어있어 사용자가 가장 적합한 테마를 선택할 수 있도록하는 것이 가장 좋습니다.
다크 모드 전환 옵션이있는 좋은 예는 다음 이미지와 같이 profileme.dev 웹 사이트입니다.
-
타라의 기사를 통해 읽는 것은 어두운 패턴의 디자인을 더 잘 이해할 수 있습니다.
기타 디자인 -
흉내 디자인은 새로운 웹 디자인 트렌드는 아니지만 최근 몇 년 동안 웹 디자이너들 사이에서 점점 인기를 얻고 있습니다. Mimicry Design은 사용자에게 시각적으로 유쾌한 부드럽고 현실적인 UI를 만듭니다. 모방 디자인은 일반적으로 부드러운 그림자와 미묘한 그라디언트가있어 모양을 부드럽게합니다.
위의 이미지는 Figma 커뮤니티의 Sayim Abdullah의 모방 디자인 툴킷을 보여줍니다. 버튼, 아이콘 및 검색 입력과 같은 일부 모방 요소가 표시됩니다.
이제 Sourasith의 음악 애플리케이션 디자인을 확인하여 웹 페이지 또는 웹 응용 프로그램 디자인에 모방 디자인을 적용하는 방법을 확인하십시오.
예술적 타이포그래피
타이포그래피는 웹 디자인의 미학에서 중요한 역할을합니다. 웹 디자이너는 글꼴 유형, 스타일, 간격, 색상 및 대비, 확대 / 축소, 정렬 및 텍스트 배열을 포함하여 타이포그래피 선택에서 점점 대담하고 실험 해보고 있습니다.
웹 디자이너는 사용자 경험을 향상시키고 대상 고객과 의사 소통하기 위해 타이포그래피 및 아름다운 글꼴을 실험하고 있습니다. 또한 창의적인 타이포그래피와 글꼴을 사용하여 브랜드 아이덴티티를 만듭니다.
사진 출처 : Freepik
예술적 텍스트가있는 웹 페이지를 디자인하려고 할 때 디자이너는 레이아웃이 쉽게 읽을 수 있고, 명확하고, 일관되도록 조심해야합니다.
조판에 대해 더 배우고 싶습니까? 타이포그래피 가독성 및 명확성에 대한 Jennifer Farley의 첫 번째 및 두 번째 기사를 확인하십시오.
micro-interaction
웹 사이트를 방문하면 부드럽고 미묘한 움직임이 나타날 수 있습니다. 이러한 상호 작용을 미세 상호 작용이라고하며 흥미로운 사용자 경험을 제공하기위한 것입니다. 이러한 미묘한 상호 작용은 애니메이션 효과, 알림 팝업, 떠 다니는 품목, 회전 목마 등의 형태로 나타납니다.
는 애니메이션 버튼이든 아래 토글 애니메이션이든, 이러한 모든 마이크로 인터 러싱은 사용자 활동에 응답하고, 시각적 피드백을 제공하고, 사용자 안내 및 웹 사이트의 사용자 경험을 향상시키는 웹 디자인 요소입니다.
사진은 다음과 같습니다. Koru UX Design, Dribbble