Born to be wired
698950 visites
Uptime 23 days

Youfo : le front-end pour Youpi

 13 septembre 2011  Bricolage  3 commentaires
L'interface utilisateur de Youfo

Avec la fin de mes travaux sur le back-end du robot Youpi, sauf remontée de bugs éventuelle, j’étais arrivé à la conclusion que je pouvais enfin passer à autre chose. Mais en même temps, j’avais sous la main un back-end plutôt abouti et pas avare en possibilités, et rien d’autre pour faciliter la manipulation du robot ou l’élaboration de scripts.

Je devais me rendre à l’évidence : il fallait que je réalise rapidement un petit front-end pour que le sujet soit bouclé. Libre ensuite aux gens de l’utiliser, de l’autopsier, et de l’adapter.

J’ai voulu un front-end pour un pilotage à la souris qui soit dans la mesure du possible léger et multiplateformes. Quoi de mieux qu’un front-end client léger accessible depuis n’importe quel navigateur — N’importe quel navigateur récent, s’entend. Fuck off IE6.

C’est de cette manière qu’est né Youfo (pour YOUpi FrOnt-end), une interface web ridiculement sobre, développée en quelques heures, articulée autour du framework jQuery et communiquant avec le back-end grâce à des messages Ajax/JSONP.

L'interface utilisateur de Youfo

L’interface utilisateur de Youfo

L’interface permet de piloter chacun des moteurs en cliquant sur le bouton approprié. Pour le fun, lors d’un survol des boutons, la partie du robot concernée par le mouvement se colorise sur l’image d’à côté.

En plus de cet aspect « pilotage en temps réel », à chaque fois que la position de l’ensemble du robot est satisfaisante, un clic sur le bouton au centre de l’écran permet de récupérer la position de tous les moteurs et enrichit le script dans la zone de texte. Il est ainsi possible de copier/coller le contenu de cette zone dans un shell qui, lorsqu’il est exécuté, rejoue les positions enregistrées de manière fluide et rapide.

Si vous considérez ces explications un peu abstraites, la vidéo suivante sera peut-être plus parlante :

Au final, même si cette interface reste dépouillée et souffre parfois d’un peu de lag, elle est facilement utilisable et elle démontre surtout un des gros avantages du back-end Youba : la possibilité d’écrire et d’intégrer au projet le front-end de son choix en très peu de temps. J’invite les bidouilleurs un peu curieux à regarder le code du cœur du front-end (resources/youfo.js) qui ne dépasse pas les 150 lignes.

À partir de là, on peut aussi envisager d’autres front-ends pour un pilotage au clavier, au joystick, à la Wiimote… Les plus motivés pourront décliner le produit en version un poil plus réactive grâce à une réécriture Java ou Qt… Il y a de quoi faire : amusez-vous, faites-vous plaisir.

Dernières recommandations :

  • Youfo nécessite une version de Youba >= 1.4
  • Les deux applications se trouvent sur la page des téléchargements.

Enjoy !

3 commentaires pour “Youfo : le front-end pour Youpi”

  1. gerossier

    Bonjour, juste un grand grand merci !!! Je tombe sur votre site en cherchant des informations sur le robot youpi, j’avais pour projet de créer une interface graphique pour faire piloter le robot à mes élèves de 4ème (je viens de trouver cette merveille au fond d’un local) et bien je n’ai plus besoin d’informations je vais me lancer dans un autre projet grâce à vous !!!!! J’ai hâte de retourner au collège demain pour tester votre interface ! Franchement BRAVOOOOOOOOOOOO !

  2. AlphaK

    Merci, n’hésitez pas à faire un retour au terme de vos tests ou si vous arrivez à utiliser cette application dans le cadre de vos cours :)

  3. francois

    Bon, moi aussi je suis tombé sur un robot dans ma réserve et je tente de le refaire marcher. Je suis aussi prof en collège, en Guadeloupe, mais déjà, après une AM à télécharger, chercher, installer et rien, y bouge pas le bougre… En plus, le Bios est bloqué par mdp, je suis en Win 7 32 bits, je ne sais pas si mon câble est fonctionnel, il fait un bruit de grésillement, mais reste bloqué. C’est con, tous les enfants qui le voient pose des questions. Si j’arrivais à leur faire pincer le nez, je serais érigé au rang de presque dieu…

Laisser un commentaire