Bibliothèque de mouvements · 03 / 10

Boutons et appels à l'action

Le bouton pilule dans toutes ses vies : le halo doré du site et ses variations, l'attraction, la lumière qui balaie, l'appui, l'envoi confirmé, le bouton flottant et les bandes d'appel.

061

Halo doré, respiration

Bouton « Être rappelé » de l'en-tête et de la bande d'ouverture d'index.html : le halo de référence du site.

CSSboucle
062

Halo en onde double

Bouton « Prendre rendez-vous » de la page Groupe, quand il est seul sur une bande sombre.

CSSboucle
063

Liseré de lumière tournant

Bouton « Estimer mon fonds » en tête de la page Cession : un fil d'or fait le tour de la pilule.

CSSbouclesurvol
064

Attraction magnétique

Bouton « Déposer un dossier » sous le simulateur : il vient au-devant du pointeur, sans jamais quitter sa place.

Approchez le pointeur du bouton.
JSsurvol
065

Reflet qui balaie

Bouton « Être rappelé » de la page d'attente Locatif : un reflet traverse l'or au survol.

CSSsurvol
066

Lueur qui suit le pointeur

Boutons secondaires des bandes sombres du Groupe : la lueur dorée des pavés, ramenée à l'échelle du bouton.

CSSJSsurvol
067

Bordure qui se dessine

Bouton « Voir les annonces » à l'entrée de la section des annonces de cession.

SVGCSSvue
068

Remplissage qui monte

Bouton contour de la page d'attente Locatif : l'ocre du pôle monte comme un niveau.

CSSsurvol
069

Flèche qui voyage

Bouton « Déposer un dossier » à la fin des étapes du recouvrement.

CSSsurvol
070

Pastille qui s'étend

Bouton « Estimer mon fonds » du pavé Cession d'index.html : le point grenat devient le bouton.

CSSsurvol
071

Appui et relâche

Tous les boutons du site : l'enfoncement est net, le retour a le ressort de la maison.

Appuyez, puis relâchez.
CSSclic
072

Onde d'appui

Bouton flottant « Être rappelé » sur téléphone : l'onde part du doigt et confirme le toucher.

JSclic
073

Dépôt : du libellé à la confirmation

Dépôt de pièces du portail : le bouton « Déposer un dossier » se resserre, compte les pièces, puis confirme.

Exemple · dépôt de pièces

Votre facture impayée, en trois pièces

  • FactureEn attenteReçue
  • Bon de commandeEn attenteReçue
  • Relance déjà envoyéeEn attenteReçue

Démonstration : aucune pièce n'est transmise.

CSSSVGJSclic
074

Arrivée du bouton flottant

Bouton flottant « Être rappelé » de toutes les pages : il n'arrive que lorsque le bouton de la bande d'ouverture a quitté l'écran, et s'efface devant le formulaire.

JurisViva

Trois métiers, un même interlocuteur.

Faites défiler ↓
Créance

Le recouvrement de vos factures impayées.

Cession

La cession de fonds de commerce et de murs commerciaux.

Locatif

La gestion locative commerciale, un pôle en préparation.

Être rappelé

Ici, le formulaire prend le relais : le bouton flottant s'efface.

JSCSSdéfilementimage BFL
075

Repos du bouton flottant

Bouton flottant en lecture longue (pages légales, annonces) : il se replie en pastille et se rouvre au survol.

Au repos, le bouton se replie et laisse la page respirer. Approchez-vous : il se rouvre.

CSSJSboucle
076

Duo principal et secondaire

Paire de boutons de la bande d'ouverture de la page Créance : le principal se pose, le second le suit.

Recouvrement

Une facture impayée ?

CSSvue
077

Bascule de priorité

Pied de page et page « Prendre rendez-vous » : une seule plaque d'or pour deux actions, elle suit le regard.

CSSJSsurvol
078

Bande d'appel sur photographie

Bande d'appel finale d'index.html et de la page Créance : le bleu-vert glisse sur la photographie, le bouton or arrive en dernier.

Factures impayées

Vos factures impayées méritent une réponse.

Déposez votre dossier en ligne, ou demandez à être rappelé par un interlocuteur.

CSSvueimage BFL
079

La photographie devient bouton

Transition vers la bande d'appel d'une page de pôle : au défilement, l'image se resserre jusqu'à la pilule et se change en or.

Un geste suffit

Poussez la porte.

Vos pièces se déposent en ligne, depuis votre espace.

JSCSSdéfilementimage BFL
080

Bouton de verre sur photographie

Vignette « Prendre rendez-vous » posée sur une photographie : le verre s'éclaire d'or, l'image glisse sous le pointeur.

Parlons de votre dossier.

CSSJSsurvolimage BFL
081

Surlignage de lien

Liens dans les paragraphes de la page Cession et des pages légales : le filet d'or devient surlignage.

Vous cédez un fonds de commerce ou des murs commerciaux ? Commencez par estimer votre fonds, ou prenez le temps de voir les annonces en cours.

CSSsurvol
082

Trait relais

Liens d'action du pied de page et de la page d'attente Locatif : le filet gris sort, le filet d'or prend le relais.

CSSsurvol
083

Boutons-icônes

Barre d'actions rapides de l'en-tête sur téléphone : l'icône reprend le geste des pavés du site.

CSSsurvol
084

Anneau de lecture

Fiche d'une annonce de cession : l'anneau du bouton « Voir les annonces » se remplit avec la lecture, puis le bouton s'allume.

Exemple d'annonce

Fonds de commerce de restauration, centre-ville

Faites défiler ↓

Emplacement : rue commerçante, à proximité des transports.

Local : une salle, une cuisine équipée, une réserve.

Bail commercial en cours ; les conditions sont communiquées sur demande.

Un dossier de présentation est remis après un premier échange.

La visite se fait sur rendez-vous, en dehors des heures d'ouverture.

Cette annonce est un exemple de mise en page : elle ne correspond à aucun bien réel.

JSSVGdéfilement
085

Choix segmenté des trois pôles

Aiguillage d'index.html et de la prise de rendez-vous : le curseur prend la couleur du pôle, le bouton d'action change avec lui.

Votre besoin

Une facture impayée à recouvrer auprès d'un client.

CSSJSclic
086

Interrupteur

Page d'attente Locatif : la case « être rappelé à l'ouverture du pôle » devient un interrupteur ocre.

Démonstration : rien n'est enregistré.

CSSclic
087

Copier la référence

Fiche d'une annonce de cession : copier la référence pour la citer lors d'un rendez-vous.

Référence de l'annonceEXEMPLE-0000
CSSJSclic
088

Enregistré : le signet

Cartes des annonces de cession : garder une annonce de côté, l'or monte dans le signet et un avis le confirme.

Exemple d'annonce

Boulangerie, fonds de commerce

Annonce fictive, pour illustration.

CSSJSclic
089

Le bouton s'éveille à la saisie

Formulaire « Être rappelé » : la bordure d'or avance avec les chiffres du SIRET, puis le bouton s'allume.

0 / 14 chiffres · démonstration, rien n'est transmis.

SVGJSsaisie
090

Signature d'appel : trois métiers, un geste

Bande finale de la page Groupe : l'emblème se trace, les trois actions des pôles se posent, le rendez-vous s'allume en dernier.

Trois métiers, un seul geste.

Créance
Cession
Locatif