web-dev-qa-db-fra.com

Comment verrouiller doucement un formulaire lorsque l'utilisateur tape encore (après le compte à rebours terminé)?

Je crée un site Web où les utilisateurs s’entraînent à écrire des nouvelles. Une tâche particulière consiste à écrire une histoire en moins de 15 minutes (les histoires seront ensuite examinées/notées par d'autres utilisateurs).

La page Web correspondante se compose d'un compte à rebours de 15 minutes, d'une zone de texte et d'un bouton d'envoi.

Les utilisateurs peuvent soumettre le formulaire avant l'expiration du compte à rebours. Mais que dois-je faire lorsque les utilisateurs ne soumettent pas le formulaire avant la fin du compte à rebours?

S'ils ont fini d'écrire l'histoire et n'ont tout simplement pas pris la peine de soumettre le formulaire, pas de problème: désactivez simplement la zone de texte et soumettez-la automatiquement.

Mais s'ils écrivent toujours activement, il serait vraiment difficile de verrouiller la zone de texte. Des phrases ou des mots incomplets peuvent être soumis de cette façon.

Comment dois-je l'implémenter?

Notez que ce n'est pas comme un examen formel où il est important pour des raisons d'équité que personne n'ait plus de temps. C'est juste pour le plaisir et ce ne serait pas un problème si quelqu'un obtient 1 minute de plus. Mais là encore, après cette minute supplémentaire, j'aurais le même problème si l'utilisateur tape toujours activement.

34
unor

Je ne dérangerais pas la zone d'édition de texte. Vous ne savez jamais où l'utilisateur modifie, alors laissez-la utiliser son temps dans la boîte comme elle le souhaite.

Au lieu de cela, je voudrais indiquer clairement à tout moment combien de temps il reste et montrer que la soumission sera automatiquement effectuée lorsque le temps sera écoulé, en faisant clignoter le bouton lorsque le temps est écoulé.

Dans la maquette ci-dessous, le texte du bouton "Soumettre" est remplacé par "30", clignotement, "29", clignotement, "28", clignotement, etc., et lorsque le temps est écoulé, un clic sur le bouton est simulé.

mockup

télécharger la source bmml - Wireframes créés avec Balsamiq Mockups

45
JOG

Vous pouvez simplement estomper le texte en fonction du temps supplémentaire, Fade = F(extra_time), donc à un moment donné, le texte disparaîtra. Ce n'est pas forcer et ne pas punir l'utilisateur.

En même temps, c'est un indicateur souple pour les autres utilisateurs de l'utilisation du temps supplémentaire pour ce texte. Cette fonctionnalité pourrait être utilisée pour engager les utilisateurs et leur donner des badges d'auteur "noir", "gris" ou "blanc", ce qui fait partie de la gamification.

La taille du texte pourrait également fonctionner, en supposant que la fonction Font_Size = F(extra_time).

enter image description here

26
Alexey Kolchenko

Comme extension à d'autres réponses, qui décrivent de bons conseils visuels pour les écrivains:

Vous pouvez soumettre automatiquement le texte en arrière-plan lorsque le temps est écoulé et indiquer à l'utilisateur qu'il est autorisé à apporter des modifications mineures, mais toutes les modifications après le délai seront marquées . C'est sa décision quand finalement soumettre. De cette façon, il n'y a pas de limite stricte. Ils peuvent finir leur phrase ou prendre un certain temps pour corriger les fautes d'orthographe.

mockup

télécharger la source bmml - Wireframes créés avec Balsamiq Mockups

Les autres utilisateurs prendront en compte les heures supplémentaires dans leur évaluation. Ainsi, abuser de cette fonctionnalité sera puni par la communauté.

19
Christian Strempfer

Cela me rappelle la technique utilisée par les enseignants en classe quand il est temps de passer à la leçon: "Veuillez terminer ce que vous faites et posez vos stylos." Les élèves ont un peu de temps pour se lancer dans une phrase ou deux mais ne font pas attendre 20 minutes à la classe.

Fournissez une minute (ou deux) de temps supplémentaire et limitez le nombre de caractères supplémentaires que votre utilisateur peut taper après la fin du compte à rebours initial (200 caractères, par exemple). De cette façon, s'ils atteignent la limite de temps au milieu de la phrase ou à mi-chemin, ils ont une chance de terminer ce qu'ils disaient, mais pas de lancer d'autres paragraphes.

Par exemple, si votre utilisateur a réussi à éliminer les éléments suivants à l'expiration des 15 minutes:

Lorem ipsum dolor sit amet, elect adipiscing consectetur. Fusce ipsum velit, commodo vel volutpat ut, vulputate quis eros. Donec a leo faucibus orci feugiat pharetra. Donec a dapibus orci, vehicula sagittis enim. Etiam bibendum elit quis augue rhoncus, à congue ma

En supposant 2 minutes de temps supplémentaire et 200 caractères supplémentaires limités, ils pourront terminer de taper:

Lorem ipsum dolor sit amet, elect adipiscing consectetur. Fusce ipsum velit, commodo vel volutpat ut, vulputate quis eros. Donec a leo faucibus orci feugiat pharetra. Donec a dapibus orci, vehicula sagittis enim. Etiam bibendum elit quis augue rhoncus, en congue massa sodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Cras in eros ut felis rhoncus ullamcorper.

Cela leur permet d'atteindre une fin naturelle plutôt qu'une phrase à moitié terminée ou un flux retardé.

8
Kai

Vous pourriez peut-être fournir à chaque utilisateur "temps d'écriture supplémentaire" - disons 5 minutes par jour maximum. Si l'utilisateur manque de temps, vous pouvez verrouiller le champ. L'utilisateur peut consulter ce qu'il a écrit et, s'il constate des erreurs, cliquer sur "Utiliser le temps supplémentaire" et utiliser X minutes de son allocation journalière. Vous pouvez peut-être compléter l'indemnité au fur et à mesure que l'utilisateur contribue - disons une minute supplémentaire pour chaque 15 minutes écrites, jusqu'au maximum. (À bien y penser, vous pourriez probablement leur vendre du temps supplémentaire, également, en tant que "crédit intégré").

6
Brendon

Notez que ce n'est pas comme un examen formel où il est important pour des raisons d'équité que personne n'ait plus de temps. C'est juste pour le plaisir et ce ne serait pas un problème si quelqu'un obtient 1 minute de plus. Mais là encore, après cette minute supplémentaire, j'aurais le même problème si l'utilisateur est toujours en tapant activement.

Pour prolonger cela, serait-ce un problème si quelqu'un avait encore quinze minutes de plus? Une option simple à mettre en œuvre serait de ne pas avoir de limite supérieure: il suffit de basculer la minuterie sur le comptage plutôt que sur le bas (peut-être en surbrillance, par exemple en rouge, après 15 m).

Toute soumission dépassée dans le temps pourrait avoir le temps supplémentaire indiqué à côté lors de l'examen des soumissions:

  • Un conte de trois villes - E. Dickens // Soumission normale
  • Profondeurs Wuthering (+ 05:32) - C. Brontë // Soumission tardive

Comme dans un jeu de golf, la réputation de la communauté comme quelqu'un mentionné ci-dessus rendra les gens conscients de rester aussi près que possible de la coupure de 15 mètres et ils se contrôleront.

4
anotherdave

Après 15 minutes, désactivez la zone de texte et activez-en une deuxième pour que l'utilisateur inclue des "mots supplémentaires".

Les examinateurs verront l'histoire complète, mais les 15 premières minutes seront d'une couleur différente.

N'oubliez pas non plus de désactiver le copier-coller dans vos zones de texte.

3
Marco Tck

OMI, la meilleure approche consiste à garder un affichage de minuterie constant dans le coin supérieur droit de la zone de texte. Et pour informer l'utilisateur avant le début du test que le contenu sera soumis automatiquement, ce qui garantira que tout votre public cible saura qu'il s'agit d'un scénario de saisie chronométré.

Si vous ouvrez une petite minuterie 30 secondes auparavant, cela n'aura aucun sens pour quelqu'un qui tape la tête baissée en regardant le clavier pendant une plus longue durée.

2
happybuddha

Quelques idées:

  1. Donnez une rétroaction continue pendant le processus de création sur le temps restant. Affichez une barre de progression et envisagez de modifier quelque chose dans la zone de texte pour les personnes qui se concentrent (la couleur de la police ou l'arrière-plan peut fonctionner). Les changements progressifs sont moins visibles que le retournement de la couleur du texte avec 5 minutes et 1 minute à gauche.

  2. Lorsque vous approchez de la fin - par exemple, à la dernière minute - apportez des modifications importantes à l'interface, par exemple, en changeant la couleur d'arrière-plan de la zone de texte.

  3. Lorsque le temps est écoulé, donnez une minute environ pour éditer le temps, appliqué avec des règles comme:

    • Empêchez toute modification qui augmente la longueur globale du texte. Cela permettra à l'auteur de corriger de nombreuses fautes de frappe et d'éditer les bits qui n'appartenaient pas, mais de ne rien écrire de "nouveau".

    • Détectez lorsque l'utilisateur ajoute plus de quelques nouveaux caractères à la fois et commencez à ralentir la vitesse à laquelle ils apparaissent. Par exemple, les trois premières lettres que vous tapez s'affichent en même temps, mais la quatrième est ralentie à une demi-seconde de retard, et la cinquième et les suivantes sont une seconde de retard complète, chacune. Pendant tout ce temps, l'horloge tourne. Le retour en arrière est toujours rapide, bien sûr. ;)

En combinaison, cela guidera l'utilisateur vers la fin de son essai sans lui donner un arrêt vraiment dur.

1
Alex Feinman

En tant qu'écrivain pratiquant de 15 minutes, je suppose que l'utilisateur doit savoir à tout moment combien de temps il lui reste. Lorsque nous sommes dans le parc, nous regardons nos montres de temps en temps.

Plus tard, lorsque vous êtes un écrivain plus expérimenté, vous savez automatiquement quand vérifier l'heure et quand vous devez terminer votre phrase actuelle et faire un examen rapide (lorsqu'il ne reste que 2-3 minutes). L'affichage constant de l'heure ne dérangera pas: lorsque vous écrivez, vous vous concentrez niquement sur la zone de texte, nulle part ailleurs.

Vous pouvez également avertir l'utilisateur à 12-13 minutes avec un fond de cadran clignotant que le temps est compté pour eux. Ensuite, la désactivation de la zone de texte une fois les 15 minutes écoulées ne sera pas difficile.

1
András Hummer

Je me demande si vous pouvez ralentir leur saisie une fois le délai écoulé - ils peuvent continuer mais il y a un délai progressivement plus long entre chaque pression de touche apparaissant à l'écran. S'ils veulent vraiment terminer une phrase, ils le peuvent, mais ils n'écriront pas la moitié d'un essai.

Cela pourrait bien fonctionner, mais il serait difficile de bien faire les choses - vous ne pouviez pas tamponner leurs touches ou ils tapaient en aveugle et revenaient dans 5 minutes quand tout était à l'écran, mais s'il rejetait les touches, ce serait frustrant aussi .

0
Tom