Vitaly Friedman aime le beau contenu et n'aime pas céder facilement. Lorsqu'il n'écrit pas ou ne prend pas la parole lors d'une conférence, il est probablement en train de courir… En savoir plus sur Vitaly Friedman …
Découvrez nos Cartes de contrôle des modèles d'interface intelligente un jeu de 100 cartes avec des questions à poser lors de la conception et de la construction de tout composant d'interface – carrousel, hamburger, table , sélecteur de dates, filtrage, saisie semi-automatique, configurateur, curseur, chronologie, carte, avis et témoignages, intégration, plan tarifaire, authentification, formulaires Web et bien d'autres. Vérifiez l'aperçu (PDF) et passez à la description ↓
Chaque composant de l'interface utilisateur, qu'il s'agisse d'un accordéon, d'un hamburger, d'un tableau de données ou d'un carrousel, apporte son unique défis. Trouver une nouvelle solution pour chaque problème prend du temps, et souvent ce n’est vraiment pas nécessaire. Nous pouvons nous fier aux modèles de conception intelligents et tests d'utilisabilité et poser les bonnes questions à l'avance pour éviter les problèmes ultérieurs.
Meet Listes de vérification des modèles de conception d'interface un jeu de 100 cartes ] avec des questions courantes à poser tout en traitant n'importe quel défi d'interface – des tables de données complexes et des formulaires Web aux hamburgers et carrousels gênants. De plus, de nombreux autres composants ( liste complète ↓ ), explorés en détail.
Chaque liste de contrôle a été organisée et affinée pendant des années par les vôtres – le tout basé sur des sessions d'utilisation des itérations de conception et des tests A / B. Utile pour les concepteurs et les développeurs frontaux pour discuter de tout ce dont un composant a besoin avant de commencer la conception ou le codage.
Et si vous souhaitez vous plonger dans les modèles de conception en direct assistez à notre prochains ateliers en ligne sur Modèles de conception d'interface intelligente, édition 2020 où nous explorerons des centaines d'exemples pratiques sur des sessions en direct de 5 × 2,5 heures.
À propos des listes de contrôle
Rencontrez 100 cartes de liste de contrôle avec tout ce dont vous avez besoin pour relever tous les défis de l'interface utilisateur – des tableaux complexes aux carrousels difficiles. Créé pour nous aider tous à garder une trace de tous les petits détails à concevoir et à construire de meilleures interfaces, plus rapidement . De plus, il est utile de ne rien oublier de critique et d'éviter des erreurs coûteuses sur toute la ligne. Vérifiez l'aperçu .
Lorsque nous travaillons sur à peu près n'importe quel problème d'interface, nous nous asseyons avec des concepteurs et des développeurs et parlons de sa conception, de son balisage et de son comportement – en utilisant des listes de contrôle. Le jeu crée un sens de l'alignement indispensable de sorte que tout le monde est sur la même page avant de se lancer dans des outils de conception ou de codage.
Magnifiquement conçu par notre cher illustrateur Ricardo Gi menes ce deck est toujours à vos côtés – sur votre bureau ou sur votre téléphone lorsque vous êtes en déplacement.
De plus, vous obtenez des exemples pratiques des points d'action et les listes de contrôle dans une résolution large (16 × 9) pour référence et présentations.
Petit bonus: 400 exemples pratiques, points d'action et la liste de contrôle en 16 × 9.
Vous 'obtiendrez:
100 cartes de listes de contrôle sur tout, des carrousels aux formulaires Web, soigneusement organisées et conçues,
Exemples pratiques et points d'action pour votre référence en 16 × 9, [19659017] Fichier texte modifiable pour s'adapter à vos besoins,
La saisie n'est jamais précise: les cibles touchées sont-elles au moins 48 × 48px?
Les utilisateurs peuvent-ils taper au même endroit pour annuler
Exposons-nous la navigation critique en bas sur mobile?
+
Dans l'ensemble, 14 questions dont:
Quelle icône choisissons-nous pour indiquer l'expansion?
] Les sections développées doivent-elles s'effondrer automatiquement?
L'utilisateur doit-il faire défiler automatiquement une fois développé?
+
Dans l'ensemble, 30 questions dont:
Les listes déroulantes apparaissent / disparaissent sur survoler, appuyer / cliquer ou les deux?
Les éléments de navigation apparaissent-ils dans une page entière / superposition partielle ou diapositive?
Pouvons-nous diviser la navigation verticalement pour les sous-menus sur mobile?
+
] Dans l'ensemble, 23 questions dont:
Pouvons-nous éviter une icône de hamburger et afficher la navigation telle quelle?
Que se passe-t-il lorsque l'utilisateur ouvre à la fois la recherche et hamburger?
Exposons-nous la navigation critique par défaut sur ordinateur / mobile?
+
Dans l'ensemble, 25 questions dont:
Exposons-nous les filtres populaires ou pertinents par défaut?
Est-ce que nous affichons le nombre de résultats attendus pour chaque filtre?
Appliquons-nous les filtres automatiquement ou manuellement sur le bouton «Appliquer»?
+
Globalement, 32 questions dont :
Répétons-nous le tri en bas de la liste de contenu?
Incluons-nous l'étiquette «Trier par» séparément des boutons / liste déroulante?
Le tri par défaut reflète-t-il la diversité de tous les principaux types de produits ?
Liste de contrôle de la saisie semi-automatique de la recherche
+
Dans l'ensemble, 33 questions y compris:
Faisons-nous apparaître des appels fréquents, des recherches populaires, des produits ou des catégories en haut des suggestions automatiques? [19659017] Sur quel caractère commençons-nous à afficher des autosuggestions?
Utilisons-nous un modèle d'anticipation f ou des requêtes de recherche?
+
Dans l'ensemble, 37 questions dont:
Pouvons-nous simplement afficher une grille d'images au lieu d'un carrousel?
Existe-t-il un moyen de mettre en pause un carrousel s'il est à rotation automatique?
Comment choisir la séquence des diapositives?
+
Dans l'ensemble, 28 questions dont:
Ajoutons-nous des étapes pour naviguer dans les colonnes ou des lignes de manière prévisible?
Est-ce que nous mettons en évidence la cellule, la ligne ou la colonne lorsque l'utilisateur tape / clique?
Avec des lignes sous forme de cartes sur mobile, exposons-nous des données pertinentes à des fins de comparaison?
+
Dans l'ensemble, 51 questions dont:
Combien de fonctionnalités voulons-nous afficher par plan?
Souhaitons-nous permettre aux clients de changer de devise (€ / $ / £)?
Pouvons-nous éviter vous avez besoin de données de carte de crédit pour la période d'essai gratuite?
+
Dans l'ensemble, 19 questions y compris:
Fournissons-nous une solution de secours pour la saisie de texte pour une saisie précise? [19659017] Y a-t-il des valeurs sur un curseur qui ne devraient pas accepter?
Les utilisateurs devraient-ils pouvoir «verrouiller» certaines valeurs?
+
Dans l'ensemble, 20 questions dont:
De quels préréglages («jour précédent» / «jour actuel») avons-nous besoin pour une navigation plus rapide?
Utilisons-nous un code couleur par points pour différents taux ou jours?
Comment éviter d'afficher les dates indisponibles ou zéro -résultats?
+
Dans l'ensemble, 33 questions dont:
Quel est le point d'entrée du configurateur?
L'utilisateur doit-il automatiquement passer à l'étape suivante une fois terminé? [19659017] Pour chaque étape, expliquons-nous et soulignons-nous les dépendances?
Liste de contrôle de comparaison des fonctionnalités
+
Dans l'ensemble, 27 questions y compris:
Les utilisateurs peuvent-ils voir uniquement les différences, les similitudes et attributs sélectionnés pour tous les produits / plans?
L'utilisateur peut-il déplacer les colonnes vers la gauche et la droite?
Devrions-nous demander aux clients de choisir un ttributes?
+
Dans l'ensemble, 24 questions dont:
Comment exposer / mettre en évidence les événements critiques (par ex. maintenant / à venir suivant)?
Certains événements ou segments de temps devraient-ils être disponibles / corrigés à tout moment?
Communiquons-nous les changements au fil du temps avec un histogramme sous-jacent?
Liste de contrôle des calendriers et des calendriers
+ [19659126] Dans l'ensemble, 25 questions y compris:
Fournissons-nous des sauts rapides entre les pistes?
Devrions-nous envisager de retourner l'en-tête de synchronisation de 90 degrés?
Est-ce que nous affichons ce qui se passe maintenant et
+
Dans l'ensemble, 26 questions dont:
Fournissons-nous un zoom? Combien de niveaux de profondeur le zoom offrira-t-il?
Une recherche à saisie semi-automatique aiderait-elle les utilisateurs à trouver des informations plus rapidement?
Pour les graphiques, pouvons-nous inverser l'axe pour utiliser l'espace disponible?
+
Dans l'ensemble, ] 23 questions dont:
Quels types de tarifs et de billets à prix réduit (senior, étudiant) avons-nous?
Avons-nous des avions ou des étages entre lesquels les utilisateurs doivent naviguer?
nous calculons et affichons un score d'expérience pour chaque siège?
+
Globalement, 44 questions y compris:
Pouvons-nous regrouper les données des utilisateurs selon une priorité faible / moyenne / élevée? [19659017] Pouvons-nous progressivement demander plus d'autorisations d'utilisateurs lorsque nous en avons besoin?
Demandons-nous des autorisations uniquement si nous sommes susceptibles de les obtenir?
+
Dans l'ensemble, 15 questions dont:
Pouvons-nous éviter les visites guidées d'introduction, les info-bulles, les assistants et les diaporamas comme ils sont généralement ignorés?
Utilisons-nous l'état vide pour ind
Quel est le bon moment pour afficher un élément particulier?
Liste de contrôle des critiques et des témoignages
+
Dans l'ensemble, 36 questions dont:
Pouvons-nous grouper les témoignages par une caractéristique / impact et les mettre en évidence ensemble?
Mettons-nous en évidence le nombre de témoignages / avis?
Est-ce que nous affichons le nom, la photo, le titre, l'âge, le lieu, le rôle, l'entreprise, le logo de la marque? [19659156] +
Dans l'ensemble, 76 questions dont:
Allons-nous utiliser des étiquettes flottantes? Si oui, sont-ils accessibles?
Pour un sélecteur de pays, affichons-nous certains pays comme fréquemment utilisés?
Indiquons-nous le nombre d'erreurs au-dessus du bouton «Soumettre» et dans le titre de l'onglet comme préfixe? [19659161] +
Dans l'ensemble, 32 questions dont:
Incluons-nous des témoignages ou des histoires à côté du formulaire de don?
Quels montants de dons suggérés affichons-nous, et combien?
Quels types de dons avons-nous: ponctuels, mensuels, trimestriels, annuels?
+
Globalement, 34 questions dont:
Quelles exigences de mot de passe voulons-nous / need to implement?
Avons-nous vraiment besoin de CAPTCHA, ou pouvons-nous utiliser à la place des honeypot / time traps?
Limitons-nous la fréquence des tentatives de récupération de mot de passe?
+
Overall, 76 questions y compris:
Quelle mise en page utilisons-nous pour la page (onglets, accordéons, une longue page, barre flottante)?
Est-ce que nous affichons l'aileron prix al (incl. expédition standard, taxes, frais de paiement, devise)?
Qu'affiche-t-on en cas de rupture de stock (notification par SMS / e-mail)?
+
Dans l'ensemble, 33 questions , y compris:
Comment pouvons-nous optimiser pour une saisie précise et des avances rapides (clavier, boutons)?
Utilisons-nous des extraits, une barre de popularité, un aperçu des moments clés?
Conserver la position de la vidéo piste en cours de rafraîchissement?
À propos de l'auteur
Vitaly Friedman aime le beau contenu et n'aime pas céder facilement. Lorsqu'il n'écrit pas ou ne prend pas la parole lors d'une conférence, il dirige très probablement des ateliers front-end / UX et des webinaires. Il adore résoudre des problèmes complexes d'UX, de front-end et de performances. Contactez-nous .
«Modèles de conception d'interface intelligente, édition 2020», atelier en ligne avec Vitaly Friedman (22 septembre – 6 octobre)
Voulez-vous approfondir les éléments de modèles de conception d'interface intelligente? Nous organiserons une série d’ateliers en ligne dans lesquels nous effectuerons un examen microscopique des composants d’interface courants et des solutions fiables pour les mettre au point, à la fois sur ordinateur et sur mobile
Nous étudierons des centaines d'exemples triés sur le volet et nous concevrons des interfaces en direct des méga-menus déroulants et des configurateurs de voiture – jusqu'aux chronologies et à l'intégration. Et: nous examinerons et fournirons des commentaires sur le travail de chacun. Consultez tous les sujets et le calendrier .
Atelier de modèles de conception d'interface intelligente de Vitaly divisé en 5 séances de 2,5 h, avec des centaines d'exemples pratiques.
L'atelier est dispensé en cinq sessions de 2,5 heures avec beaucoup de temps pour vous permettre de poser toutes vos questions. Il s'adresse aux concepteurs d'interfaces, aux concepteurs frontaux et aux développeurs qui aimeraient être prêts à relever tous les défis qui se présentent.
Vous repartirez avec une boîte à outils de techniques pratiques pour votre produit, site Web , une application de bureau ou une application mobile.
Merci pour votre soutien!
Nous espérons sincèrement que les connaissances que vous tirerez de nos petits cadeaux vous aideront à améliorer vos compétences tout en vous faisant de nouveaux amis merveilleux. Un sincère merci pour votre aimable soutien continu, votre patience et votre générosité – pour être fracassant, maintenant et à jamais. ❤️
More Smashing Stuff
Ces dernières années, nous avons été très chanceux d'avoir travaillé avec des personnes talentueuses et attentionnées de la communauté Web pour publier leur riche expérience sous forme de livres imprimés qui résistent à l'épreuve du temps . Paul et Alla font partie de ces personnes. Avez-vous déjà consulté leurs livres?