Lieu

Page d’accueil > Icone Transfert > icone (+)

1) Contexte & objectif

Nom de l’écran : Nouveau destinataire
But : Collecter les informations minimales (nom + numéro) pour créer un destinataire ad-hoc et poursuivre un transfert sans l’enregistrer dans les contacts.

Résultat attendu : L’utilisateur saisit un nom et un numéro, l’app valide et préremplit le code pays (+225), vérifie l’existence d’un compte (IretiPay dans l’exemple), puis passe à l’étape suivante du transfert (montant, récapitulatif, etc.).

2) Structure & contenu

En-tête

• Bouton retour (flèche) → revient à l’écran précédent (ex. liste de bénéficiaires/transfert).
• Titre : Nouveau destinataire.
• Sous-titre : Remplissez les informations ci-dessous pour procéder au transfert (helper text).

Formulaire

1. Nom du destinataire(champ texte)
   • Icône personne.
   • Placeholders explicites, format libre mais contrôles basiques.
2. Numéro du destinataire(champ numérique)
   • Icône téléphone.
   • Info opérateurs en aide contextuelle : Orange (07/05), MTN (02/04/06), Moov (01)…
   • Le code pays +225 est ajouté automatiquement.

Encadré d’information (vert)

• Titre : Transfert d’argent.
• Points clés :
  • Ces informations seront utilisées pour ce transfert uniquement.
  • Le destinataire ne sera pas ajouté à vos contacts.
  • Le code pays +225 sera automatiquement ajouté au numéro.
  • Vérification si le numéro possède un compte IretiPay.
  • Vérifiez bien le nom et le numéro avant de continuer.

CTA principal

• Bouton : Continuer le transfert (bleu).
• État : désactivé tant que le formulaire n’est pas valide.

Navigation (barre inférieure)

• Accueil, Factures, Devises, Réglages.
• Bouton flottant QR (bleu) → entrée rapide via scan (optionnel pour ce flux).

3) Règles fonctionnelles

1. Champ Nom
   • Obligatoire.
   • Longueur : 2–50 caractères.
   • Autorisés : lettres (accentuées), espaces, tirets, apostrophes.
   • Interdits : chiffres seuls, emojis, caractères de contrôle.
2. Champ Numéro
   • Obligatoire.
   • Préfixe +225 (Côte d’Ivoire) ajouté automatiquement si absent.
   • Format E.164 : +225XXXXXXXXXX (10 chiffres après l’indicatif).
   • Prévalidation opérateur (facultative) :
     • Orange : 07 + 8 chiffres
     • MTN : 05 + 8 chiffres
     • Moov : 01 + 8 chiffres
       (Adapter selon la nomenclature la plus récente.)
3. Validation & états
   • Le bouton Continuer s’active uniquement si nom et numéro sont valides.
   • À la soumission :
     • Vérification d’existence du compte destinataire (IretiPay).
     • Si existe → passer à l’écran montant.
     • Si n’existe pas → proposer transfert via mobile money (selon opérateur) .
4. Contacts
   • Ce destinataire n’est pas enregistré en contacts (usage ponctuel).
5. Gestion des erreurs
   • Numéro invalide : Numéro non valide. Vérifiez l’indicatif et la longueur.
   • Nom invalide : Nom incomplet.
   • Compte inexistant : Ce numéro n’est pas inscrit. Voulez-vous continuer via mobile money ?

4) UX & accessibilité

• Clavier numérique forcé sur le champ numéro.
• Masque/formatage : afficher +225 en préfixe non éditable, champ pour 10 chiffres.
• Auto-espace / anti-collage : filtrer les caractères non numériques, ignorer espaces.
• Labels et aides lisibles, contraste WCAG AA.
• Lecteurs d’écran :
  • Champ nom : “Nom du destinataire, requis”.
  • Champ numéro : “Numéro du destinataire, code pays +225 ajouté automatiquement”.
  • Encadré : “Information : Transfert d’argent. …”
  • Bouton : “Continuer le transfert, désactivé/activé”.
• Erreurs : texte + bordure rouge + description ARIA.
• Prévention des fautes : confirmer le numéro au prochain écran (récapitulatif).