어떤 의미에서 페이드는 시각적 인코딩과 의미 론적 인코딩 간의 분리 개념을 따르며 타원은 그렇지 않습니다.

iOS 5에서 Apple은 줄임표 대신 페이드를 사용하도록 모바일 Safari의 주소 표시 줄을 변경했습니다.

아니요 실제 URL이 무엇인지 더 명확 해지지 만 (적어도 느낌이 듭니다) 끝날 때 더 많이 볼 수 있습니다.

수직으로 잘린 텍스트

타원은 세로로 작동하지 않습니다. 다음은 JIRA의 예입니다. 하위 콘텐츠는 스크롤되지만 헤더는 그대로 유지됩니다 (이 문제가 발생하기 직전에 영리하게 압축됩니다. 소리가 들릴 수있는 것처럼 들리지 않습니다). 페이드는 스크롤되는 부분이 어딘가로 가고 있음 을 알리는 데 도움이됩니다.

텍스트가 오버플로되면 컨테이너이지만 래핑 할 수는 없습니다

여기에서 Gmail에서 오버플로가 잘리는 가장자리는 어렵습니다. 너비는 동적이므로 타원을 동적으로 삽입해야합니다. 이는 실용적이지 않습니다 (단단하게 만들 수 없다고 가정합니다). 페이드 아웃 또는 " 아래의 사촌 "이 무슨 일이 일어나고 있는지 전달하는 데 도움이 될 수 있다고 주장합니다.

일반적인 배경

일반적으로 페이드 아웃 효과 대비가 높을수록 파싱하기 쉬우 며 " 사용자에게 " 가까워 보이고 대비가 낮을수록 더 어려워 보이는 skeumorphism에서 비롯 더 먼 것처럼 보입니다. " 일몰 때 페이딩 "을 생각해보세요. iOS의보다 구체적인 skeumorph 친척은 아이디어를 강조합니다.

Gmaps의 또 다른 부분 :

이것은 텍스트 줄 바꿈이나 줄임표를 대체하도록 설정 한 매우 일반적인 규칙이 아닙니다. 정확히 말씀하신 내용의 한 가지 예를 찾았습니다.하지만 “어떤 상황에서는 유효한 옵션이라고 생각합니다.

댓글

• +1 That ´ 다른 종류의 그라디언트에 대한 멋진 개요입니다. ´ 블로그 게시물 이었어 야 했습니까?) 결론을 » 이상으로 확장하기를 바랍니다.하지만 저는 그렇게 생각합니다. ' 일부 상황에서 유효한 옵션입니다. « 귀하의 생각대로 ´ 그것에 대해 많이 생각했습니다. Btw : 마지막 imho 는 " 내부 그림자 "입니다.아, 그리고 목록을 만들려면 이미지를 8 칸씩 계획해야한다고 생각합니다.
• @kaiser 생각해 주셔서 감사합니다. 나는 목록을 재 작업했다. 또한 마지막 두 가지 모두 " 내부 그림자 "라고 할 수 있지만 핵심은 '는 텍스트를 자르는 컨테이너의 내부 그림자입니다. 따라서 평행선을 그리려고했습니다. 제 문구를 수정해야합니다 …

요약 :

그래디언트와 페이드 아웃이있는 포인트 ²⁾ 는 항상 동일합니다. 불량 모니터 / LCD에서는 잘 재생되지 않습니다.

대비 문제

_{왼쪽 : 디자이너 모니터에서 잘 어울립니다 || 오른쪽 : 훨씬 일찍 페이드 아웃됩니다.}

색상 범위 문제

불량 모니터 :

양호 모니터 :

위에서 볼 수 있듯이 모든 사용자가 모니터에서 개인적인 경험을 공유하는 것은 아닙니다. 화면에 햇빛이 직접 비치면 결과가 더 나빠질 수 있습니다.

내 의견 :

피할 수 없을 때까지 페이드 아웃과 그라디언트를 사용하지 마십시오.

댓글

• 이것은 ' " 흐린 텍스트 "가 의미하는 바가 아닙니다. 내 인상은 '가 다음과 더 비슷하다는 것입니다. [~ 400 자 단색 텍스트] [~ 50-100 자 빠르게 사라지는 텍스트]-이 경우 시각적 경험의 차이 fade " speed " woudn ' 정말 중요하지 않습니다. 그러나 OP가 그녀가 의미하는 바를 명확히하기 전까지는 추측입니다.
• 물론, 뒷부분은 제거되지만 ' 중요하지 않습니다. 희미한 텍스트의 양이 짧다는 것은 읽을 목적이 아니라 ' " 더 많은 텍스트를 상징적으로 표현한 것임을 의미합니다. " 사용할 수 있습니다.
• 그라디언트는 하드웨어 의존성이 없으며 햇빛이나 불량 모니터로 인해 크게 손상되지 않습니다. 디자인 문제와 UX 문제를 혼동하고 있습니다. 일반적으로 오버레이가 전혀없는 4-10 줄을 표시 한 다음 100 %에서 0 %로 페이드를 사용하여 2-4 줄을 표시합니다. 페이드가 사용자의 모니터에 정확하게 표시되는지 여부는 ' 관련이 없습니다. 사용자가 어떤 종류의 a 페이드를 보는 한, 컨트롤은 추가 콘텐츠를 표시하는 용도로 사용됩니다.
• 다시, 오해하고 있습니다. 그래디언트는 모든 텍스트를 덮지 않고 하단 부분 만 덮습니다. 최종 부분에서 페이드가 높거나 낮은 지 여부는 더 많은 콘텐츠를 사용할 수 있다는 표시기로서 값과 특별히 관련이 없습니다. 대부분의 콘텐츠가 완전히 표시됩니다. 그래디언트가 일부 사용자에게 잘 보이지 않을 수 있다는 사실을 인식하는 것이 중요하지만 (최악의 경우를 대비하여 디자인 할 수 있도록) 그래도 사용자의 품질에 관계없이 그 목적을 달성하는 데 방해가되지는 않습니다 '의 화면.
• 요점은 OP가 페이드가 10 마일 또는 10mm 이상에서 발생 함을 의미하는지 여부입니다. 간결한 설명과 예시 부족을 고려할 때 ' ' 명확하지 않다고 생각합니다. 저는 ' 텍스트 위의 큰 그라디언트가 나쁘다는 데 동의합니다. 포함하는 예제는 최상의 조건에서 매우 끔찍하게 보입니다. 그러나 설명이 모호하다고해서 ' 최악의 경우를 가정해야하는 것은 아닙니다. 저는 ' 가정이 더 낙관적 인 경우를 다루는 제 답변에 대해 어떻게 생각하는지 궁금합니다.

저는 “흐린 텍스트”기법이 많이 사용되는 것을 보지 못했지만 사용자 경험의 요점은 사용자가 쉽게 사용할 수 있도록 디자인하는 것입니다. . 사용자가 무슨 일이 일어나고 있는지 추측해야한다면 목적을 훼손하고있는 것 같습니다. 대부분의 경우 […] 또는 [more …]를 추가하는 것만으로도 충분하고 쉽게 따라갈 수있는 경로를 제공합니다. 사용자가 더 많은 정보를 얻을 수 있도록 … 어쨌든 요점은 무엇입니까?

바랜 텍스트의 사용이 전혀 테스트되었는지 물어 보셨습니까?

본인이보기에 이것은 사용자 인터페이스에서 “정보 향기”를 사용한다는 아이디어입니다. 즉, 정보 스파에서 데이터가 어디에 있는지 시각적으로 사용자에게 제공 할 수있는 방법 ce. 이 경우 페이딩은 스크롤하거나 어떤 식 으로든 상호 작용할 때 얻을 수있는이 방향에 더 많은 정보가 있음을 나타냅니다.

우리는 90 년대 후반 시각화 커뮤니티에서 정보 향기의 개념에 대해 많이 논의했습니다. CHI 커뮤니티에는 많은 연구 문헌이 있었고 Xerox Parc의 정보 수집 이론이 나왔습니다 …. 그들은이 분야에서 많은 연구를했습니다. Peter Pirolli와 Stu Card의 논문이 떠 오릅니다.

검색어에 정보 향을 적용 할 수도 있습니다. 예를 들어, 그레이 스케일을 사용하여 디자인 한 일부 시각화에서 정보 향을 사용하여 데이터가 슬라이더에 설정된 특정 기준을 어떻게 충족하는지 보여주었습니다 (검은 색은 1 개, 짙은 회색은 2 개 등). 즉, 검은 색 데이터 포인트는 쿼리 바로 밖에있는 것이므로 슬라이더를 빠르게 이동하여 포함 할 수 있습니다.

Bob Spence는 이러한 정보 향 / 잔류 기술 .

이 특정 기술에 대한 데이터를 제공 할 수는 없지만 이러한 종류의 단서를 제공하는 것이 정보 기반 작업에서 사람들을 어떻게 지원하는지에 대한 많은 연구가 있습니다.

댓글

• 미니 맵은 디스플레이에 맞지 않는 ' 콘텐츠 여백의 페이드 아웃과 어떤 관련이 있습니까?
• 명확하게 편집했습니다 … 제가 언급하는 기본 개념입니다.
• 실패 당 색상이 포함 된 막대 차트입니다. 여전히 사용하지 않습니다. ' 이것이 어떻게 관련되는지 확인하십시오. 또한 통과 된 모든 빨간색과 가장 많은 실패가 가장 가볍고 가장 뒤쪽의 z 순서 인 이유는 무엇입니까?

페이딩 텍스트 사용에 대한 좋은 점 (이것이 무엇을 의미하는지 모르는 사람들을위한 것 : 그래디언트 투명 오버레이로 텍스트가 다음과 같은 경우 코스에서 배경색으로 “페이드 아웃”되도록 두 줄) 줄임표보다 훨씬 크고 놓치기 어렵습니다. 또한 줄임표는 거의 항상 표시하기 위해 작동하지만 텍스트가 올바른 위치에서 제대로 끝나는 것처럼 보이므로 사용자가 추가 단어를 찾도록 유도하는 매달린 개념이 없습니다. 줄임표는 특히 시력이 약한 사람 (예 : 노인)의 경우 매우 작고 놓치기 쉽습니다.

저는 그것을 사용한 경험이 없으며 사용하는 사이트를 기억할 수 있습니다. … 내가 사용하고있는 사이트가 기억 나지 않습니다. 죄송합니다. “더보기”버튼을 “더보기”버튼을 대체하는 것이 아니라 단순히 추가 콘텐츠를 훨씬 더 크고 명확하게 표시한다는 점에 유의하십시오. 사용자가 페이드 효과를 볼 때 끌리는 클릭 (창 음영, 더보기 버튼)이 가능한 영역이 있어야합니다.

이 유형의 효과는 콘텐츠 스크롤에만 적합합니다 (예 : 시세 표시기, 뉴스 피드 등), 한 쪽에서 스크롤 (페이드 인)하고 다른 쪽에서는 페이드 아웃합니다.

이것은 잘 작동하는 것 같습니다. 모양 읽기, http://www.microsoft.com/typography/ctfonts/WordRecognition.aspx 및 단어 인식의 개념. 그러나 이론적으로는 수평 (왼쪽에서 오른쪽으로) 페이드에만 유용하며 Amazon에서는 아니라 만 볼 수 있습니다. 수직 페이드. http://softwareas.com/pure-css-solution-to-avoid-cutting-off-text/ 귓속말은 청각 적이지만 유사한 효과입니다. 내 지식으로는 아직 연구가 없었지만 누군가 찾으면 여기에 게시하십시오.

여기에 페이드 샘플과 표준 줄임표가 있습니다. http://www.theuxunicorn.com/fade_sample.png