저는 현재 응용 프로그램의 UI 부분을 디자인해야하는 응용 프로그램과 관련되어 있으며 현재 자신의 요청이 뒷 배경에서 처리되는 동안 최종 사용자에게 표시되는 UI 구현 프로세스 중입니다.요청이 아직 처리되지 않은 상태에서 사용자에게 표시되는 최상의 UI?
그래서 내 질문은 무엇입니까?
감사합니다.
어떤 종류의 진동기라도 충분합니다. 사용할 수있는 멋진 throbber generator입니다.
진행률 표시 줄에 아무런 문제가 없습니다. 실제로 진행률을 표시하지 않고 다시 시작하는 진행률 표시 줄이 없으면됩니다.
이 그렇게 시간을 통과하기 위해 시간이 걸릴 것입니다가, 여기에 춤 토끼 : 당신이 심각하게 너무을 프로그램 을하지 않는 경우
,이 사람은 항상 군중의 기쁨입니다 : 일반적인 구현에
사용자가 기다려야하는 시간에 따라 다릅니다. < 10 초인 경우 애니메이션 GIF (또는 액세스 할 수없는 경우 플래시 사용)로 회전하는 파이를 표시합니다 (CSS로 간단한 jquery hide/show)
> 10 초와 같이 더 오래 기다려야하지만 짧지 만 재미있는 캡션 시스템을 구현할 수 있습니다. 기다리는 동안 사용자에게 약간의 유머를주기 위해 이전의 "망치 형 스플라인 (Reticulating Splines)"유형 시스템과 같은 것. 이러한 진술 목록을 보려면 https://stackoverflow.com/questions/182112/what-are-some-funny-loading-statements-to-keep-users-amused을 참조하십시오.
장기 실행 백그라운드 프로세스가있는 경우, 현재 작업이 가능한 최소한의 기술적 인 조건을 설명하는 메시지가있는 진행률 막대를 표시하기 만하면됩니다. 그리고 가능한 경우 사용자가 조급하거나 실수로 프로세스를 시작한 경우 취소 버튼을 누릅니다.
구체적인 링크를 제공 할 수는 없지만 진행률 표시 줄 만 있으면 더 긴 작업을 진행률 표시 줄이없는 작업보다 짧게 만들 수 있다는 것이 입증 된 것 같습니다.
당신이 할 수있는 가장 나쁜 일은 아무 것도 아닙니다. 사용자는 아무런 피드백도 프로그램을 잠그지 않았다고 생각할 수있는 조건이 있습니다.
작업 소요 시간에 대한 추산도 추가 할 것입니다. – Tom
주 (내가 사용하는 것이) :
jQuery에는 .ajax 함수가 있습니다.나는 내가의 내용 .remove() (DIV 또는 적절한 것 같습니다 무엇이든) 기능 (온 클릭 또는 무엇이든)를 호출처럼 보이는 waiting의 CSS 클래스를 추가 할 때 :
.waiting {
background-color: #eee;
background-image: url('some-spinner.png');
}
.ajax 함수는 success 콜백이 어디 .waiting 클래스를 제거하고 난 다시 아약스에서 얻은 새로운 데이터에 넣어 (또는 내가 .remove() 함께했다 데이터를 다시 넣습니다.
은 또한 당신이 CSS로 wait 또는 progress 상태로 기본 마우스 커서를 변경할 수 있습니다.
CSS here으로 커서를 변경하는 방법에 대해 자세히 설명합니다.
"죽음의 원형"이외의 의미입니까? –
@David : 나는 죽음의 회전 파이를 어떻게 구현할 지 모르겠습니다. 그냥 제쳐두고, 내 프런트 엔드 및 비즈니스 로직에 대한 jquery, CSS 및 phtml 조합을 사용하여 PHP에서 구현됩니다. – Rachel