Начална » UI / UX » Този 500 байта Javascript може да предскаже движението на курсора на потребителя

    Този 500 байта Javascript може да предскаже движението на курсора на потребителя

    Можете да направите някои наистина страхотни неща с JavaScript, а отвореният код прави работата още по-лесна.

    предупреждавам е една от най-готините библиотеки, които съм виждал и е построен с него само 500 байта на JavaScript. С този плъгин можете да откриете къде се движи мишката на потребителя и да предскажете към кой елемент се насочват.

    Това може да звучи като сложна идея, но е доста лесна за изпълнение. Да не говорим за това тон на възможност за разработчиците да създадат някои наистина страхотни ефекти като анимации преди прелитане или ефекти на динамично оформление.

    Започваш от насочване към елемент на страницата и определяне как ще изглежда когато потребителят се движи към този елемент.

    Всички изчисления се извършват на бекенда с библиотеката Premonish, така че не е нужно да се притеснявате за математиката или логиката зад това.

    Вместо това търсите начин да го направите се справят с прогнозата въз основа на доверително класиране на поведението на потребителя. Всичко това преминава в JavaScript, за да можете да пишете свои собствени функции се справят с поведението на потребителя.

    Ето едно примерен фрагмент от демо Premonish:

     premonish.onIntent ((el, confidence) => // el е очакваният DOM елемент // доверието е резултат от 0-1 за това колко сме уверени в това предсказание.); 

    Най- onIntent () Методът се пече в Premonish и се извиква всеки път, когато библиотеката забележи потребителят се движи към някакъв елемент.

    Можете също да използвате друг метод, onMouseMove (), който тече всеки път курсорът променя позициите X / Y на екрана. По този начин можете да видите как Premonish изчислява коефициентите на намерението на потребителя.

    Можете да намерите куп информация в главното репо GitHub, което включва прости кодови фрагменти за да започнете. Инициализацията просто изисква серия от селектори или DOM елементи които трябва да бъдат насочени.

    Как всъщност използвате този плъгин зависи изцяло от вас. Това не е предназначено да бъде цялостно решение, а по-скоро отправна точка, която да ви помогне поемат намеренията на потребителя и изграждане на опит около това.

    Разгледайте демо на живо за да видим как всичко това работи и да видим a “режим на отстраняване на грешки” където можете да наблюдавате как работи алгоритъмът за прогнозиране в реално време.

    Можете също така да споделите мислите си и да благодарите на създателя Матю Колън на неговия Twitter @mathisonian.