Recherche
Présentation
Le modèle de recherche sert d'outil de découverte qui permet aux utilisateurs d'explorer rapidement une application à l'aide de mots-clés.
Le placement du champ de recherche dépend de l'architecture de votre application et de l'étendue de la recherche. Une recherche globale portera sur l'ensemble d'une application, tandis qu'une recherche sur une page ou une recherche dans une table de données portera sur une base de données spécifique.
Le modèle de recherche couvre les types de recherche suivants :
- Recherche simple
- Recherche avancée
- Recherche mobile
Quand l'utiliser
À utiliser chaque fois qu'une recherche doit être effectuée dans l'application.
| Type | Finalité | Cas d'utilisation |
|---|---|---|
| Recherche simple | Permet d'effectuer une recherche dans l'ensemble de la base de données d'une application. | Une recherche globale qui redirige vers une page unique ou une page de résultats de recherche. Par exemple, un apporteur recherchant un compte dans son portail. |
| Recherche avancée | Permet de limiter l'étendue de la recherche à l'aide de filtres et d'identifiants uniques. La recherche avancée recherche uniquement le sous-ensemble de la base de données déterminé par l'utilisateur. Elle combine les fonctionnalités de la recherche simple et une liste déroulante, ce qui permet aux utilisateurs d'ajouter des paramètres de recherche. |
|
| Recherche mobile | Permet d'effectuer une recherche simple dans des applications grand public comme CustomerEngage Account Management. Les applications d'entreprise utilisent rarement la recherche mobile. Cela est dû à la complexité du type de recherche effectuée par les apporteurs. Le schéma est le même sur ordinateur et sur mobile. | L'utilisateur effectue une recherche simple dans son gestionnaire de compte. |
Le modèle de recherche peut prendre en charge plusieurs cas d'utilisation différents. Ce modèle pose les bases de ce à quoi ressemblera votre recherche. Il conserve sa cohérence, qu'il s'agisse d'une recherche sur une page, d'une recherche dans une table de données ou d'une recherche globale.
Structure
Recherche simple
Icône de recherche (obligatoire) : affiche une icône dans la barre de recherche. Cette icône est dynamique et change en fonction du statut de la recherche. Une icône de fermeture s'affiche également lorsque la recherche est active.
Résultats de la recherche avancée
Voici un exemple de page de résultats de recherche avancée, dans laquelle les utilisateurs peuvent ajouter des paramètres de recherche supplémentaires pour obtenir une recherche plus précise :
Directives générales
- Utilisez le texte d'espace réservé pour demander à l'utilisateur ce qui doit être recherché.
- Lorsqu'une recherche ne donne aucun résultat, proposez des suggestions sur la façon d'afficher les résultats. Par exemple, « Essayez d'ajuster votre recherche ou votre filtre pour obtenir de meilleurs résultats ». Vous pouvez également inclure des actions, comme un lien redirigeant vers une ligne d'assistance.
- Communiquez avec l'utilisateur lorsqu'une recherche est en cours de chargement. Utilisez un chargeur de page avec du texte donnant des indications utiles ou une estimation de la durée de la recherche.
Contenu
Directives générales relatives à la rédaction
- Mettez une majuscule en début de phrase pour tous les aspects relatifs à la conception des interfaces de produit Guidewire. Ne mettez pas la 1re lettre du 1er mot du titre en majuscule.
- Utilisez des verbes au présent et la forme active dans la plupart des cas.
- Utilisez des contractions courantes pour donner à votre texte un ton plus naturel et informel.
- Utilisez un langage simple. Évitez tout jargon inutile et les formulations complexes.
- Utilisez des termes et des phrases concis.
Comportements
État par défaut
L'état par défaut du modèle de recherche contient du texte fictif et une icône.
Le texte fictif sert de conseil sur les éléments que les utilisateurs peuvent rechercher dans votre application. Par exemple, une application apporteur peut saisir le texte suivant : « Rechercher des comptes, des polices et des documents ».
État actif
Lorsque la recherche est active, l'icône de recherche est remplacée par l'icône Fermer. L'icône de fermeture efface les caractères de la barre de recherche.
Réactivité
Ordinateur de bureau : 360 pixels
Largeur max. mobile : 246 pixels
Le modèle de recherche est conçu de telle sorte qu'il ne nécessite qu'un minimum de modifications lorsqu'il est utilisé sur un smartphone. Les champs de saisie sont réactifs dans la vue mobile. La version ordinateur et la tablette partagent les mêmes valeurs.
Création de thèmes
Par défaut, le thème et la marque correspondent à ceux de l'application, sauf s'ils sont remplacés.
Il est possible de donner un thème aux modèles pour répondre à des exigences spécifiques en matière de valorisation de la marque et aux besoins des clients. Cela inclut des éléments visuels tels que les couleurs, la typographie, les icônes, les boutons et d'autres composants et éléments graphiques.
En savoir plus sur les thèmes avec les jetons de conception
Prise en charge de la recherche
La recherche de ce modèle a consisté en une analyse concurrentielle. L'analyse concurrentielle est une technique de recherche que vous pouvez utiliser pour comparer et comprendre ce sur quoi les autres travaillent dans le même domaine. Les concepteurs UX ont analysé les modèles d'autres bibliothèques de conception. Ils ont recherché les forces et les faiblesses relatives, les tendances et les différences. Les concepteurs ont pris ces informations, trouvé des points communs et créé un modèle basé sur ces pratiques.
Composants associés
Ressources
Téléchargez un fichier ZIP contenant tous les derniers modèles Jutro et commencez à concevoir des expériences.