de.hideout-lastation.com
Paradies Für Designer Und Entwickler


Dieses 500-Byte-Javascript kann die Cursorbewegungen des Benutzers vorhersagen

Sie können einige wirklich coole Dinge mit JavaScript machen und Open-Source-Code macht die Arbeit noch einfacher.

Premonish ist eine der coolsten Bibliotheken, die ich je gesehen habe, und es ist mit nur 500 Bytes JavaScript erstellt . Mit diesem Plugin können Sie erkennen, wohin sich die Maus bewegt und vorhersagen, auf welches Element sie sich bewegen.

Das hört sich vielleicht nach einer komplexen Idee an, ist aber relativ einfach zu implementieren. Ganz zu schweigen davon, bietet dies eine Menge Möglichkeiten für Entwickler, um einige wirklich coole Effekte wie Pre-Hover-Animationen oder dynamische Layout-Effekte zu erstellen.

Sie beginnen mit dem Targeting eines Elements auf der Seite und legen fest, wie es aussieht, wenn sich der Benutzer auf dieses Element zubewegt.

Alle Berechnungen werden im Backend mit der Premonish-Bibliothek ausgeführt, sodass Sie sich keine Gedanken über die Mathematik oder Logik dahinter machen müssen.

Stattdessen suchen Sie nach einer Möglichkeit, die Vorhersage basierend auf einem Konfidenz-Ranking des Benutzerverhaltens zu verarbeiten. Dies wird alles in JavaScript übergeben, so dass Sie Ihre eigenen Funktionen schreiben können, um das Benutzerverhalten zu behandeln .

Hier ist ein Beispielausschnitt aus der Premonish-Demo:

 premonish.onIntent (({el, confidence}) => {// el ist das erwartete DOM-Element // confidence ist ein Ergebnis von 0-1 darüber, wie zuversichtlich wir in dieser Vorhersage sind.}); 

Die onIntent() -Methode wird in Premonish eingebettet und sie wird immer dann aufgerufen, wenn die Bibliothek bemerkt, dass ein Benutzer auf ein Element zugreift.

Sie können auch eine andere Methode verwenden, onMouseMove(), die jedes Mal ausgeführt wird, wenn der Cursor X / Y-Positionen auf dem Bildschirm ändert . Auf diese Weise können Sie sehen, wie Premonish die Wahrscheinlichkeit der Nutzerabsicht berechnet.

Sie finden eine Reihe von Informationen im Haupt-GitHub Repo, die einfache Code-Snippets enthalten, um Ihnen den Einstieg zu erleichtern. Die Initialisierung erfordert nur eine Reihe von Selektoren oder DOM-Elementen, auf die abgezielt werden soll.

Wie Sie dieses Plugin tatsächlich nutzen, liegt ganz bei Ihnen. Dies soll keine vollständige Lösung sein, sondern vielmehr ein Ausgangspunkt, um Ihnen dabei zu helfen, die Absichten des Benutzers zu übernehmen und eine Erfahrung daraus zu machen.

Sehen Sie sich die Live-Demo an, um zu sehen, wie das alles funktioniert, und sehen Sie sich einen "Debug-Modus" an, in dem Sie sehen können, wie der Vorhersagealgorithmus in Echtzeit funktioniert.

Du kannst deine Gedanken auch teilen und dem Schöpfer Matthew Conlen auf seinem Twitter @mathisonian danken.

Überwachen Sie die Akkulaufzeit des Bluetooth Gadgets mit BatON

Überwachen Sie die Akkulaufzeit des Bluetooth Gadgets mit BatON

So nützlich wie Bluetooth-Geräte sind, eines der größten Probleme, die ich mit ihnen habe, ist die Tatsache, dass das Verfolgen des Batterie-Levels ziemlich nervig sein kann, besonders bei Bluetooth-Headsets. Wenn Sie kein Fan davon sind, nur das LED-Licht zu überprüfen, um eine Vorstellung davon zu bekommen, wie lange dieses Zubehörteil noch halten kann, gibt es eine Android-App namens BatON , die Ihnen sagt, wie viel Saft Ihr Zubehörteil noch hat .BatON i

(Tech- und Design-Tipps)

Die Moments-Funktion von Twitter ist jetzt auf iOS und Android verfügbar

Die Moments-Funktion von Twitter ist jetzt auf iOS und Android verfügbar

Im September führte Twitter eine Funktion namens Moments ein, mit der Nutzer mithilfe von Tweets und Fotos personalisierte Geschichten erstellen können. Zuvor konnten Benutzer nur Momente auf der Web-Version von Twitter erstellen, aber das sind die Nachrichten von gestern. Ab heute können Nutzer Momente aus der iOS- oder Android-App von Twitter erstellen.Um

(Tech- und Design-Tipps)