워드프레스에서 가장 중요한 두 가지 유행어: UI와 UX

게시 됨: 2016-07-06

웹 개발은 미국 전역에서 가장 빠르게 성장하는 분야 중 하나입니다. 세계에 가장 혁신적인 솔루션을 제공하는 데 중요한 역할을 하는 수백만 개의 개념이 있습니다.

사용자 인터페이스(UI)와 사용자 경험(UX)은 웹 개발 분야에서 가장 매력적인 두 가지 개념입니다. 둘 다 다른 개념이지만 웹 기반 프로젝트를 설계하고 개발하는 데 개별적으로 중요한 역할을 합니다.

그러나 대부분의 사용자, 특히 초보자는 이 두 개념을 혼동합니다. UI와 UX의 조화로운 특성 때문일 수도 있고, 대부분의 워드프레스 디자이너와 개발자가 두 개념 모두에 숙달했기 때문일 수도 있습니다. 그러나 사실은 UI와 UX는 서로 완전히 다릅니다. 그들은 또한 같은 극의 두 끝이라고 말할 수 있습니다. 이 블로그 게시물에서 우리는 그들의 목적, 차이점, 그리고 마침내 그것들이 서로 어떻게 상호작용하는지 이해하려고 노력할 것입니다.

시작하자!

사용자 인터페이스(UI)

사용자 인터페이스 또는 UI는 사용자가 아이콘, 버튼 및 제어 옵션을 통해 제품 또는 기술과 상호 작용할 수 있도록 하는 기술 개념입니다. UI는 타겟 방문자와 강화되고 부드러운 상호 작용을 제공하도록 설계된 UX 요소를 표시합니다.

간단히 말해서 인간이 기계와 상호 작용하는 데 사용하는 도구를 포함합니다. 개인이 컴퓨터를 제어하고 작동하는 데 사용하는 접근 방식을 촉진합니다. 물리적 아이콘, 버튼 및 화면 버튼과 같은 많은 사용자 인터페이스가 있습니다. 또한 터치 스크린과 같은 터치 컨트롤과 음성 명령과 같은 오디오 컨트롤이 포함되어 있습니다. 그러나 향상된 UI에는 다음과 같은 몇 가지 기본 요구 사항이 있습니다.

  • 심미적으로 즐거운
  • 클린&클리어
  • 효율적인
  • 직관적
  • 일관되고
  • 용서

UI 디자이너는 번거로움 없이 사용자에게 효과적으로 메시지를 전달할 수 있는 제품 레이아웃을 디자인합니다. 아이콘, 버튼, 타이포그래피 등 사용자가 방해 없이 사이트 또는 컴퓨터와 상호 작용할 수 있도록 하는 훨씬 더 많은 상호 작용이 가능한 구성 요소를 만드는 데 중점을 둡니다.

사용자 경험(UX)

사용자 경험 또는 UX는 사용자가 사이트, 웹 기반 모바일 앱 또는 데스크톱 기반 소프트웨어와 상호 작용할 때 느끼는 방식을 정의하는 웹 디자인의 중요한 개념이기도 합니다. 여기에는 물리적 상호 작용이 포함됩니다. 즉, 그래픽, 행동, 사이트 참여 및 특정 시스템을 사용하는 동안 느끼는 감정에 대해 실제로 무엇을 생각하는지입니다. 즉, 사용자 경험은 사이트나 앱의 사용성과 접근성을 나타냅니다.

웹 프로젝트에서 일하는 UX 디자이너/개발자는 고객에게 최고의 사용자 경험을 제공하는 데 중점을 둡니다. 사용자가 특정 사이트나 앱에 대해 어떻게 느끼는지 연구하고 평가합니다. 그런 다음 사용자 참여, 사용자 친화성, 쉽고 간단한 탐색 시스템, 유틸리티 및 웹 프로젝트 내의 훨씬 더 많은 것을 포함하는 웹 디자인의 여러 측면을 모니터링합니다.

워드프레스 UI와 UX의 짧은 역사를 살펴보자

WordPress UI에서 본 대부분의 수정 사항은 백엔드에 영향을 미치며 주로 관리 영역이나 대시보드에 영향을 미칩니다. 최종 사용자에게도 영향을 미치는 댓글 구조와 같이 변경된 사항이 많이 있습니다. 글쎄요, WordPress UI와 UX의 간략한 역사를 아는 것은 흥미로울 것입니다.

  • 2003년 에 도입된 워드프레스 UI의 첫 번째 버전. 첫 번째 버전의 WP UI에는 대시보드가 ​​없고 제한된 기능도 포함되어 있다는 사실에 놀랄 것입니다. 이는 사용자가 게시물에 하나의 카테고리만 지정할 수 있음을 의미합니다. 그러나 사용자 인터페이스는 여전히 무뚝뚝했고 사용자가 다음 버전의 워드프레스 UI에서 기대했던 것만큼 기능이 많지 않았습니다. 또한 대시보드 내에 하위 카테고리, 게시물 미리보기, 썸네일, 사용자 정의 필드 등을 포함했습니다.
  • 2005년 에 소개된 WordPress UI의 다음 버전은 대시보드에 새로운 변화를 가져왔습니다. 페이지를 추가하고 여러 테마도 지원했습니다. 2005년 판에는 WYSIWYG(What You See Is What You Get) 편집기와 Akismet도 도입되었습니다. 또한 이미지 및 파일 업로드를 통합했습니다.
  • 2007년 의 두 릴리스에는 맞춤법 검사, 태그 메뉴 구조, 주석, 새 플러그인에 대한 업데이트 알림 및 WordPress 업그레이드 가용성, 고급 비주얼 편집기 및 URL 리디렉션 아이콘이 포함되었습니다.
  • 2008 버전은 새로운 관리자 패널, 시각적 편집기 개선, 작성된 섹션의 단어 수 기능, WordPress 플러그인 저장소에서 사용할 수 있는 플러그인 원클릭 업그레이드, 내장 갤러리, 자동 설치를 추가하는 많은 업데이트를 도입했습니다. 디렉토리의 플러그인, 댓글 페이징, 관리자 패널의 댓글에 대한 응답 가능성, 키보드 단축키, 고정 게시물 등.
  • 2009 버전은 플러그인 업데이트, 내장된 이미지 편집기, 전역 휴지통/실행 취소, 핵심 WordPress 속도를 높이는 더 빠른 스크립팅, 비디오를 포함하는 간단한 프로세스, CodePress 편집기, 원 클릭 테마 설치, 전체 테마 디렉토리를 탐색할 수 있는 가능성을 가져왔습니다. , 사이드바에서 위젯을 드래그 앤 드롭하는 등 다양한 기능이 있습니다.
  • 2010년 에는 개발자가 맞춤형 사이트를 만들 수 있도록 API가 도입되었습니다. 사용자 정의 배경, 메뉴, 게시물 유형, 헤더, 분류, 짧은 링크 등으로 도입된 API입니다. 또한 관리자가 단일 대시보드에서 여러 사이트를 실행할 수 있도록 WordPress에 MU를 포함했습니다.
  • 2011년 에는 고급 UIR과 전체 화면 편집기가 포함된 WordPress UI 버전이 도입되었습니다. WordPress가 더 빠르고 가벼워졌습니다. 또한 타이포그래피, 코드 및 디자인이 포함된 새로운 대시보드 디자인을 도입했습니다.
  • 2012 버전은 이미지, 통합 갤러리 생성 및 미디어 업로드에 대한 더 많은 개선 사항을 대중화했습니다. 대시보드의 스타일도 개선되었습니다. 고해상도 그래픽으로 업그레이드된 모든 것, 새로운 색상 선택 도구가 포함된 것 등입니다.
  • 2013 버전에는 자동 유지 관리 및 보안 업데이트, 더 강력한 암호 권장 사항, 오디오 및 비디오 포함에 대한 기본 지원, 자동 저장, 더 나은 글로벌 지원 등이 추가되었습니다.
  • 2014 버전은 여러 모바일 장치에서 아름답게 보이는 간단한 타이포그래피, 향상된 미디어 관리, 향상된 이미지 편집, 헤더 미리보기, 갤러리 미리보기, 더 나은 산만하지 않은 쓰기 모드, 더 나은 플러그인 검색 및 탐색을 위한 고급 메트릭, 새로운 테마를 목격했습니다. 브라우저 및 라이브 위젯.

참고 : WordPress는 사이트 소유자(관리자)와 최종 사용자 모두를 위한 UI를 개선하기 위해 많은 변경을 했습니다. 이러한 개선은 효과적이고 강력한 UI를 개발하면서 향상된 UX를 만드는 것을 목표로 했습니다.

워드프레스 UI와 UX의 미래

새롭고 첨단 기술의 도입으로 WordPress 사이트의 UI 및 UX를 더욱 개선하기 위한 몇 가지 조치를 취하는 것이 필수적입니다. 가까운 장래에 고려해야 할 가장 중요한 사항의 목록을 제공합니다.

1. 플랫 사용자 인터페이스

웹 디자인에서 즉흥성은 필수입니다. 오늘날 아무도 웹사이트에 그림자와 3D 버튼을 사용하고 싶어하지 않습니다. 대신 직관적이고 심플한 플랫 디자인이 유행입니다. 여러 모바일 장치 및 플랫폼에서 멋지게 보입니다.

2. 미니멀리즘

화면을 어지럽히는 화려한 것을 사용하는 대신 최소한의 접근 방식으로 사이트를 디자인해야 합니다. WordPress 사이트의 UI 및 UX를 개선합니다.

3. 스크롤링

스크롤링은 WordPress 디자인에서 더 널리 퍼진 개념이 될 것입니다. 모바일 장치를 사용하여 사이트를 탐색하거나 서핑하는 사람들이 점점 늘어나고 있기 때문입니다. 스크롤은 고객에게 더 나은 사용자 경험을 제공할 수 있는 버튼을 클릭하는 사용자 친화적인 방법입니다.

또한 스크롤이 훨씬 더 편리하고 웹 사이트의 전체 속도도 향상됩니다.

4. 모바일 지원

모바일은 언덕의 왕으로 남을 것입니다. 우리는 이미 모바일 중심으로 개발되는 Windows의 고급 버전을 목격했습니다. Google의 OS는 모바일 시스템에서 나왔습니다. 작은 화면 메시지를 전달하기 위해 개발자는 작은 텍스트 대신 큰 시각적 개체에 집중해야 합니다.

5. 머티리얼 디자인

Google에 따르면 여러 플랫폼 및 장치 크기에서 통합된 경험을 가능하게 하는 단일 기본 시스템을 개발해야 합니다. 모바일 액션은 기본이지만 터치, 음성, 키보드, 마우스는 최고의 입력 방식입니다.

개념에는 다음이 포함됩니다.

  • 의도적,
  • 그래픽,
  • 굵게, 그리고
  • 의미를 부여하는 모션.

빠르고 쉬운 탐색 시스템은 사용자가 번거로움 없이 사이트 내에서 탐색할 수 있도록 설계되었습니다. 터치 대상은 48*48픽셀입니다. 또한 마우스 프리 및 고급 제스처 탐색을 지원하므로 최종 사용자의 초점을 쉽게 관리할 수 있습니다.

또한 색상을 사용하여 정보를 전달하고, 소리에 대한 시각적 대안을 활용하고, 특별한 관계에 대한 단서를 제공합니다.

6. 동적 배경

배경 비디오의 도움으로 최종 사용자에게 메시지를 보다 효과적으로 전달할 수 있습니다. 따라서 HD 배경 영상에 대한 경향이 높아졌습니다. 웹사이트 소유자는 비디오, 그래픽 또는 사진과 같은 동적 배경을 사용하고 있으며 이는 계속될 것입니다. 실제로 큰 이미지와 매력적인 동영상은 모바일 장치와 같은 작은 화면에서 더 보기 쉽고 쉽게 소비됩니다.

7. 타일과 카드

이러한 경향은 앞으로 더욱 빛날 것입니다.

이미 타일과 카드 트렌드를 따라가고 있는 Pinterest와 같은 인기 사이트가 많이 있습니다. 아름답고 깨끗해 보입니다.

8. 음성 제어

더 많은 움직임과 음성 제어의 추세는 또한 웹 디자인에서 큰 인기를 목격하게 될 것입니다.

9. 타이포그래피

타이포그래피는 보다 시각적으로 매력적이며 개별 브랜드 이미지와 어울리는 커스터마이징이 될 것입니다. 실제로 글꼴은 이미지, 스타일, 분위기 등에 따라 선택됩니다. 아름답고 매혹적인 타이포그래피는 사이트의 사용자 경험을 빠르고 효율적으로 향상시킬 수 있습니다.

10. 맞춤형 UX

웹에는 이미 고객의 행동에 따라 콘텐츠가 맞춤화된 웹사이트가 많이 있습니다. 하지만 지금은 고객의 취향과 기호에 따라 UX를 커스터마이징할 때입니다. Analytics를 사용하면 고객이 웹사이트를 어떻게 사용하는지 확인할 수 있습니다. 이 정보를 사용하여 잠재적인 웹 사용자에게 맞춤형 UX를 이해하고 제공할 수 있습니다. 이를 통해 사용자는 필요에 따라 변경할 수 있습니다.

마무리

사용자 인터페이스와 사용자 경험은 모두 WordPress 사이트의 유용성, 접근성 및 기능을 결정하는 데 중요한 역할을 합니다. 두 개념을 신중하게 다루는 것이 필수적입니다.

글쎄, 이 블로그 포스트에서 우리는 웹 디자인 세계에서 UI와 UX의 빠른 진화, 서로 어떻게 상호 연관되는지, WordPress UI와 UX의 역사, 웹 디자인과 개발에서의 미래에 대해 설명했습니다.

성공적인 사이트를 호스팅하려면 사이트의 사용자 경험을 향상해야 하며 이를 위해서는 더 많은 방문자를 확보하는 데 도움이 되는 두드러진 측면이기 때문에 강력하고 고급 사용자 인터페이스를 개발해야 합니다.

이 블로그 게시물이 마음에 드셨기를 바랍니다. 또한 웹 사이트의 UI 및 UX를 더욱 개선하는 방법에 대한 의견을 공유할 수 있습니다.