향상된 사용자 참여를위한 집중 형 인터페이스 설계

사용자 참여 서로 다른 프로젝트에서 서로 다른 방식으로 달성 할 수있는 까다로운 지표입니다. 대부분의 디자이너들은 인터페이스 상호 작용에 대해 이야기 할 때 페이지 내용 또한 사용자 상호 작용을 장려 할 수 있습니다. 사용자 참여를 높이려면 매력적인 콘텐츠 작성, 그 내용을 제시하십시오. 멋스러운 디자인.

말하기가 훨씬 쉬워졌지만, 몇 가지 기본 사항을 배우면 문제를 해결할 수 있습니다. 훌륭한 콘텐츠가있는 집중된 UI 프로젝트를위한.

이 글에서는, 어떻게 증가시키는 지 보여 드리겠습니다. 사용자 상호 작용 및 콘텐츠 참여 웹 기반 인터페이스에서. 방문자를 참여시키는 가장 일반적인 두 가지 방법이며, 가능한 경우 경험을 최적화하다 당신은 아무런 문제없이 시간당 수익을 올릴 수 있습니다..

참신을 포착하십시오

개념 진기함 문맥에 따라 일반적으로 매우 새롭고 독특한 이벤트 나 사물을 정의합니다.. 참신한 사건들 우리주의를 끌자. 왜냐하면 눈에 띄다. 이것은 인터페이스 디자인에 있어서도 참신함을 나타내는 요소를 나타내는 것입니다. 페이지에서 뛰어 내리다.

나는 최근에 교전에 관해서 참신함의 중요성을 토론하는 위대한 포스트를 발견했다. 사용자는 소설 경험, 인터페이스 및 UI 요소로 끌어 들인다. 그들이 다르니까. 다르게 설계되는 유일한 사실은 종종주의를 끌기 때문입니다..

한 가지 일반적인 예는 대부분의 방문 페이지에서 볼 수있는 클릭 유도 문안 버튼입니다. 당신은 또한 참신함을 구축 할 수 있습니다. 배경 사진, 일러스트레이션 또는 앱 스크린 샷, Uber for Business 방문 페이지와 같은.

이 페이지에는 클릭 유도 문안 버튼이 있지만 즉시 내 관심을 보입니다. 스크린 샷으로 이동. 처음에로드 될 때 애니메이션이 적용되어 결합됩니다. 모션이있는 디자인의 참신함 주의를 끌기 위해.

대안으로는 GiftRocket을 링크로 그림 아이콘 사이트를 더 깊이 파고 들자..

이 두 가지 예 모두 그들의 이점에 참신을 사용한다.. 사람들을 사이트로 끌어들일 수있는 것은 아니지만주의를 끌면 더 나은 결과를 볼 수 있습니다. 내장 수준에서 먼저.

디자인은 첫 번째 방문자가보고, 당신은 그들의주의를 끌 필요가있다. 초 이내 더 많은 참여를 유도하기 위해.

스키머 블 타이포그래피

연구에 따르면 대부분의 사용자 웹 페이지 스캔 단어를 읽는 것보다는 오히려 그것을 읽으십시오. 당신은 아마 사람들을 당신의 내용을 읽도록 끌어 들이기를 원할 것입니다, 그러나 당신은 그렇게 많이 할 수 있습니다..

가장 좋은 대안은 삐걱 거리는 내용 헤드 라인, 굵은 글씨, 그리고 당신이 말하고자하는 것을 설명하는 그림이 그려져 있습니다. 나는 적어도 생각할 수있다. 3 가지 강력한 기술 귀하는 귀하의 콘텐츠에서 가독성 향상:

1. 콘텐츠 나누기 명확한 부제가있는
2. 단락 나누기 그들을 더 작게 만들기
3. 글 머리 기호 목록 사용 귀하의 포인트를 더 빨리 공유하기

목표는 독자를 지키는 것입니다. 페이지 아래로 이동 필요한 모든 수단으로. 콘텐츠를 작게 유지함으로써 한입 크기의 덩어리로 관심을 끌고 사람들을 사이트로 몰아 넣는 것이 훨씬 쉬워집니다..

이 작문 스타일의 예를 보려면 빠른 새싹 블로그를 확인하십시오. 그 내용은 닐 파텔 (Neil Patel)에 의해 작성되었으며 그는 종종 매우 긴 형태의 내용을 씁니다. 그러나 그는 단락을 나누다. 각각 1-3 문장으로.

당신이 가지고 있다면 적절한 헤드 라인, 사용하다 이미지 / 글 머리 기호 내용 전체에 걸쳐 사람들은 더 많이 읽고 더 많이 읽게됩니다. 또한 반드시 공백의 양을 늘린다. 단락 사이. 여백 및 패딩 레이아웃 디자인 및 가독성에서 모두 큰 역할을합니다..

실제로 텍스트로 디자인하십시오. 읽는 재미. 지루한 복사본은 유혹하지 않지만 너무 작거나 대비가 부족한 복사본은 재미 있지 않습니다..

눈길을 끄는 이미지

Backlinko의 최근 사례 연구에 따르면 페이지 적어도 하나의 이미지와 함께 일반적으로 더 높은 자리에 앉다 이미지가없는 페이지보다 이것은 SEO 관점에서 굉장합니다..

그러나 사용자 참여는 어떻습니까? 하나의 이미지를 유지할 수 있다면 접을 수있는 부분 또는 상단에 가깝다. 그들이 떠들기 전에 방문자의 관심을 끌게됩니다. 참신한 페이지 요소는 유치하는 경향이 있음을 기억하십시오..

페이지 전체에 이미지 (또는 많은 이미지)가 산재 해있을 때 단조 로움을 풀다 지루한 텍스트 블록들. 사용자는 독서를 쉬다 이미지를 감상하거나 이미지와 작성된 콘텐츠를 연결합니다. 그러나 대부분의 설계 기법과 마찬가지로 품질은 수량보다 가치가 있습니다..

Moz 사례 연구에 따르면 고화질 이미지는 방문자를 지키다. 페이지에서 훨씬 오래. 한편, 열악한 품질의 이미지 잘 돌아 가지 마라. 어떤 경우에는 방문자가 빨리 튀어 오르다. 이미지가없는 것보다. 적어도 하나의 이미지를 포함시켜야합니다. 내용과 관련있다. 그리고 그 독자에게 가치를 제공하다..

TechCrunch는 기사에서 추천 이미지를 사용하여이 작업을 수행합니다. 스크롤없이 볼 수있는 부분의 추천 사진.

WordPress는 게시물 축소판 기능으로 쉽게 추천 이미지를 추가합니다. 작성한 모든 게시물에 대해 고유 한 사진을 설정하고 페이지의 맨 위에 표시되도록 할 수 있습니다. 방문자에게 엿볼 수있는 완벽한 방법입니다. 내용이 무엇에 관한 것인가?, 증가시키다 CTR 게시물 미리보기 이미지가 포함 된 관련 게시물 위젯.

대조되는 페이지 요소

페이지의 특정 영역 하나에주의를 기울여야하는 경우 어울리지 않음 너의 가장 친한 친구 야.. 대조 디자인의 특정 영역 또는 특정 콘텐츠 블록 사이를 단단하게 움직입니다..

방문자는 자연스럽게 대비를 향해 난폭하게 굴다 그게 다르기 때문이야. 색상, 크기 또는 공백의 큰 병치는 눈을 그립니다. 그 밖의 모든 것의 붕괴 레이아웃에서.

페이지 요소를 대조하는 가장 좋은 예는 아마도 Sketch의 홈 페이지 일 것입니다. 대비가 많이 있습니다. 두 개의 클릭 유도 문안 버튼 사이, 스케치 (Sketch) 시험판 다운로드 용 사본과 사본 구입용 사본.

구매 버튼은 전체 배경색을 사용합니다. 훨씬 더 밝게 헤더의 다른 색상보다 버튼 텍스트는 무료 평가판 버튼에 비해 밝아졌습니다. 방문자가 지금 구매 버튼으로 안내합니다. 시각적 자극만으로.

너는 유사한 기술 Optin 괴물의 홈 페이지에. 이 머리글에는 Get OptinMonster Now라는 레이블이 붙은 단추 하나만 있습니다. 다른 녹색 요소가없는 파란색 배경의 밝은 녹색 버튼입니다..

색상, 크기 및 모양이 모두주의를 끌기 때문에 그 밖의 모든 것과 대조하다 헤더에. 버튼 바로 옆에는 비디오 미리보기를위한 작은 텍스트 링크가 있습니다. 평가판 / 가입 CTA 버튼만큼이나 좋은 동영상 일 가능성이 높습니다..

블로그의 경우 사용자 참여에 대한 자격 요건이 다를 수 있습니다. 한 가지 일반적인 선택은 뉴스 레터 가입 양식 예를 들면 Aeolidia.

콘텐츠의 맨 아래로 스크롤하면 고급 - 뻔뻔한 가입 상자 뉴스 레터 양식 용으로 설계되었습니다. 페이지의 나머지 부분과 독특한 배경색, 재미있는 타이포그래피, 귀여운 킹 트리톤 아이콘.

대조적으로 디자인하는 가장 좋은 방법은 예제를 연구하고 실험하는 것입니다. 어떤 것이 효과가 있고 어떤 것이 효과가 없는지 확인하십시오. A / B 테스트를 통한 측정 항목 추적. 더 많은 예제를 찾고 싶다면 라이브 비대칭 웹 사이트의 팁과 스크린이 담긴 Codrops 기사를 읽어보십시오..

사용자 상호 작용 장려

방문자를 사이트에 관심있게 유지하는 데는 여러 가지 방법이 있지만 가장 일반적인 방법은 그들을 물건으로 만들어. 정적 블로그와 동적 인 소셜 사이트 모두에 해당됩니다. 이를위한 모든 기술은 없습니다. 사용자를 만들기 위해 무엇이든 할 수 있습니다. 페이지에 연루된 느낌.

안에 정적 사이트, 많이 추가 할 수 있습니다. 관련된 링크들 더 읽고, 포함 시키려면 이미지 슬라이드 쇼. 당신은 또한 수 양식 추가 사용자 의견 또는 전자 메일 뉴스 레터.

때에 온다 동적 인터페이스, 사이트의 목적은 대개 사용자 참여를 장려하는 것입니다. 가장 큰 장애물은 사용자 교육 사이트가 작동하는 방식 및 인터페이스에 올바르게 참여하는 방법.

사용자 참여 기법에 대해 이야기하는 KissMetrics의이 게시물을 확인하십시오. 내가 찾은 최고의 전략 중 하나는 가이드 투어 디자인하기 방문자가 각 주요 기능.

트위터의 전망을 새로운 사용자에게 혼동시키는 방법에 대해 생각해보십시오. 그들이 누군가를 따르지 않고 추종자가 없다면 왜 그들은 짹짹 것입니다?

그만큼 “제안 사항 따르기” 가입 중 상자가 새로운 사용자를 돕습니다. 트위터가 어떻게 작동하는지 알고. 이 기능은 참여를 시작하다 플랫폼과 함께 기능 실험 다음, 트윗 및 비공개 메시지와 같은.

가이드 투어 외에도 다음을 원할 것입니다. 인터페이스를 간단하게 만든다.. 프라임 기능은 있어야합니다. 1-2 번 클릭 사용자의 대시 보드 또는 기본 페이지에서 직관적 인 인터페이스 설명이 필요하다, 단순성 주의를 끌다 훨씬 더 빨리.

이 모든 기술을 이해하면 더 쉽게 인터페이스를 구축 할 수 있습니다. 사용자의 문제 해결, 과 신규 사용자의 참여 유도. 더 많은 것을 찾고 있다면 UX 디자인 참여 요령 관련 게시물을 확인하십시오.

• 참여를 늘리기위한 사용자 온 보딩 전술 (thinkapps.com)
• 점진적 참여의 교훈 (uxbooth.com)
• 새로운 사용자가 제품 사용 방법을 배우고 싶어한다고 가정하지 마십시오. (uxdesign.cc)