Maquetter des interfaces utilisateur web ou web mobile Flashcards
Qu’est-ce que prototyper une application ?
Prototyper une application consiste à créer une version simplifiée et interactive de l’application pour visualiser, tester et valider son design avant le développement final. On combine l’UI et l’UX.
C’est quoi l’UI, c’est quoi l’UX ? quelle sont les différences entre les deux ?
L’UI (User Interface/Interface Utilisateur) se concentre sur l’aspect visuel et les éléments interactifs comme par exemple les couleurs, la typographie, les boutons et les formulaires..
L’UX (User Experience/Expérience Utilisateur) concerne l’expérience globale de l’utilisateur comme raccourcir le nombre de clic nécessaire pour arriver sur une page, la vitesse de chargement des pages, l’accesibilité… Le moteur de recherche vous suggère les produits dès que vous commencez à taper, L’application se souvient de vos informations de paiement pour faciliter les futurs achats…
Qu’est-ce que l’éco-conception ? Donnez des exemples d’utilisation d’éco-conceptions lors du maquettage d’une application.
L’éco-conception consiste à minimiser l’impact environnemental d’un produit. Par exemple, on peut privilégier des couleurs sombres pour réduire la consommation d’énergie des écrans et optimiser les éléments pour limiter la charge sur les serveur et les temps de chargement.
Un client vous dit : “bon, on a discuté ensemble du projet et je sens bien que tu as compris ce dont j’ai besoin, ne t’embête pas à prendre du temps pour faire des wireframes & maquettes, tu peux foncer sur le code !”. Comment réagissez vous ?
Je lui expliquerais que les wireframes et maquettes sont essentiels pour valider le design et les fonctionalités besoins avant de coder, afin d’éviter des malentendus coûteux en temps et en ressources pendant le développement.
Qu’est ce que l’accessibilité ?
L’accessibilité consiste à concevoir des produits utilisables par tous, notamment pour les handicapés. Exemples d’accesibilité :
- Utilisation de la balise alt pour permettre de décrire les images aux personnes malvoyantes.
- Haut contraste de couleurs entre le fond et le texte.
- Lisibilité du texte avec des polices de grande tailles.
Pour rendre mon site accessible, sur quel document de référence je peux me baser pour suivre les bonnes pratiques ?
Utiliser la RGAA (Référentiel Général d’Amélioration de l’Accessibilité) qui fournit des recommandations pour améliorer l’accessibilité des contenus web.
Qu’est-ce qu’un dark pattern ? Pouvez vous me citer des exemples ?
Un dark pattern est une d’interface utilisateur qui manipule les utilisateurs pour les pousser à effectuer des actions non désirées.
Par exemple, des abonnements difficiles à annuler, des options cachées pour refuser des cookies ou un faux compteurs d’urgence pour inciter à un achat rapide.
C’est quoi un wireframe ?
Un wireframe est une représentation simplifié de l’interface utilisateur. On se concentre sur la structure, l’organisation et les fonctionalités de la page, sans se focaliser sur les détails visuels ou graphiques. On se concentre sur l’UX et pas sur l’UI.
C’est quoi une maquette ?
Une maquette est une représentation visuelle détaillée de l’interface utilisateur, on met l’accent sur l’UI en incluant les couleurs, les typographies, les images… On visualise l’apparence finale d’une application ou d’un site web.
Quelle est la différence entre un wireframe et une maquette ?
Un wireframe est une représentation simplifiée qui se concentre sur la structure et les fonctionnalités d’une interface, tandis qu’une maquette est une version visuellement détaillée qui représente l’apparence finale d’une application ou d’un site web.
Quelle est la différence entre une maquette et un prototype ?
Une maquette est une représentation visuelle statique de l’interface, tandis qu’un prototype est une version interactive permettant de simuler les fonctionnalités et les parcours utilisateur.