hideout-lastation.com
Paradis Pour Les Concepteurs Et Les Développeurs


Ce Javascript peut prédire les mouvements du curseur de l'utilisateur de 500 octets

Vous pouvez faire des choses vraiment cool avec JavaScript et le code source ouvert rend le travail encore plus facile.

Premonish est l'une des bibliothèques les plus cool que j'ai vues et elle est construite avec seulement 500 octets de JavaScript . Avec ce plugin, vous pouvez détecter où la souris de l'utilisateur se déplace et prédire l'élément vers lequel il se dirige.

Cela peut sembler une idée complexe, mais il est assez facile à mettre en œuvre. Sans compter que cela offre une tonne d'opportunité pour les développeurs de créer des effets vraiment cool tels que des animations pré-hover ou des effets de mise en page dynamiques .

Vous commencez par cibler un élément sur la page et définissez son apparence lorsque l'utilisateur se déplace vers cet élément.

Tous les calculs sont effectués sur le backend avec la bibliothèque Premonish, vous n'avez donc pas besoin de vous soucier des maths ou de la logique derrière cela.

Au lieu de cela, vous cherchez un moyen de gérer la prédiction basée sur un classement de confiance du comportement de l'utilisateur. Tout cela est passé en JavaScript, vous pouvez donc écrire vos propres fonctions pour gérer les comportements de l'utilisateur .

Voici un exemple d'extrait de la démo de Premonish:

 premonish.onIntent (({el, confidence}) => {// el est l'élément DOM attendu // confiance est un score de 0-1 sur la confiance que nous avons dans cette prédiction.}); 

La méthode onIntent() est précuite dans Premonish et elle est appelée chaque fois que la bibliothèque remarque qu'un utilisateur se déplace vers un élément .

Vous pouvez également utiliser une autre méthode, onMouseMove(), qui s'exécute chaque fois que le curseur modifie les positions X / Y sur l'écran. De cette façon, vous pouvez voir comment Premonish calcule les probabilités d'intention de l'utilisateur.

Vous pouvez trouver un tas d'informations dans le dépôt principal GitHub qui comprend des extraits de code simples pour vous aider à démarrer. L'initialisation nécessite simplement une série de sélecteurs ou d'éléments DOM qui doivent être ciblés.

Comment vous utilisez réellement ce plugin est totalement à vous. Ce n'est pas une solution complète, mais plutôt un point de départ pour vous aider à prendre en compte les intentions des utilisateurs et à construire une expérience autour de cela.

Découvrez la démo en direct pour voir comment tout cela fonctionne et pour voir un "mode de débogage" où vous pouvez regarder comment l'algorithme de prédiction fonctionne en temps réel.

Vous pouvez également partager vos pensées et dire merci au créateur Matthew Conlen sur Twitter @mathisonian.

Générer de la documentation avec des fichiers Markdown à l'aide de Docsify

Générer de la documentation avec des fichiers Markdown à l'aide de Docsify

Si vous créez un plug-in gratuit, un framework ou un script open-source, vous aurez besoin de documentation . Il est crucial de documenter votre travail, à la fois pour votre santé mentale et pour aider les autres qui veulent apprendre votre ressource impressionnante.Cependant, la création de documentation en ligne peut être très pénible. Heure

(Conseils techniques et de conception)

Obtenir des schémas de couleurs générés à partir de Stock Photos avec ColorPalettes.net

Obtenir des schémas de couleurs générés à partir de Stock Photos avec ColorPalettes.net

La photographie professionnelle a les meilleures couleurs puisqu'elles sont tirées directement de la vie. Mais le schéma de couleurs d'une photo ne se traduit pas bien dans une interface sans effort.C'est là que ColorPalettes.net peut vous aider. C'est une ressource de couleur gratuite qui organise des palettes basées sur des photos de stock . Ch

(Conseils techniques et de conception)